/* Husprosjekt app board — minimal, premium Bolighai */
.hp-board {
  position: relative;
  min-height: calc(100vh - 140px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem 1rem 3rem;
}
.hp-board-center {
  width: min(920px, 100%);
  text-align: center;
}
.hp-board-mascot {
  width: 148px; height: 148px; object-fit: contain;
  border-radius: 50%;
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  border: 2px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  padding: .4rem;
  margin-bottom: .85rem;
}
.hp-board-title {
  font-size: clamp(1.45rem, 3.5vw, 2rem);
  letter-spacing: -0.03em;
  margin: 0 0 .5rem;
  font-weight: 800;
}
.hp-board-sub { max-width: 36rem; margin: 0 auto 1.5rem; }
.hp-board-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .85rem;
}
@media (max-width: 720px) {
  .hp-board-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 420px) {
  .hp-board-grid { grid-template-columns: 1fr; }
}
.hp-board-card {
  display: flex; flex-direction: column; align-items: center; gap: .65rem;
  padding: 1.25rem 1rem 1.15rem;
  border-radius: 16px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  text-decoration: none; color: inherit;
  box-shadow: var(--shadow);
  transition: border-color .15s, transform .15s, box-shadow .15s;
  min-height: 220px;
  justify-content: center;
}
.hp-board-card img {
  width: 150px; height: 150px;
  object-fit: contain;
  border-radius: 20px;
  flex-shrink: 0;
}
.hp-board-card strong { font-size: 1.05rem; font-weight: 750; }
.hp-board-card:hover {
  border-color: var(--brand);
  transform: translateY(-2px);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand) 35%, transparent), var(--shadow);
}
.hp-lib-fab {
  position: fixed; top: 5.5rem; right: 1rem; z-index: 40;
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .55rem .85rem; border-radius: 999px;
  background: var(--bg-elev); color: var(--text);
  border: 1.5px solid var(--brand);
  text-decoration: none; font-weight: 700; font-size: .9rem;
  box-shadow: 0 4px 16px color-mix(in srgb, var(--brand) 20%, transparent);
}
.hp-lib-fab:hover { background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev)); }
.hp-lib-fab-icon { font-size: 1.1rem; line-height: 1; }

.hp-app-shell { max-width: 980px; margin: 0 auto; padding-bottom: 2.5rem; }
.hp-app-bar {
  display: flex; align-items: center; gap: .75rem;
  margin-bottom: 1rem; min-height: 48px;
}
.hp-app-bar h1 { flex: 1; margin: 0; font-size: 1.25rem; }
.hp-app-bar-mascot {
  width: 56px; height: 56px;
  border-radius: 50%; object-fit: cover;
  flex-shrink: 0;
}

.hp-veileder-toggle {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .85rem; font-weight: 650; color: var(--muted); cursor: pointer;
}
.hp-wizard-layout {
  display: grid; grid-template-columns: 240px 1fr; gap: 1rem;
}
@media (max-width: 800px) {
  .hp-wizard-layout { grid-template-columns: 1fr; }
}
.hp-wizard-rail { padding: 1rem; }
.hp-wizard-mascot {
  display: block; margin: 0 auto .75rem;
  width: 120px; height: 120px;
  object-fit: contain;
  border-radius: 50%;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg));
  padding: .25rem;
}
.hp-veileder-bubble {
  font-size: .9rem; line-height: 1.45;
  padding: .7rem .8rem; border-radius: 12px;
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--border));
  margin: 0 0 1rem;
}
.hp-wizard-rail.is-expert .hp-veileder-bubble,
.hp-wizard-rail.is-expert .hp-wizard-mascot { display: none; }
.hp-wizard-steps { list-style: none; padding: 0; margin: 0; }
.hp-wizard-steps li {
  display: flex; gap: .5rem; align-items: center;
  padding: .45rem .3rem; border-radius: 10px; font-size: .9rem; cursor: pointer;
}
.hp-wizard-steps li.is-current {
  background: color-mix(in srgb, var(--brand) 12%, transparent);
  font-weight: 700; color: var(--brand);
}
.hp-wizard-steps li.is-done { opacity: .65; }
.hp-wizard-main { padding: 1.25rem; min-height: 280px; }
.hp-wizard-nav { margin-top: 1.25rem; justify-content: flex-end; }
.hp-field-grid { display: grid; gap: .75rem; }
.hp-field-grid label { display: grid; gap: .3rem; font-weight: 650; font-size: .92rem; }
.hp-field-grid input, .hp-field-grid textarea, .hp-field-grid select {
  font: inherit; font-weight: 500; padding: .65rem .75rem; border-radius: 10px;
  border: 1px solid var(--border); background: var(--bg); color: var(--text);
}
.hp-tools-peek { padding: .85rem 1rem; }
.hp-tools-peek summary { cursor: pointer; font-weight: 700; color: var(--brand); }
.hp-tool-mini-grid {
  display: flex; flex-wrap: wrap; gap: .45rem .75rem; margin-top: .65rem;
}
.hp-tool-mini-grid a { font-size: .88rem; font-weight: 600; }

.hp-library { display: grid; gap: .65rem; margin-top: 1rem; }
.hp-lib-card {
  display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center;
  padding: 1rem 1.1rem; border-radius: 14px; border: 1px solid var(--border);
  background: var(--bg-elev); text-decoration: none; color: inherit;
}
.hp-lib-card:hover { border-color: var(--brand); }
.hp-lib-card strong { flex: 1; min-width: 140px; }
.hp-status {
  font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em;
  padding: .2rem .5rem; border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 15%, transparent); color: var(--brand);
}
.hp-status.done { background: color-mix(in srgb, var(--ok) 18%, transparent); color: var(--ok); }
.hp-status.doing { background: color-mix(in srgb, var(--accent) 20%, transparent); color: var(--accent); }

.hp-proc-list { list-style: none; padding: 0; margin: 1rem 0; }
.hp-proc-list li {
  display: flex; gap: .65rem; align-items: flex-start;
  padding: .75rem 0; border-bottom: 1px solid var(--border);
}
.hp-proc-list a { font-weight: 700; color: var(--brand); text-decoration: none; }
.hp-proc-list a:hover { text-decoration: underline; }

.hp-verktoy-bar { margin: 1rem 0 1.25rem; display: grid; gap: .75rem; }
.hp-verktoy-bar input[type="search"] {
  width: 100%; max-width: 420px; font: inherit; padding: .7rem .85rem;
  border-radius: 12px; border: 1px solid var(--border); background: var(--bg-elev); color: var(--text);
}
.hp-verktoy-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .75rem;
}
/* Author CSS display:flex beats UA [hidden]; force hide when filtered */
.hp-verktoy-grid .hp-final-tool[hidden],
.hp-final-tools .hp-final-tool[hidden] {
  display: none !important;
}
#vt-cats .chip {
  cursor: pointer;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  color: var(--text);
  font: inherit;
  font-weight: 650;
  font-size: .9rem;
}
#vt-cats .chip.active {
  border-color: var(--brand);
  color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg));
}
#vt-empty {
  grid-column: 1 / -1;
  padding: 1rem;
  color: var(--muted);
}
.hp-inline-mascot {
  float: right; width: 112px; height: 112px; object-fit: contain;
  margin: 0 0 .75rem 1rem; border-radius: 50%;
}

/* Profile nudge (board + wizard) */
.hp-profile-nudge {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .45rem;
  margin: 0 auto 1.15rem;
  max-width: 22rem;
  padding: .85rem 1rem;
  border-radius: 14px;
  border: 1px dashed color-mix(in srgb, var(--brand) 45%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
  text-align: center;
}
.hp-profile-nudge-text {
  margin: 0;
  font-weight: 700;
  font-size: .95rem;
  color: var(--text);
}
.hp-profile-nudge--inline {
  align-items: flex-start;
  text-align: left;
  max-width: none;
  margin: 0 0 1rem;
}
.hp-profile-nudge--inline .btn-row {
  width: 100%;
}
.hp-board-profile-panel {
  text-align: left;
  margin: 0 auto 1.25rem;
  max-width: 36rem;
  padding: 1.15rem 1.25rem;
}
.hp-board-profile-panel .hp-field-grid {
  margin-top: .75rem;
}

/* Hide lab clutter when on board-only - board is full focus */
body.hp-board-mode .main { max-width: 1100px; }

/* Tool engines */
.hp-engine { margin: 1rem 0 0; }
.hp-engine .grid-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem 1rem;
}
@media (max-width: 720px) {
  .hp-engine .grid-3 { grid-template-columns: 1fr; }
}

/* Hardt budsjettak (hard_budget) */
.hp-hb-hero {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .65rem .85rem;
  margin-bottom: .85rem;
  align-items: start;
}
.hp-hb-hero-copy { min-width: 0; grid-column: 1; }
.hp-hb-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
  border-radius: 12px;
  float: none;
}
.hp-hb-how { grid-column: 1 / -1; }
.hp-hb-lead { margin: 0; max-width: 42rem; }
.hp-hb-lead p { margin: 0 0 .35rem; }
.hp-hb-lead-bullets {
  margin: 0;
  padding-left: 1.1rem;
  display: grid;
  gap: .15rem;
}
.hp-hb-src {
  display: inline-block;
  font-size: .72rem;
  font-weight: 650;
  color: var(--brand);
  margin-top: .15rem;
}
.hp-hb-profile-note {
  margin: -.25rem 0 .75rem;
  padding: .4rem .6rem;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev));
}
.hp-hb-upsell {
  margin: .35rem 0 0;
  padding: .45rem .65rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev));
}
@media (max-width: 820px) {
  .hp-hb-hero {
    grid-template-columns: 1fr;
    gap: .4rem;
  }
  .hp-hb-hero-mascot {
    display: none; /* app bar already shows mascot — avoid double + squeeze */
  }
  .hp-hb-how { order: 3; }
  .hp-hb-hero-copy { order: 1; }
  .hp-hb-lead { font-size: .84rem; }
  .hp-hb-lead-bullets { font-size: .8rem; }
}
.hp-hb-how {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .7rem;
  background: var(--bg-elev);
  font-size: .88rem;
}
.hp-hb-how summary {
  cursor: pointer;
  font-weight: 650;
  color: var(--brand);
}
.hp-hb-how-list {
  margin: .45rem 0 0;
  padding-left: 1.15rem;
  color: var(--muted);
  display: grid;
  gap: .25rem;
}
.hp-hb-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 4px;
  background: color-mix(in srgb, var(--brand) 15%, var(--bg));
  color: var(--brand);
  vertical-align: middle;
}
.hp-hb-demo-note {
  margin: -.35rem 0 .85rem;
  padding: .45rem .65rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev));
}
.hp-hb-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .45rem 0 0.85rem;
}
.hp-hb-quick .chip-sm,
.chip.chip-sm {
  min-height: 44px;
  min-width: 44px;
  padding: .45rem .75rem;
  font-size: .8rem;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  border-radius: 999px;
  cursor: pointer;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.hp-hb-quick .chip-sm[aria-pressed="true"],
.hp-hb-quick .chip-sm.active {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  color: var(--brand);
}
.hp-hb-quick .chip-sm:hover,
.hp-hb-quick .chip-sm.active,
.hp-hb-quick .chip-sm[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-hb-quick .chip-sm:focus-visible,
.hp-hb-demos .chip:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 35%, transparent);
}
.hp-hb-quick-sep { opacity: .5; margin: 0 .15rem; }
.hp-hb-demos {
  display: flex; flex-wrap: wrap; gap: .5rem; align-items: center;
  margin: 0 0 1.1rem;
}
.hp-hb-demos .chip {
  border: 1px solid var(--border);
  background: var(--bg-elev);
  border-radius: 999px;
  padding: .55rem .95rem;
  min-height: 44px;
  font-size: .84rem;
  font-weight: 650;
  cursor: pointer;
  color: inherit;
  line-height: 1.25;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  max-width: 100%;
}
.hp-hb-demos .chip:hover,
.hp-hb-demos .chip.active,
.hp-hb-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-hb-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-hb-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.95fr);
  gap: 1.15rem;
  align-items: start;
}
.hp-hb-inputs { order: 1; }
.hp-hb-panel { order: 2; }
@media (max-width: 820px) {
  .hp-hb-layout {
    grid-template-columns: 1fr;
    display: flex;
    flex-direction: column;
  }
  /* Result first on mobile; not sticky — fixed bottom bar holds maks kjøpesum */
  .hp-hb-panel { order: -1; }
}
.hp-hb-section {
  margin: 1rem 0 .45rem;
  font-size: .95rem;
  letter-spacing: -0.01em;
}
.hp-hb-section:first-child { margin-top: 0; }
.hp-hb-panel {
  position: sticky;
  top: 4.5rem;
  padding: 1rem 1.05rem 1.1rem;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
  box-shadow: var(--shadow);
  scroll-margin-top: 4.5rem;
}
@media (max-width: 820px) {
  /* No sticky panel on narrow: full result scrolls with page; bottom bar is the persistent max */
  .hp-hb-panel {
    position: relative;
    top: auto;
    z-index: auto;
    max-height: none;
  }
  /* Room for fixed bottom bar only — avoid double chrome covering inputs */
  .hp-hb { padding-bottom: 4.5rem; }
}
.hp-hb-panel .hp-bid-num {
  font-size: clamp(1.6rem, 4vw, 2.15rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--brand);
  line-height: 1.15;
  margin: .15rem 0 .35rem;
  font-variant-numeric: tabular-nums;
}
.hp-hb-field-err {
  margin: .25rem 0 0;
  color: #b91c1c;
}
.hp-hb-stack { margin: .9rem 0 .65rem; }
.hp-hb-stack-summary { margin: .4rem 0 0; }
.hp-hb-stack-bar {
  display: flex;
  height: 14px;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  border: 1px solid var(--border);
}
.hp-hb-seg { display: block; min-width: 0; height: 100%; transition: width .2s ease; }
@media (prefers-reduced-motion: reduce) {
  .hp-hb-seg,
  .hp-hb-headroom-fill {
    transition: none !important;
  }
}
.hp-hb-seg-price { background: var(--brand); }
.hp-hb-seg-cost { background: color-mix(in srgb, var(--brand) 55%, var(--brand-2, #3aa6a0)); }
.hp-hb-seg-reno { background: #2a8f8a; }
.hp-hb-seg-buf { background: #7fd4ce; }
.hp-hb-seg-emo { background: color-mix(in srgb, var(--brand) 40%, #0f6b6b); }
.hp-hb-seg-slack {
  background: repeating-linear-gradient(
    -45deg,
    color-mix(in srgb, var(--border) 85%, transparent),
    color-mix(in srgb, var(--border) 85%, transparent) 3px,
    transparent 3px,
    transparent 6px
  );
}
.hp-hb-legend {
  list-style: none; padding: 0; margin: .55rem 0 0;
  display: grid; gap: .25rem;
  font-size: .8rem; color: var(--muted);
}
.hp-hb-legend li {
  display: flex; align-items: center; gap: .4rem; flex-wrap: wrap;
}
.hp-hb-legend span {
  margin-left: auto;
  font-variant-numeric: tabular-nums;
  color: var(--text);
  font-weight: 600;
}
.hp-hb-dot {
  width: .65rem; height: .65rem; border-radius: 50%;
  display: inline-block; flex-shrink: 0;
}
.hp-hb-seg-slack-dot {
  background: color-mix(in srgb, var(--border) 90%, var(--bg));
  border: 1px dashed var(--muted);
  box-sizing: border-box;
}
.hp-hb-gauges { margin-top: .85rem; }
.hp-hb-headroom {
  margin: .75rem 0 .5rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-hb-headroom-row {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  align-items: baseline;
  margin-bottom: .4rem;
}
.hp-hb-headroom-bar {
  position: relative;
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  overflow: visible; /* mark must not clip */
  border: 1px solid var(--border);
  margin: 4px 0;
}
.hp-hb-headroom-fill {
  display: block;
  height: 100%;
  background: color-mix(in srgb, var(--brand) 70%, #22c55e);
  transition: width .2s ease;
}
.hp-hb .hp-field {
  display: grid;
  gap: .35rem;
  margin-bottom: .15rem;
}
.hp-hb input[aria-invalid="true"] {
  border-color: #b91c1c;
  box-shadow: 0 0 0 1px color-mix(in srgb, #b91c1c 40%, transparent);
}
.hp-hb-headroom-fill--over {
  background: color-mix(in srgb, #ef4444 75%, var(--brand));
}
.hp-hb-headroom-fill--tight {
  background: color-mix(in srgb, #f59e0b 70%, var(--brand));
}
.hp-hb-headroom.is-ok {
  border-color: color-mix(in srgb, #22c55e 40%, var(--border));
  background: color-mix(in srgb, #22c55e 8%, var(--bg-elev));
}
.hp-hb-headroom.is-tight {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-hb-headroom.is-over {
  border-color: color-mix(in srgb, #ef4444 45%, var(--border));
  background: color-mix(in srgb, #ef4444 10%, var(--bg-elev));
}
.hp-hb-headroom-mark {
  position: absolute;
  top: -2px;
  bottom: -2px;
  width: 2px;
  background: var(--text);
  transform: translateX(-1px);
  box-shadow: 0 0 0 1px var(--bg-elev);
}
.hp-hb-headroom-status {
  margin: .4rem 0 0;
  font-size: .8rem;
  color: var(--muted);
  line-height: 1.35;
}
.hp-hb-headroom.is-over .hp-hb-headroom-status { color: #b91c1c; font-weight: 600; }
.hp-hb-headroom.is-tight .hp-hb-headroom-status { color: #b45309; }
.hp-hb-table {
  width: 100%;
  margin: .75rem 0 .35rem;
  border-collapse: collapse;
  font-size: .84rem;
}
.hp-hb-table th,
.hp-hb-table td {
  padding: .4rem 0;
  border-bottom: 1px solid var(--border);
  text-align: left;
}
.hp-hb-table th {
  font-weight: 550;
  color: var(--muted);
  padding-right: .75rem;
}
.hp-hb-table td {
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-weight: 650;
}
.hp-hb-table-mnd th,
.hp-hb-table-mnd td {
  color: var(--brand);
}
.hp-hb-whatif { margin-top: .75rem; }
.hp-hb-whatif-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .4rem;
}
@media (max-width: 640px) {
  .hp-hb-whatif-grid { grid-template-columns: 1fr; }
}
.hp-hb-whatif-card {
  padding: .45rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  display: grid;
  gap: .15rem;
  font-size: .78rem;
}
.hp-hb-whatif-card strong {
  font-size: .9rem;
  font-variant-numeric: tabular-nums;
}
.hp-hb-whatif-card.is-over {
  border-color: color-mix(in srgb, #ef4444 45%, var(--border));
  background: color-mix(in srgb, #ef4444 8%, var(--bg-elev));
}
.hp-hb-commit-actions { margin-top: .15rem; flex-wrap: wrap; }
.hp-hb-alerts { margin-top: .75rem; display: grid; gap: .4rem; }
.hp-hb-alert {
  margin: 0;
  padding: .55rem .7rem;
  border-radius: 10px;
  font-size: .84rem;
  line-height: 1.35;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-hb-alert--warn {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 12%, var(--bg-elev));
}
.hp-hb-alert--info {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
}
.hp-hb-commit {
  margin-top: 1rem;
  padding-top: .85rem;
  border-top: 1px solid var(--border);
  display: grid;
  gap: .55rem;
}
.hp-hb-commit-label {
  display: flex; gap: .5rem; align-items: flex-start;
  font-size: .88rem; font-weight: 550; cursor: pointer;
}
.hp-hb-commit-label input { margin-top: .2rem; flex-shrink: 0; }
.hp-hb-commit-text {
  width: 100%;
  font-size: .8rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  line-height: 1.4;
  resize: vertical;
  min-height: 5.5rem;
  background: var(--bg-elev);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .55rem .7rem;
}
.hp-hb-empty {
  padding: .75rem;
  border-radius: 10px;
  border: 1px dashed var(--border);
  margin-bottom: .65rem;
}
.hp-hb-actions .hp-hb-recalc { opacity: .85; }
.hp-hb-mobile-bar {
  display: none;
}
@media (max-width: 820px) {
  .hp-hb-mobile-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    padding: .65rem 0.85rem calc(.65rem + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
    background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
    box-shadow: 0 -6px 20px color-mix(in srgb, #000 12%, transparent);
  }
  .hp-hb-mobile-bar[hidden] {
    display: none !important;
  }
  /* Soft keyboard open: free money inputs */
  .hp-hb-mobile-bar.hp-hb-mobile-bar--kb {
    display: none !important;
  }
  .hp-hb-mobile-bar-inner {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    min-width: 0;
  }
  .hp-hb-mobile-bar-num {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--brand);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
  }
  .hp-hb-mobile-disc {
    font-size: .72rem;
    line-height: 1.2;
  }
  /* ≥44×44 Detaljer — override .btn-sm min-height:0 */
  .hp-hb-mobile-bar .hp-hb-mobile-jump,
  .hp-hb-mobile-bar [data-hb-mobile-jump] {
    min-height: 44px;
    min-width: 44px;
    padding: .55rem .9rem;
    font-size: .88rem;
    flex-shrink: 0;
  }
  /* Sticky actions: keep Lagre budtak near pledge/result on narrow */
  .hp-hb-actions {
    position: sticky;
    bottom: 4.75rem;
    z-index: 30;
    padding: .55rem 0;
    background: linear-gradient(to top, var(--bg-elev) 70%, transparent);
    flex-wrap: wrap;
  }
}
.hp-hb-fold {
  margin: .65rem 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .35rem .65rem .55rem;
  background: var(--bg-elev);
}
.hp-hb-fold-sum {
  cursor: pointer;
  list-style: none;
  margin: 0;
}
.hp-hb-fold-sum::-webkit-details-marker { display: none; }
.hp-hb-cash {
  margin: .55rem 0 .35rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  font-size: .84rem;
}
.hp-hb-privacy {
  margin-top: .85rem;
  font-size: .88rem;
}
.hp-hb-nonadvice-fixed {
  margin: .2rem 0 0;
  font-size: .75rem;
}
/* Binding panel: totalramme-sti vs bank+EK */
.hp-hb-bind {
  margin: .55rem 0 .4rem;
  padding: .55rem .7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-hb-bind-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
}
@media (max-width: 560px) {
  .hp-hb-bind-grid { grid-template-columns: 1fr; }
}
.hp-hb-bind-card {
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  display: grid;
  gap: .15rem;
}
.hp-hb-bind-card strong {
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
  color: var(--brand);
}
.hp-hb-bind.is-bank [data-hb-bind-bank],
.hp-hb-bind.is-budget [data-hb-bind-budget],
.hp-hb-bind.is-both .hp-hb-bind-card {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, transparent);
}
/* Rentesjokk + omvendt probe */
.hp-hb-rate-stress {
  margin: .55rem 0 .35rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #f59e0b 35%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev));
  font-size: .84rem;
}
.hp-hb-reverse {
  margin: .75rem 0 .5rem;
  padding: .55rem .7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-hb-reverse-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: flex-end;
  padding-top: 1.4rem;
}
.hp-hb-reverse-out {
  line-height: 1.4;
  color: var(--text);
}
.hp-hb-faq {
  margin-top: 1.25rem;
  max-width: 42rem;
}
.hp-hb-faq-item {
  margin: .35rem 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: .35rem .65rem;
}
.hp-hb-faq-item summary {
  cursor: pointer;
  font-weight: 650;
}
.hp-hb-save-reason { margin: .25rem 0 0; }

/* Live formula */
.hp-hb-formula {
  margin: .45rem 0 .4rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev));
  font-size: .82rem;
}
.hp-hb-formula-line {
  margin: 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  word-break: break-word;
  font-variant-numeric: tabular-nums;
}

/* Max quick actions */
.hp-hb-max-actions {
  margin: .4rem 0 0;
  gap: .35rem;
  flex-wrap: wrap;
}
.hp-hb-max-actions .btn {
  min-height: 44px;
}

/* Scenario compare */
.hp-hb-scenarios {
  margin: .55rem 0 .4rem;
  padding: .55rem .7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-hb-scenario-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .4rem;
}
@media (max-width: 560px) {
  .hp-hb-scenario-grid { grid-template-columns: 1fr; }
}
.hp-hb-scenario-card {
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  display: grid;
  gap: .1rem;
  font-size: .78rem;
}
.hp-hb-scenario-card strong {
  font-size: 1rem;
  font-variant-numeric: tabular-nums;
  color: var(--brand);
}

/* Objekt-sjekk scorecard */
.hp-hb-objekt {
  margin: .55rem 0 .4rem;
  padding: .55rem .7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-hb-objekt.is-ok {
  border-color: color-mix(in srgb, #22c55e 45%, var(--border));
  background: color-mix(in srgb, #22c55e 8%, var(--bg-elev));
}
.hp-hb-objekt.is-tight {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-hb-objekt.is-over {
  border-color: color-mix(in srgb, #ef4444 45%, var(--border));
  background: color-mix(in srgb, #ef4444 10%, var(--bg-elev));
}
.hp-hb-objekt-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .35rem;
}
.hp-hb-objekt-item {
  display: flex;
  gap: .45rem;
  align-items: flex-start;
  font-size: .84rem;
  line-height: 1.35;
}
.hp-hb-objekt-mark {
  flex-shrink: 0;
  font-size: .68rem;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .12rem .35rem;
  border-radius: 4px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  color: var(--muted);
  margin-top: .1rem;
}
.hp-hb-objekt-item.is-ok .hp-hb-objekt-mark {
  background: color-mix(in srgb, #22c55e 22%, transparent);
  color: #15803d;
}
.hp-hb-objekt-item.is-warn .hp-hb-objekt-mark {
  background: color-mix(in srgb, #f59e0b 25%, transparent);
  color: #b45309;
}
.hp-hb-objekt-item.is-bad .hp-hb-objekt-mark {
  background: color-mix(in srgb, #ef4444 22%, transparent);
  color: #b91c1c;
}
.hp-hb-objekt-verdict {
  margin: .45rem 0 0;
  line-height: 1.4;
}

/* LTV gauge */
.hp-hb-ltv-gauge {
  margin: .55rem 0 .4rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-hb-ltv-row {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  align-items: baseline;
  margin-bottom: .35rem;
}
.hp-hb-ltv-bar {
  position: relative;
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  border: 1px solid var(--border);
  overflow: visible;
}
.hp-hb-ltv-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 70%, #22c55e);
  transition: width .2s ease;
}
.hp-hb-ltv-gauge.is-ok .hp-hb-ltv-fill {
  background: color-mix(in srgb, var(--brand) 55%, #22c55e);
}
.hp-hb-ltv-gauge.is-warn .hp-hb-ltv-fill {
  background: color-mix(in srgb, #f59e0b 75%, var(--brand));
}
.hp-hb-ltv-gauge.is-high .hp-hb-ltv-fill {
  background: color-mix(in srgb, #ef4444 75%, var(--brand));
}
.hp-hb-ltv-mark {
  position: absolute;
  top: -3px;
  bottom: -3px;
  width: 1px;
  background: var(--muted);
  opacity: .7;
}
.hp-hb-ltv-mark--85 { background: #b91c1c; opacity: .85; }
@media (prefers-reduced-motion: reduce) {
  .hp-hb-ltv-fill { transition: none !important; }
}

/* Guided empty CTA */
.hp-hb-guided {
  margin-top: .5rem;
  display: grid;
  gap: .4rem;
}
.hp-hb-guided .btn { justify-self: start; min-height: 44px; }

.btn-sm { padding: .35rem .7rem; font-size: .85rem; min-height: 0; }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}


.hp-hb-pledge-needed .hp-hb-commit-label {
  outline: 2px solid color-mix(in srgb, #f59e0b 70%, var(--border));
  outline-offset: 3px;
  border-radius: 8px;
}
.hp-hb-pledged .hp-hb-commit {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
}
.hp-hb-actions .btn,
.hp-hb-commit-actions .btn {
  min-height: 44px;
}
.hp-hb-mobile-bar-inner {
  display: flex;
  flex-direction: column;
  gap: .1rem;
  min-width: 0;
}
.hp-hb-mobile-disc { font-size: .68rem !important; }

/* Shared gauges / bid result (tools page) */
.hp-gauges {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: .55rem;
}
.hp-gauge {
  padding: .7rem .75rem;
  border-radius: 12px;
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
  border: 1px solid var(--border);
}
.hp-gauge strong {
  display: block;
  font-size: 1.05rem;
  margin-top: .2rem;
  font-variant-numeric: tabular-nums;
}
.hp-bid-result { margin-top: 1.1rem; text-align: center; }
.hp-bid-num {
  font-size: 2rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--brand);
  font-variant-numeric: tabular-nums;
}
.hp-timeline {
  list-style: none;
  padding: 0;
  margin: .75rem 0;
  border-left: 3px solid color-mix(in srgb, var(--brand) 45%, var(--border));
}
.hp-timeline li {
  padding: .55rem 0 .55rem 1rem;
  border-bottom: 1px solid var(--border);
  display: grid;
  gap: .35rem;
}
.hp-tl-label { display: flex; gap: .5rem; align-items: center; font-weight: 600; }
.hp-tl-note { width: 100%; }
.hp-journal { list-style: none; padding: 0; margin: .75rem 0 0; }
.hp-journal li {
  padding: .5rem .75rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  margin-bottom: .4rem;
  background: var(--bg-elev);
  font-size: .92rem;
}
.hp-links { padding-left: 1.1rem; margin: .5rem 0 1rem; }
.hp-links a { font-weight: 600; }
.hp-pack-out {
  white-space: pre-wrap;
  background: var(--bg-elev);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .85rem 1rem;
  font-size: .88rem;
  margin-top: .75rem;
  max-height: 280px;
  overflow: auto;
}
.badge.muted { opacity: .75; font-weight: 500; }

/* Library cards with delete */
.hp-library {
  display: grid;
  gap: .75rem;
}
.hp-lib-card-wrap {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .5rem;
  align-items: stretch;
}
.hp-lib-card-wrap .hp-lib-card {
  margin: 0;
}
.hp-lib-del {
  align-self: center;
  color: var(--danger, #b42318) !important;
  white-space: nowrap;
}
.hp-field-grid .hint {
  display: block;
  font-weight: 400;
  font-size: .82rem;
  color: var(--muted);
  margin: .15rem 0 .25rem;
}

/* Profile categories */
.hp-profile-section { margin: 1rem 0 1.25rem; }
.hp-profile-section-title {
  margin: 0 0 .65rem;
  font-size: 1rem;
  font-weight: 750;
}
.hp-profile-cat {
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-elev);
  margin: .65rem 0;
  padding: .55rem .85rem .75rem;
}
.hp-profile-cat > summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  font-weight: 650;
  padding: .35rem 0;
}
.hp-profile-cat > summary::-webkit-details-marker { display: none; }
.hp-profile-cat > summary::before {
  content: '▸';
  color: var(--brand);
  font-weight: 800;
  margin-right: .35rem;
}
.hp-profile-cat[open] > summary::before { content: '▾'; }
.hp-profile-cat-title { color: var(--brand); font-weight: 750; }

/* Field labels + tip button */
.field-label-row {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  flex-wrap: wrap;
  margin-bottom: .15rem;
}
.field-label-text { font-weight: 650; }
.hp-field { display: grid; gap: .35rem; }
.field-tip {
  /* Visual chip stays compact; hit area ≥44×44 via padding box */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: content-box;
  width: 1.25rem;
  height: 1.25rem;
  min-width: 1.25rem;
  min-height: 1.25rem;
  padding: 0.7rem; /* ~1.25 + 1.4 ≈ 44px total */
  margin: -0.55rem -0.4rem;
  border-radius: 999px;
  border: 1.5px solid color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 10%, var(--bg));
  background-clip: content-box;
  color: var(--brand);
  font-size: .72rem;
  font-weight: 800;
  line-height: 1;
  cursor: help;
  flex-shrink: 0;
  position: relative;
}
.field-tip:hover {
  background: color-mix(in srgb, var(--brand) 22%, var(--bg));
  background-clip: content-box;
}
.field-tip:focus-visible {
  background: color-mix(in srgb, var(--brand) 22%, var(--bg));
  background-clip: content-box;
  outline: 2px solid var(--brand);
  outline-offset: 2px;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 35%, transparent);
}
.field-tip-pop {
  position: fixed;
  z-index: 2000;
  padding: .65rem .8rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  color: var(--text);
  box-shadow: 0 8px 28px color-mix(in srgb, #000 18%, transparent);
  font-size: .88rem;
  line-height: 1.4;
  font-weight: 500;
  pointer-events: none;
}

/* —— Betalingsevne-cockpit (afford) —— */
.hp-aff-hero {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .65rem .85rem;
  margin-bottom: .85rem;
  align-items: start;
}
.hp-aff-hero-copy { min-width: 0; grid-column: 1; }
.hp-aff-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  width: 72px;
  height: 72px;
  object-fit: contain;
  border-radius: 14px;
  margin: 0;
}
.hp-aff-how { grid-column: 1 / -1; }
.hp-aff-lead { margin: 0; max-width: 42rem; }
.hp-aff-lead p { margin: 0 0 .35rem; }
.hp-aff-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
  display: grid;
  gap: .2rem;
}
.hp-aff-how {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .7rem;
  background: var(--bg-elev);
  font-size: .88rem;
}
.hp-aff-how summary {
  cursor: pointer;
  font-weight: 650;
  color: var(--brand);
}
.hp-aff-how-list {
  margin: .45rem 0 0;
  padding-left: 1.15rem;
  color: var(--muted);
  display: grid;
  gap: .25rem;
}
@media (max-width: 820px) {
  .hp-aff-hero {
    grid-template-columns: 1fr;
    gap: .4rem;
  }
  .hp-aff-hero-mascot {
    display: none; /* app bar already shows mascot */
  }
  .hp-aff-how { order: 3; }
  .hp-aff-hero-copy { order: 1; }
  .hp-aff-lead { font-size: .84rem; }
  .hp-aff-lead-bullets { font-size: .8rem; }
  .hp-aff-how:not([open]) { margin-bottom: .25rem; }
}
.hp-aff-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 4px;
  background: color-mix(in srgb, var(--brand) 15%, var(--bg));
  color: var(--brand);
  vertical-align: middle;
}
.hp-aff-demo-note,
.hp-aff-profile-note {
  margin: -.35rem 0 .85rem;
  padding: .45rem .65rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev));
}
.hp-aff-src {
  display: inline-block;
  margin-top: .15rem;
  font-size: .72rem;
  color: var(--brand);
  font-weight: 600;
}
.hp-aff-rate-row {
  display: grid;
  grid-template-columns: 1fr minmax(4.5rem, 5.5rem);
  gap: .5rem;
  align-items: center;
}
.hp-aff-rate-slider {
  width: 100%;
  accent-color: var(--brand);
  min-height: 44px;
  cursor: pointer;
}
.hp-aff-reverse-out {
  margin: 0;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
  font-size: .84rem;
  line-height: 1.4;
  min-height: 2.8rem;
}
.hp-aff-rev-ok { color: #15803d; font-weight: 650; }
.hp-aff-rev-bad { color: #b45309; font-weight: 650; }
.hp-aff-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  align-items: center;
  margin: 0 0 1.1rem;
}
.hp-aff-demos .chip {
  border: 1px solid var(--border);
  background: var(--bg-elev);
  border-radius: 999px;
  padding: .55rem .95rem;
  min-height: 44px;
  font-size: .84rem;
  font-weight: 650;
  cursor: pointer;
  color: inherit;
  line-height: 1.25;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  max-width: 100%;
}
.hp-aff-demos .chip:hover,
.hp-aff-demos .chip.active,
.hp-aff-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-aff-demos .chip:focus-visible,
.hp-aff-quick .chip-sm:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
}
.hp-aff-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-aff-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .45rem 0 0.85rem;
}
.hp-aff-quick .chip-sm {
  min-height: 44px;
  min-width: 44px;
  padding: .45rem .75rem;
  font-size: .8rem;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  border-radius: 999px;
  cursor: pointer;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.hp-aff-quick .chip-sm[aria-pressed="true"],
.hp-aff-quick .chip-sm.active {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  color: var(--brand);
}
.hp-aff-quick-sep { opacity: .5; margin: 0 .15rem; }
.hp-aff-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.95fr);
  gap: 1.15rem;
  align-items: start;
}
.hp-aff-inputs { order: 1; }
.hp-aff-panel { order: 2; }
@media (max-width: 820px) {
  .hp-aff-layout {
    grid-template-columns: 1fr;
    display: flex;
    flex-direction: column;
  }
  /* Inputs first on narrow so demos+fields stay above dense results wall */
  .hp-aff-inputs { order: 1; }
  .hp-aff-panel { order: 2; }
}
.hp-aff-section {
  margin: 1rem 0 .45rem;
  font-size: .95rem;
  letter-spacing: -0.01em;
}
.hp-aff-section:first-child { margin-top: 0; }
.hp-aff-fold {
  margin: .75rem 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .35rem .65rem .55rem;
  background: var(--bg-elev);
}
.hp-aff-fold-sum {
  cursor: pointer;
  list-style: none;
  margin: 0;
  display: flex;
  align-items: center;
  gap: .35rem;
}
.hp-aff-fold-sum::-webkit-details-marker { display: none; }
/* Open/closed cue after removing default markers */
.hp-aff-disc-cue::before {
  content: '▸';
  display: inline-block;
  width: 1em;
  font-weight: 700;
  color: var(--brand);
  transition: transform .15s ease;
}
details[open] > summary .hp-aff-disc-cue::before,
details[open].hp-aff-fold > .hp-aff-fold-sum .hp-aff-disc-cue::before,
details[open].hp-aff-details-sec > summary .hp-aff-disc-cue::before,
details[open].hp-aff-how > summary .hp-aff-disc-cue::before,
details[open].hp-aff-privacy > summary .hp-aff-disc-cue::before,
details[open].hp-aff-faq-item > summary .hp-aff-disc-cue::before {
  content: '▾';
}
@media (prefers-reduced-motion: reduce) {
  .hp-aff-disc-cue::before { transition: none; }
}
.hp-aff-subsection {
  margin: .85rem 0 .35rem;
  font-size: .9rem;
  font-weight: 650;
  color: var(--text);
}
.hp-aff-opex-strip {
  margin: .75rem 0 1rem;
  padding: .65rem .75rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev));
}
.hp-aff-opex-hint {
  margin: .4rem 0 0;
  padding: .35rem .5rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg));
}
.hp-aff-dual-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin: 0 0 .5rem;
}
@media (max-width: 420px) {
  .hp-aff-dual-hero { grid-template-columns: 1fr; }
}
.hp-aff-hero-card {
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  min-width: 0;
}
.hp-aff-hero-pay {
  border-color: color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev));
}
.hp-aff-hero-stress {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-aff-stress-num {
  color: #b45309 !important;
}
.hp-aff-ladder-primary {
  margin: .75rem 0;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, #f59e0b 35%, var(--border));
  background: color-mix(in srgb, #f59e0b 6%, var(--bg-elev));
}
.hp-aff-bridge-actions {
  flex-wrap: wrap;
  gap: .45rem;
}
.hp-aff-bridge-btn {
  min-height: 44px;
  min-width: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .55rem .85rem;
  box-sizing: border-box;
  text-align: center;
  line-height: 1.25;
}
.hp-aff-bridge-short { display: none; }
@media (max-width: 360px) {
  .hp-aff-bridge-full { display: none; }
  .hp-aff-bridge-short { display: inline; }
}
.hp-aff-zero-ack {
  display: flex;
  gap: .55rem;
  align-items: flex-start;
  margin: .65rem 0 0;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #ef4444 40%, var(--border));
  background: color-mix(in srgb, #ef4444 8%, var(--bg-elev));
  font-size: .84rem;
  line-height: 1.35;
  cursor: pointer;
}
.hp-aff-zero-ack input {
  margin-top: .2rem;
  min-width: 1.1rem;
  min-height: 1.1rem;
}
.hp-aff-faq {
  margin: 1.5rem 0 0;
  padding-top: 1rem;
  border-top: 1px solid var(--border);
}
.hp-aff-faq-item {
  margin: .45rem 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .65rem;
  background: var(--bg-elev);
}
.hp-aff-faq-item summary {
  cursor: pointer;
  font-weight: 650;
  list-style: none;
  display: flex;
  align-items: center;
  gap: .35rem;
  color: var(--brand);
}
.hp-aff-faq-item summary::-webkit-details-marker { display: none; }
.hp-aff-faq-item p { margin: .4rem 0 .15rem; }
.hp-aff-panel {
  position: sticky;
  top: 4.5rem;
  padding: 1rem 1.05rem 1.1rem;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
  box-shadow: var(--shadow);
  scroll-margin-top: 4.5rem;
}
@media (max-width: 820px) {
  .hp-aff-panel {
    position: relative;
    top: auto;
    z-index: auto;
    max-height: none;
  }
  .hp-aff { padding-bottom: 5rem; }
}
.hp-aff-panel .hp-bid-num {
  font-size: clamp(1.5rem, 4vw, 2.05rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--brand);
  line-height: 1.15;
  margin: .15rem 0 .35rem;
  font-variant-numeric: tabular-nums;
}
.hp-aff-field-err {
  margin: .25rem 0 0;
  color: #b91c1c;
}
.hp-aff input[aria-invalid="true"] {
  border-color: #b91c1c;
  box-shadow: 0 0 0 1px color-mix(in srgb, #b91c1c 40%, transparent);
}
.hp-aff .hp-field {
  display: grid;
  gap: .35rem;
  margin-bottom: .15rem;
}
.hp-aff-band {
  margin: 0 0 .75rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-aff-band-row {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  align-items: baseline;
  margin-top: .2rem;
}
.hp-aff-score {
  font-size: 1.45rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--brand);
}
.hp-aff-band-label {
  font-size: .88rem;
  font-weight: 600;
  color: var(--text);
}
.hp-aff-band.is-ok {
  border-color: color-mix(in srgb, #22c55e 40%, var(--border));
  background: color-mix(in srgb, #22c55e 8%, var(--bg-elev));
}
.hp-aff-band.is-mid {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
}
.hp-aff-band.is-tight {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-aff-band.is-over {
  border-color: color-mix(in srgb, #ef4444 45%, var(--border));
  background: color-mix(in srgb, #ef4444 10%, var(--bg-elev));
}
.hp-aff-nonadvice-fixed {
  margin: .15rem 0 0;
  font-size: .75rem;
}
.hp-aff-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin: .75rem 0;
}
@media (max-width: 420px) {
  .hp-aff-gauges { grid-template-columns: 1fr; }
}
.hp-aff-gauge {
  padding: .55rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  display: grid;
  gap: .2rem;
}
.hp-aff-gauge strong {
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
  color: var(--brand);
}
.hp-aff-gauge-stress {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev));
}
.hp-aff-gauge-stress strong { color: #b45309; }
.hp-aff-ratio {
  margin: .65rem 0;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-aff-ratio-row {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  align-items: baseline;
  margin-bottom: .4rem;
}
.hp-aff-ratio-bar {
  position: relative;
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  border: 1px solid var(--border);
  overflow: visible;
  margin: 4px 0;
}
.hp-aff-ratio-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 70%, #22c55e);
  transition: width .2s ease;
}
.hp-aff-ratio-fill.is-mid {
  background: color-mix(in srgb, #f59e0b 70%, var(--brand));
}
.hp-aff-ratio-fill.is-over {
  background: color-mix(in srgb, #ef4444 75%, var(--brand));
}
.hp-aff-ratio-mark {
  position: absolute;
  top: -2px;
  bottom: -2px;
  width: 2px;
  background: color-mix(in srgb, var(--text) 55%, transparent);
  transform: translateX(-1px);
}
.hp-aff-ratio-mark-warn {
  background: color-mix(in srgb, #f59e0b 80%, transparent);
}
.hp-aff-ltv {
  margin: .65rem 0;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-aff-ltv-row {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  align-items: baseline;
  margin-bottom: .4rem;
}
.hp-aff-ltv-bar {
  position: relative;
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  border: 1px solid var(--border);
  overflow: visible;
  margin: 4px 0;
}
.hp-aff-ltv-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 70%, #22c55e);
  transition: width .2s ease;
}
.hp-aff-ltv-fill.is-mid {
  background: color-mix(in srgb, #f59e0b 70%, var(--brand));
}
.hp-aff-ltv-fill.is-over {
  background: color-mix(in srgb, #ef4444 75%, var(--brand));
}
.hp-aff-ltv-mark {
  position: absolute;
  top: -2px;
  bottom: -2px;
  width: 2px;
  background: color-mix(in srgb, #b45309 80%, transparent);
  transform: translateX(-1px);
}
.hp-aff-split {
  margin: .65rem 0;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-aff-split-track {
  display: flex;
  height: 12px;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid var(--border);
}
.hp-aff-split-int {
  display: block;
  height: 100%;
  background: color-mix(in srgb, #f59e0b 65%, var(--brand));
  transition: width .2s ease;
}
.hp-aff-split-prin {
  display: block;
  height: 100%;
  background: color-mix(in srgb, var(--brand) 75%, #22c55e);
  transition: width .2s ease;
}
.hp-aff-cashflow {
  margin: .75rem 0;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-aff-cf-visual { margin: 0 0 .5rem; }
.hp-aff-cf-bar {
  display: flex;
  height: 14px;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-aff-cf-seg { display: block; height: 100%; min-width: 2px; }
.hp-aff-cf-seg.is-exp { background: #94a3b8; }
.hp-aff-cf-seg.is-debt { background: #f59e0b; }
.hp-aff-cf-seg.is-pay { background: var(--brand); }
.hp-aff-cf-seg.is-buf { background: #22c55e; }
.hp-aff-cf-seg.is-rest { background: color-mix(in srgb, var(--border) 70%, transparent); }
.hp-aff-cf-legend {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .65rem;
  margin-top: .35rem;
  font-size: .72rem;
  color: var(--muted);
}
.hp-aff-cf-leg::before {
  content: '';
  display: inline-block;
  width: .55rem;
  height: .55rem;
  border-radius: 2px;
  margin-right: .25rem;
  vertical-align: middle;
}
.hp-aff-cf-leg.is-exp::before { background: #94a3b8; }
.hp-aff-cf-leg.is-debt::before { background: #f59e0b; }
.hp-aff-cf-leg.is-pay::before { background: var(--brand); }
.hp-aff-cf-leg.is-buf::before { background: #22c55e; }
.hp-aff-cf-leg.is-rest::before { background: #cbd5e1; }
.hp-aff-cash-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .3rem;
  font-size: .84rem;
}
.hp-aff-cash-list li {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  font-variant-numeric: tabular-nums;
}
.hp-aff-cash-sum {
  padding-top: .35rem;
  margin-top: .15rem;
  border-top: 1px solid var(--border);
  font-weight: 650;
}
/* Hva hvis — livshendelser / inntektssjokk */
.hp-aff-whatif {
  margin: .75rem 0 .55rem;
  padding: .55rem .7rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev));
}
.hp-aff-whatif-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
}
.hp-aff-whatif-chips .chip-sm {
  min-height: 40px;
  padding: .4rem .7rem;
  font-size: .78rem;
  font-weight: 650;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  border-radius: 999px;
  cursor: pointer;
  color: inherit;
}
.hp-aff-whatif-chips .chip-sm:hover,
.hp-aff-whatif-chips .chip-sm.active,
.hp-aff-whatif-chips .chip-sm[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  color: var(--brand);
}
.hp-aff-whatif-chips .chip-sm:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
}
.hp-aff-whatif-panel {
  margin-top: .55rem;
  padding-top: .45rem;
  border-top: 1px dashed color-mix(in srgb, var(--brand) 25%, var(--border));
}
.hp-aff-whatif-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .4rem;
}
@media (max-width: 560px) {
  .hp-aff-whatif-grid { grid-template-columns: 1fr; }
}
.hp-aff-whatif-card {
  padding: .45rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  display: grid;
  gap: .12rem;
}
.hp-aff-whatif-card strong {
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
  color: var(--brand);
  letter-spacing: -0.02em;
}
.hp-aff-whatif-card.is-stress strong { color: #b45309; }
.hp-aff-whatif-summary { line-height: 1.4; color: var(--text); }

.hp-aff-ladder { margin: .75rem 0; }
.hp-aff-ladder-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(5.5rem, 1fr));
  gap: .35rem;
}
@media (max-width: 420px) {
  .hp-aff-ladder-grid { grid-template-columns: 1fr 1fr; }
}
.hp-aff-ladder-card {
  padding: .4rem .45rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  display: grid;
  gap: .1rem;
  font-size: .78rem;
  text-align: left;
  color: inherit;
  font-family: inherit;
  cursor: pointer;
  min-height: 44px;
  width: 100%;
  box-sizing: border-box;
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
button.hp-aff-ladder-card:hover {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
}
button.hp-aff-ladder-card:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
}
.hp-aff-ladder-card strong {
  font-size: .9rem;
  font-variant-numeric: tabular-nums;
  color: var(--brand);
}
.hp-aff-ladder-card.is-base {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
}
.hp-aff-ladder-card.is-stress {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
  box-shadow: 0 0 0 1px color-mix(in srgb, #f59e0b 35%, transparent);
}
.hp-aff-ladder-card.is-near {
  border-color: color-mix(in srgb, #f59e0b 30%, var(--border));
  border-style: dashed;
}
@media (prefers-reduced-motion: reduce) {
  .hp-aff-ladder-card { transition: none; }
}
/* Levetidskostnad — stress-lån over hele løpetiden */
.hp-aff-life {
  margin: .65rem 0 .55rem;
  padding: .55rem .7rem .65rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, #8b5cf6 35%, var(--border));
  background: color-mix(in srgb, #8b5cf6 6%, var(--bg-elev));
}
.hp-aff-life-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
}
@media (max-width: 420px) {
  .hp-aff-life-grid { grid-template-columns: 1fr; }
}
.hp-aff-life-card {
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  display: grid;
  gap: .12rem;
}
.hp-aff-life-card strong {
  font-size: 1.02rem;
  font-variant-numeric: tabular-nums;
  color: var(--brand);
  letter-spacing: -0.02em;
}
.hp-aff-life-card.is-int strong { color: #7c3aed; }
.hp-aff-reverse-actions {
  flex-wrap: wrap;
  gap: .4rem;
}
.hp-aff-reverse-actions .btn {
  min-height: 40px;
}
.hp-aff-details-sec {
  margin: .75rem 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .65rem .55rem;
  background: var(--bg-elev);
  font-size: .9rem;
}
.hp-aff-details-sec > summary {
  cursor: pointer;
  font-weight: 650;
  color: var(--brand);
  list-style: none;
  display: flex;
  align-items: center;
  gap: .35rem;
}
.hp-aff-details-sec > summary::-webkit-details-marker { display: none; }
.hp-aff-how > summary,
.hp-aff-privacy > summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: .35rem;
}
.hp-aff-how > summary::-webkit-details-marker,
.hp-aff-privacy > summary::-webkit-details-marker { display: none; }
.hp-aff-omk-note { margin: .35rem 0 .5rem; }
.hp-aff-reverse-panel {
  margin: .65rem 0;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev));
}
.hp-aff-cf-seg.is-opex { background: color-mix(in srgb, #8b5cf6 70%, var(--brand)); }
.hp-aff-cf-leg.is-opex::before { background: color-mix(in srgb, #8b5cf6 70%, var(--brand)); }
.hp-aff-object {
  margin: .75rem 0;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-aff-obj-water {
  margin: 0 0 .5rem;
  padding: .4rem .5rem;
  border-radius: 8px;
  background: var(--bg);
  border: 1px solid var(--border);
}
.hp-aff-obj-water-row {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  margin-bottom: .3rem;
  font-size: .84rem;
}
.hp-aff-obj-water-bar {
  position: relative;
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, #ef4444 18%, var(--bg));
  border: 1px solid var(--border);
  overflow: hidden;
}
.hp-aff-obj-water-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: color-mix(in srgb, #22c55e 70%, var(--brand));
  transition: width .2s ease;
}
.hp-aff-obj-water-fill.is-tight {
  background: color-mix(in srgb, #f59e0b 75%, var(--brand));
}
.hp-aff-obj-water-fill.is-over {
  background: color-mix(in srgb, #ef4444 80%, var(--brand));
}
.hp-aff-obj-water-zero {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  background: color-mix(in srgb, var(--text) 55%, transparent);
  transform: translateX(-1px);
}
.hp-aff-bridge {
  margin: .75rem 0;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev));
}
.hp-aff-object.is-ok {
  border-color: color-mix(in srgb, #22c55e 40%, var(--border));
  background: color-mix(in srgb, #22c55e 8%, var(--bg-elev));
}
.hp-aff-object.is-tight {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-aff-object.is-over {
  border-color: color-mix(in srgb, #ef4444 45%, var(--border));
  background: color-mix(in srgb, #ef4444 10%, var(--bg-elev));
}
.hp-aff-table {
  width: 100%;
  margin: .35rem 0;
  border-collapse: collapse;
  font-size: .84rem;
}
.hp-aff-table th,
.hp-aff-table td {
  padding: .35rem 0;
  border-bottom: 1px solid var(--border);
  text-align: left;
}
.hp-aff-table th {
  font-weight: 550;
  color: var(--muted);
  padding-right: .75rem;
}
.hp-aff-table td {
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-weight: 650;
}
.hp-aff-obj-status {
  margin: .4rem 0 0;
  font-size: .82rem;
  color: var(--muted);
  line-height: 1.35;
}
.hp-aff-object.is-over .hp-aff-obj-status { color: #b91c1c; font-weight: 600; }
.hp-aff-object.is-tight .hp-aff-obj-status { color: #b45309; }
.hp-aff-tips-list {
  margin: .5rem 0 0;
  padding-left: 1.1rem;
  font-size: .84rem;
  color: var(--muted);
  display: grid;
  gap: .25rem;
}
.hp-aff-alert {
  margin: .45rem 0 0;
  padding: .45rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  font-size: .82rem;
}
.hp-aff-alert.is-warn {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
  color: #92400e;
}
.hp-aff-alert.is-bad {
  border-color: color-mix(in srgb, #ef4444 45%, var(--border));
  background: color-mix(in srgb, #ef4444 10%, var(--bg-elev));
  color: #b91c1c;
}
.hp-aff-commit { margin-top: .85rem; }
.hp-aff-commit-text {
  width: 100%;
  min-height: 6rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  margin: .35rem 0;
}
.hp-aff-commit-actions { margin-top: .35rem; }
.hp-aff-privacy {
  margin-top: .85rem;
  font-size: .88rem;
}
.hp-aff-privacy summary {
  cursor: pointer;
  font-weight: 600;
  color: var(--brand);
}
.hp-aff-actions { flex-wrap: wrap; gap: .5rem; align-items: center; }
.hp-aff-mobile-bar {
  display: none;
}
@media (max-width: 820px) {
  .hp-aff-mobile-bar {
    display: flex;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    gap: .65rem;
    align-items: center;
    justify-content: space-between;
    padding: .55rem .75rem calc(.55rem + env(safe-area-inset-bottom, 0));
    border-top: 1px solid color-mix(in srgb, var(--brand) 30%, var(--border));
    background: color-mix(in srgb, var(--bg-elev) 92%, var(--brand));
    box-shadow: 0 -6px 20px color-mix(in srgb, #000 12%, transparent);
    backdrop-filter: blur(8px);
  }
  .hp-aff-mobile-bar[hidden] { display: none !important; }
  .hp-aff-mobile-bar.hp-aff-mobile-bar--kb {
    display: none !important;
  }
  .hp-aff-mobile-bar-inner {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem .75rem;
    align-items: baseline;
    min-width: 0;
    flex: 1;
  }
  .hp-aff-mobile-bar-row {
    display: grid;
    gap: 0;
    min-width: 0;
  }
  .hp-aff-mobile-bar-num {
    font-size: .95rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    line-height: 1.15;
  }
  .hp-aff-mobile-bar-num.is-stress { color: #b45309; }
  .hp-aff-mobile-bar-num.is-comf { color: var(--brand); }
  .hp-aff-mobile-jump {
    min-height: 44px;
    min-width: 44px;
    flex-shrink: 0;
  }
  .hp-aff-mobile-disc {
    font-size: .68rem;
    opacity: .85;
  }
  .hp-aff-mobile-jump {
    min-height: 44px !important;
    min-width: 44px;
    padding: .55rem .85rem !important;
    flex-shrink: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hp-aff-ratio-fill,
  .hp-aff-ltv-fill,
  .hp-aff-split-int,
  .hp-aff-split-prin,
  .hp-aff-obj-water-fill { transition: none !important; }
}

/* —— Enkelt budtak (bid_cap) —— */
.hp-bc-hero { margin-bottom: .85rem; }
.hp-bc-lead { margin: 0; max-width: 42rem; }
.hp-bc-lead-bullets {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  display: grid;
  gap: .2rem;
}
.hp-bc-how {
  margin-top: .65rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .35rem .7rem .55rem;
  background: var(--bg-elev);
  clear: both;
}
.hp-bc-how summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
}
.hp-bc-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
  color: var(--muted);
  display: grid;
  gap: .25rem;
}
.hp-bc-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg-elev));
  color: #92400e;
  vertical-align: middle;
}
.hp-bc-demo-note {
  margin: .35rem 0 .55rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev));
}
.hp-bc-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: .55rem 0 .35rem;
}
.hp-bc-demos .chip {
  min-height: 44px;
  min-width: 44px;
  padding: .55rem .95rem;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  border-radius: 999px;
  font-size: .84rem;
  font-weight: 650;
  cursor: pointer;
  color: inherit;
  line-height: 1.25;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  max-width: 100%;
}
.hp-bc-demos .chip:hover,
.hp-bc-demos .chip.active,
.hp-bc-demos .chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-bc-demos .chip:focus-visible,
.hp-bc-quick .chip-sm:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 35%, transparent);
}
.hp-bc-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-bc-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .95fr);
  gap: 1rem;
  align-items: start;
}
.hp-bc-inputs { order: 1; }
.hp-bc-panel { order: 2; }
@media (max-width: 900px) {
  .hp-bc-layout {
    grid-template-columns: 1fr;
  }
  .hp-bc-panel { order: -1; }
}
.hp-bc-section {
  margin: 1rem 0 .45rem;
  font-size: 1rem;
  font-weight: 700;
}
.hp-bc-section:first-child { margin-top: 0; }
.hp-bc-panel {
  position: sticky;
  top: .75rem;
  padding: .85rem .9rem;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev));
  box-shadow: 0 8px 24px color-mix(in srgb, #000 6%, transparent);
}
@media (max-width: 900px) {
  .hp-bc-panel {
    position: static;
  }
}
.hp-bc-panel .hp-bid-num {
  font-size: clamp(1.55rem, 4vw, 2rem);
  font-weight: 800;
  color: var(--brand);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  line-height: 1.15;
  margin: .15rem 0;
}
.hp-bc-field-err {
  color: #b91c1c;
  margin: .25rem 0 0;
}
.hp-bc-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .45rem 0 .75rem;
}
.hp-bc-quick .chip-sm {
  min-height: 44px;
  min-width: 44px;
  padding: .45rem .75rem;
  font-size: .82rem;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  border-radius: 999px;
  cursor: pointer;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.hp-bc-quick .chip-sm[aria-pressed="true"],
.hp-bc-quick .chip-sm.active {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  font-weight: 650;
  color: var(--brand);
}
.hp-bc-quick-sep { opacity: .5; margin: 0 .15rem; }
.hp-bc-fold {
  margin: .65rem 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .35rem .65rem .55rem;
  background: var(--bg-elev);
}
.hp-bc-fold-sum {
  cursor: pointer;
  list-style: none;
  margin: 0;
}
.hp-bc-fold-sum::-webkit-details-marker { display: none; }
.hp-bc-hero-mascot {
  float: right;
  margin: 0 0 .5rem .75rem;
  border-radius: 12px;
}
.hp-bc-privacy {
  margin-top: .85rem;
  font-size: .88rem;
}
.hp-bc-nonadvice-fixed {
  margin: .2rem 0 0;
  font-size: .75rem;
}
.hp-bc-empty {
  padding: .75rem;
  border-radius: 10px;
  border: 1px dashed var(--border);
  margin-bottom: .65rem;
}
.hp-bc-live-max { margin-bottom: .55rem; }
.hp-bc-stack { margin: .75rem 0 .55rem; }
.hp-bc-stack-bar {
  display: flex;
  height: 12px;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  margin-bottom: .45rem;
}
.hp-bc-seg { display: block; min-width: 0; height: 100%; transition: width .2s ease; }
@media (prefers-reduced-motion: reduce) {
  .hp-bc-seg,
  .hp-bc-headroom-fill { transition: none !important; }
}
.hp-bc-seg-price { background: var(--brand); }
.hp-bc-seg-cost { background: color-mix(in srgb, var(--brand) 55%, var(--brand-2, #3aa6a0)); }
.hp-bc-seg-other { background: #2a8f8a; }
.hp-bc-seg-buf { background: #7fd4ce; }
.hp-bc-seg-emo { background: color-mix(in srgb, var(--brand) 40%, #0f6b6b); }
.hp-bc-seg-slack {
  background: repeating-linear-gradient(
    -45deg,
    color-mix(in srgb, var(--border) 80%, transparent),
    color-mix(in srgb, var(--border) 80%, transparent) 3px,
    transparent 3px,
    transparent 6px
  );
}
.hp-bc-legend {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .2rem;
  font-size: .78rem;
}
.hp-bc-legend li {
  display: flex;
  align-items: center;
  gap: .35rem;
  flex-wrap: wrap;
}
.hp-bc-legend span {
  margin-left: auto;
  font-variant-numeric: tabular-nums;
  font-weight: 650;
}
.hp-bc-dot {
  width: .65rem;
  height: .65rem;
  border-radius: 3px;
  flex-shrink: 0;
}
.hp-bc-seg-slack-dot {
  background: repeating-linear-gradient(
    -45deg,
    var(--border),
    var(--border) 2px,
    transparent 2px,
    transparent 4px
  );
  border: 1px solid var(--border);
}
.hp-bc-table {
  width: 100%;
  margin: .55rem 0;
  border-collapse: collapse;
  font-size: .84rem;
}
.hp-bc-table th,
.hp-bc-table td {
  padding: .35rem 0;
  border-bottom: 1px solid var(--border);
  text-align: left;
}
.hp-bc-table th {
  font-weight: 550;
  color: var(--muted);
  padding-right: .75rem;
}
.hp-bc-table td {
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-weight: 650;
}
.hp-bc-headroom {
  margin: .55rem 0;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-bc-headroom-row {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  align-items: baseline;
  margin-bottom: .35rem;
}
.hp-bc-headroom-bar {
  position: relative;
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 65%, transparent);
  overflow: hidden;
}
.hp-bc-headroom-fill {
  display: block;
  height: 100%;
  background: color-mix(in srgb, var(--brand) 70%, #22c55e);
  border-radius: 999px;
  transition: width .2s ease;
}
.hp-bc-headroom-fill--over { background: color-mix(in srgb, #ef4444 75%, var(--brand)); }
.hp-bc-headroom-fill--tight { background: color-mix(in srgb, #f59e0b 70%, var(--brand)); }
.hp-bc-headroom.is-ok {
  border-color: color-mix(in srgb, #22c55e 40%, var(--border));
}
.hp-bc-headroom.is-tight {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
}
.hp-bc-headroom.is-over {
  border-color: color-mix(in srgb, #ef4444 45%, var(--border));
}
.hp-bc-headroom-mark {
  position: absolute;
  top: -2px;
  width: 2px;
  height: 14px;
  background: var(--fg, #111);
  transform: translateX(-50%);
}
.hp-bc-headroom-status {
  margin: .35rem 0 0;
  font-size: .8rem;
  color: var(--muted);
  line-height: 1.35;
}
.hp-bc-headroom.is-over .hp-bc-headroom-status { color: #b91c1c; font-weight: 600; }
.hp-bc-headroom.is-tight .hp-bc-headroom-status { color: #b45309; }
.hp-bc-formula {
  margin: .55rem 0 .45rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  font-size: .82rem;
}
.hp-bc-formula-line {
  margin: 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.45;
  font-variant-numeric: tabular-nums;
  color: var(--text);
  word-break: break-word;
}
/* Practical round-down chips */
.hp-bc-practical {
  margin: .55rem 0 .5rem;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-bc-practical-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .35rem;
}
@media (max-width: 640px) {
  .hp-bc-practical-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.hp-bc-practical-chip {
  display: grid;
  gap: .1rem;
  text-align: left;
  padding: .4rem .45rem;
  min-height: 44px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
  color: inherit;
  font: inherit;
  cursor: pointer;
}
.hp-bc-practical-chip strong {
  font-size: .86rem;
  font-variant-numeric: tabular-nums;
  font-weight: 750;
}
.hp-bc-practical-chip:hover {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
}
.hp-bc-practical-chip:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
}
.hp-bc-practical-chip.active,
.hp-bc-practical-chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand) 25%, transparent);
}
/* Scenario dual */
.hp-bc-scenarios {
  margin: .55rem 0 .5rem;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-bc-scenario-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
}
@media (max-width: 480px) {
  .hp-bc-scenario-grid { grid-template-columns: 1fr; }
}
.hp-bc-scenario-card {
  display: grid;
  gap: .12rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
  font-size: .78rem;
}
.hp-bc-scenario-card strong {
  font-size: 1rem;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  color: var(--brand);
}
.hp-bc-scenario-card.is-strict {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
}
.hp-bc-scenario-card.is-stretch {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev));
}
.hp-bc-scenario-card.is-stretch strong { color: #b45309; }
/* Shortlist inputs + compare */
.hp-bc-shortlist {
  display: grid;
  gap: .55rem;
  margin-top: .35rem;
}
.hp-bc-sl-row {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto;
  gap: .45rem;
  align-items: end;
  padding: .45rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
@media (max-width: 720px) {
  .hp-bc-sl-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .hp-bc-sl-actions { justify-self: start; }
}
.hp-bc-sl-actions .btn { min-height: 44px; }
.hp-bc-sl-panel {
  margin: .55rem 0 .45rem;
}
.hp-bc-sl-compare {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: .4rem;
}
.hp-bc-sl-card {
  display: grid;
  gap: .12rem;
  text-align: left;
  padding: .45rem .5rem;
  min-height: 44px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  color: inherit;
  font: inherit;
  cursor: pointer;
  font-size: .78rem;
}
.hp-bc-sl-card strong {
  font-size: .88rem;
  font-variant-numeric: tabular-nums;
}
.hp-bc-sl-card:hover {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
}
.hp-bc-sl-card:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
}
.hp-bc-sl-card.is-ok {
  border-color: color-mix(in srgb, #22c55e 35%, var(--border));
}
.hp-bc-sl-card.is-tight {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev));
}
.hp-bc-sl-card.is-over {
  border-color: color-mix(in srgb, #ef4444 45%, var(--border));
  background: color-mix(in srgb, #ef4444 8%, var(--bg-elev));
}
.hp-bc-sl-card.is-active {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand) 55%, transparent);
}
/* Pre-round checklist */
.hp-bc-prep {
  margin-top: 1.25rem;
  max-width: 42rem;
  padding: .75rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 4%, var(--bg-elev));
}
.hp-bc-prep-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .4rem;
}
.hp-bc-prep-list label {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  font-size: .88rem;
  line-height: 1.35;
  cursor: pointer;
}
.hp-bc-prep-list input {
  margin-top: .2rem;
  flex-shrink: 0;
  width: 1.1rem;
  height: 1.1rem;
}
.hp-bc-prep-links .btn { min-height: 44px; }
.hp-bc-ladder { margin-top: .7rem; }
.hp-bc-ladder-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: .4rem;
}
.hp-bc-ladder-card {
  padding: .45rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  display: grid;
  gap: .12rem;
  font-size: .78rem;
  text-align: left;
  color: inherit;
  font: inherit;
  cursor: pointer;
  min-height: 44px;
  transition: border-color .12s, box-shadow .12s;
}
.hp-bc-ladder-card:hover {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand) 20%, transparent);
}
.hp-bc-ladder-card:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
}
.hp-bc-ladder-card strong {
  font-size: .88rem;
  font-variant-numeric: tabular-nums;
}
.hp-bc-ladder-card.is-over {
  border-color: color-mix(in srgb, #ef4444 45%, var(--border));
  background: color-mix(in srgb, #ef4444 8%, var(--bg-elev));
}
.hp-bc-ladder-card.is-cap {
  border-color: color-mix(in srgb, var(--brand) 50%, var(--border));
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
.hp-bc-ladder-card.is-ok {
  border-color: color-mix(in srgb, #22c55e 35%, var(--border));
}
.hp-bc-ladder-card.is-active {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand) 55%, transparent);
  font-weight: 650;
}
.hp-bc-probe-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: flex-end;
  padding-top: 1.35rem;
}
.hp-bc-probe-min {
  color: var(--text);
  line-height: 1.4;
}
.hp-bc-faq {
  margin-top: 1.25rem;
  max-width: 42rem;
}
.hp-bc-faq-item {
  margin: .35rem 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: .35rem .65rem;
}
.hp-bc-faq-item summary {
  cursor: pointer;
  font-weight: 650;
}
.hp-bc-whatif { margin-top: .75rem; }
.hp-bc-whatif-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .4rem;
}
@media (max-width: 640px) {
  .hp-bc-whatif-grid { grid-template-columns: 1fr; }
}
.hp-bc-whatif-card {
  padding: .45rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  display: grid;
  gap: .15rem;
  font-size: .78rem;
  text-align: left;
  color: inherit;
  font: inherit;
  cursor: pointer;
  min-height: 44px;
  transition: border-color .12s, box-shadow .12s;
}
.hp-bc-whatif-card:hover {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand) 20%, transparent);
}
.hp-bc-whatif-card:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
}
.hp-bc-whatif-card strong {
  font-size: .9rem;
  font-variant-numeric: tabular-nums;
}
.hp-bc-whatif-card.is-over {
  border-color: color-mix(in srgb, #ef4444 45%, var(--border));
  background: color-mix(in srgb, #ef4444 8%, var(--bg-elev));
}
.hp-bc-whatif-card.is-active {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand) 55%, transparent);
  font-weight: 650;
}
.hp-bc-alerts { margin-top: .75rem; display: grid; gap: .4rem; }
.hp-bc-alert {
  margin: 0;
  padding: .55rem .7rem;
  border-radius: 10px;
  font-size: .84rem;
  line-height: 1.35;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-bc-alert--warn {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 12%, var(--bg-elev));
}
.hp-bc-alert--info {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
}
.hp-bc-commit {
  margin-top: 1rem;
  padding-top: .85rem;
  border-top: 1px solid var(--border);
  display: grid;
  gap: .55rem;
}
.hp-bc-commit-label {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  font-size: .88rem;
  font-weight: 550;
  cursor: pointer;
}
.hp-bc-commit-label input { margin-top: .2rem; flex-shrink: 0; }
.hp-bc-commit-text {
  width: 100%;
  font-size: .8rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  line-height: 1.4;
  resize: vertical;
  min-height: 5.5rem;
  background: var(--bg-elev);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .55rem .7rem;
}
.hp-bc-commit-actions { margin-top: .15rem; flex-wrap: wrap; }
.hp-bc-actions .hp-bc-recalc { opacity: .85; }
.hp-bc-actions .btn,
.hp-bc-commit-actions .btn {
  min-height: 44px;
}
.hp-bc-pledge-needed .hp-bc-commit-label {
  outline: 2px solid color-mix(in srgb, #f59e0b 70%, var(--border));
  outline-offset: 3px;
  border-radius: 8px;
}
.hp-bc-pledged .hp-bc-commit {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
}
.hp-bc-probe-out {
  margin-top: .45rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  font-size: .86rem;
}
.hp-bc-mobile-bar { display: none; }
@media (max-width: 820px) {
  .hp-bc-mobile-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    padding: .65rem 0.85rem calc(.65rem + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
    background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
    box-shadow: 0 -6px 20px color-mix(in srgb, #000 12%, transparent);
  }
  .hp-bc-mobile-bar[hidden] { display: none !important; }
  .hp-bc-mobile-bar.hp-bc-mobile-bar--kb {
    display: none !important;
  }
  .hp-bc-mobile-bar-inner {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    min-width: 0;
  }
  .hp-bc-mobile-bar-num {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--brand);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
  }
  .hp-bc-mobile-disc {
    font-size: .72rem;
    line-height: 1.2;
  }
  .hp-bc-mobile-bar .hp-bc-mobile-jump,
  .hp-bc-mobile-bar [data-bc-mobile-jump] {
    min-height: 44px;
    min-width: 44px;
    padding: .55rem .9rem;
    font-size: .88rem;
    flex-shrink: 0;
  }
  /* room for sticky bar */
  .hp-engine[data-engine="bid_cap"],
  .hp-bc {
    padding-bottom: 4.5rem;
  }
  .hp-bc-actions {
    position: sticky;
    bottom: 4.75rem;
    z-index: 30;
    padding: .55rem 0;
    background: linear-gradient(to top, var(--bg-elev) 70%, transparent);
    flex-wrap: wrap;
  }
}

/* —— Visnings-scorekort (buy-visning-score) —— */
.hp-vs { display: grid; gap: 1rem; }
.hp-vs-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .85rem 1rem;
  align-items: start;
  padding: .85rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
}
.hp-vs-hero-mascot {
  width: 72px; height: 72px; border-radius: 50%;
  object-fit: cover; flex-shrink: 0;
  border: 2px solid color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-vs-hero-copy { min-width: 0; grid-column: 2; }
.hp-vs-lead-bullets {
  margin: .25rem 0 0; padding-left: 1.15rem;
  font-size: .88rem; color: var(--muted);
}
.hp-vs-lead-bullets li { margin: .15rem 0; }
.hp-vs-how {
  grid-column: 1 / -1;
  margin-top: .15rem;
  border-top: 1px dashed color-mix(in srgb, var(--brand) 25%, var(--border));
  padding-top: .45rem;
}
.hp-vs-how summary {
  cursor: pointer; font-weight: 700; font-size: .92rem;
}
.hp-vs-how-list {
  margin: .4rem 0 0; padding-left: 1.2rem;
  font-size: .88rem; color: var(--muted);
}
.hp-vs-how-list li { margin: .2rem 0; }
.hp-vs-demos {
  display: flex; flex-wrap: wrap; align-items: center; gap: .45rem;
}
.hp-vs-demo-badge {
  display: inline-block;
  font-size: .68rem; font-weight: 700; letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem; border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg-elev));
  border: 1px solid color-mix(in srgb, #f59e0b 45%, var(--border));
  color: var(--text);
}
.hp-vs-demo-note {
  margin: 0; padding: .4rem .65rem; border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.chip.chip-accent {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 16%, var(--bg-elev));
  font-weight: 700;
}
.hp-vs-weights {
  padding: .85rem 1rem;
  border-radius: 14px;
}
.hp-vs-weights-head {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .5rem;
}
.hp-vs-weights-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .55rem .75rem;
}
@media (max-width: 720px) {
  .hp-vs-weights-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 420px) {
  .hp-vs-weights-grid { grid-template-columns: 1fr; }
}
.hp-vs-weight {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .2rem .45rem;
  align-items: center;
  margin: 0;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-vs-weight-label { font-size: .85rem; font-weight: 600; }
.hp-vs-weight input[type="range"] {
  grid-column: 1 / -1;
  width: 100%;
  accent-color: var(--brand);
}
.hp-vs-weight-val {
  font-size: .75rem; font-weight: 700;
  color: var(--brand); text-transform: lowercase;
}
.hp-vs-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .95fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 860px) {
  .hp-vs-layout { grid-template-columns: 1fr; }
  .hp-vs-hero { grid-template-columns: auto 1fr; }
}
.hp-vs-section {
  font-size: 1rem; font-weight: 750; margin: 1rem 0 .45rem;
  letter-spacing: -0.02em;
}
.hp-vs-form-col .hp-vs-section:first-child { margin-top: 0; }
.hp-vs-dims {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem .85rem;
}
@media (max-width: 560px) {
  .hp-vs-dims { grid-template-columns: 1fr; }
}
.hp-vs-dim {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto auto;
  gap: .15rem .5rem;
  align-items: center;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  margin: 0;
}
.hp-vs-dim-label { grid-column: 1; font-size: .9rem; font-weight: 600; }
.hp-vs-dim input[type="range"] {
  grid-column: 1 / -1;
  width: 100%;
  accent-color: var(--brand);
}
.hp-vs-dim-val {
  grid-column: 2; grid-row: 1;
  font-weight: 800; font-variant-numeric: tabular-nums;
  color: var(--brand); min-width: 1.25rem; text-align: right;
}
.hp-vs-dim-bar {
  grid-column: 1 / -1;
  display: block;
  height: 4px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, var(--bg));
  overflow: hidden;
}
.hp-vs-dim-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--brand);
  transition: width .12s ease;
}
.hp-vs-live {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: .45rem .75rem;
  margin-top: .75rem;
  padding: .65rem .85rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
}
.hp-vs-live-block {
  display: flex; flex-direction: column; gap: .05rem;
}
.hp-vs-live-num {
  font-size: 1.65rem; font-weight: 800; letter-spacing: -0.03em;
  color: var(--brand); font-variant-numeric: tabular-nums;
  line-height: 1.05;
}
.hp-vs-live-w { color: color-mix(in srgb, var(--brand) 70%, #0f766e); }
.hp-vs-band {
  display: inline-block;
  font-size: .78rem; font-weight: 700;
  padding: .15rem .5rem; border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-vs-band.is-ok {
  border-color: color-mix(in srgb, #16a34a 50%, var(--border));
  background: color-mix(in srgb, #16a34a 14%, var(--bg-elev));
}
.hp-vs-band.is-mid {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 12%, var(--bg-elev));
}
.hp-vs-band.is-tight {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 12%, var(--bg-elev));
}
.hp-vs-flags {
  display: flex; flex-wrap: wrap; gap: .4rem;
}
.hp-vs-flag {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .35rem .55rem; border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  font-size: .82rem; font-weight: 550; cursor: pointer;
  margin: 0;
}
.hp-vs-flag:has(input:checked) {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 10%, var(--bg-elev));
}
.hp-vs-flag input { margin: 0; accent-color: #dc2626; }
.hp-vs-panel {
  padding: 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  box-shadow: var(--shadow);
  position: sticky;
  top: 0.75rem;
  max-height: calc(100vh - 1.5rem);
  overflow: auto;
}
.hp-vs-panel-head {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .5rem;
  margin-bottom: .45rem;
}
.hp-vs-sort,
.hp-vs-filters { display: flex; flex-wrap: wrap; gap: .3rem; }
.hp-vs-filters { margin-bottom: .55rem; }
.hp-vs-sort .chip.is-on,
.hp-vs-sort .chip[aria-pressed="true"],
.hp-vs-filters .chip.is-on,
.hp-vs-filters .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-vs-list { display: grid; gap: .65rem; }
.hp-vs-card {
  padding: .75rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 4%, var(--bg));
}
.hp-vs-card--avvent {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
}
.hp-vs-card--dropp {
  opacity: .78;
  border-style: dashed;
}
.hp-vs-card-top {
  display: flex; justify-content: space-between; gap: .65rem;
  align-items: flex-start;
}
.hp-vs-card-cmp {
  display: inline-flex; align-items: center; gap: .3rem;
  margin: 0 .5rem 0 0; cursor: pointer; font-weight: 500;
}
.hp-vs-card-score {
  display: flex; flex-direction: column; align-items: flex-end;
  flex-shrink: 0;
}
.hp-vs-card-avg {
  font-size: 1.35rem; font-weight: 800; color: var(--brand);
  font-variant-numeric: tabular-nums; letter-spacing: -0.02em;
  line-height: 1.1;
}
.hp-vs-card-meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: .35rem;
  margin-top: .2rem;
}
.hp-vs-status-pill {
  display: inline-block;
  font-size: .72rem; font-weight: 700;
  padding: .12rem .45rem; border-radius: 999px;
  border: 1px solid var(--border);
}
.hp-vs-status-pill--fortsett {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 12%, var(--bg-elev));
}
.hp-vs-status-pill--avvent {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 12%, var(--bg-elev));
}
.hp-vs-status-pill--dropp {
  border-color: color-mix(in srgb, #64748b 45%, var(--border));
  background: color-mix(in srgb, #64748b 10%, var(--bg-elev));
}
.hp-vs-card-bars {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .2rem .55rem;
  margin: .45rem 0 .25rem;
}
.hp-vs-card-bar-row {
  display: grid;
  grid-template-columns: 2.4rem 1fr 1.1rem;
  gap: .25rem;
  align-items: center;
  font-size: .72rem;
}
.hp-vs-card-bar-lab { color: var(--muted); font-weight: 600; }
.hp-vs-card-bar-track {
  height: 5px; border-radius: 999px;
  background: color-mix(in srgb, var(--border) 85%, var(--bg));
  overflow: hidden;
}
.hp-vs-card-bar-fill {
  display: block; height: 100%;
  background: var(--brand); border-radius: 999px;
}
.hp-vs-card-bar-n {
  text-align: right; font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.hp-vs-card-flags {
  font-size: .82rem; color: color-mix(in srgb, #dc2626 70%, var(--text));
  margin: .25rem 0;
}
.hp-vs-card-actions {
  display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .45rem;
  align-items: center;
}
.hp-vs-card-status-lab {
  display: inline-flex; align-items: center; gap: .3rem;
  margin: 0;
}
.hp-vs-card-status-lab select {
  font-size: .8rem;
  padding: .2rem .35rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
  max-width: 7.5rem;
}
.hp-vs-compare {
  margin-top: .85rem;
  padding-top: .65rem;
  border-top: 1px solid var(--border);
}
.hp-vs-compare-head {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .4rem;
  margin-bottom: .4rem;
}
.hp-vs-compare-table-wrap { overflow-x: auto; }
.hp-vs-cmp-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .82rem;
  min-width: 16rem;
}
.hp-vs-cmp-table th,
.hp-vs-cmp-table td {
  border: 1px solid var(--border);
  padding: .35rem .45rem;
  text-align: center;
}
.hp-vs-cmp-table th[scope="row"] {
  text-align: left;
  font-weight: 600;
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev));
  white-space: nowrap;
}
.hp-vs-cmp-table thead th {
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
  font-weight: 700;
}
.hp-vs-cmp-cell.is-best {
  background: color-mix(in srgb, #16a34a 16%, var(--bg-elev));
  font-weight: 800;
  color: color-mix(in srgb, #166534 70%, var(--text));
}
.hp-vs-cmp-meta th[scope="row"] {
  background: color-mix(in srgb, var(--border) 35%, var(--bg-elev));
}
.hp-vs-rank {
  margin-top: .85rem;
  padding-top: .65rem;
  border-top: 1px solid var(--border);
}
.hp-vs-rank-ol {
  margin: 0; padding-left: 1.2rem;
  font-size: .9rem;
}
.hp-vs-rank-ol li { margin: .2rem 0; }
.hp-vs-commit { margin-top: .85rem; }
.hp-vs-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 6rem;
}
.hp-vs-nonadvice {
  margin: .65rem 0 0;
  font-size: .78rem;
}
.hp-vs-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-vs-faq summary {
  cursor: pointer; font-weight: 650; font-size: .92rem;
}
.hp-vs-faq details p { margin: .35rem 0 .15rem; }
.hp-vs-actions .btn { min-height: 44px; }
@media (max-width: 560px) {
  .hp-vs-panel { position: static; max-height: none; }
  .hp-vs-card-bars { grid-template-columns: 1fr; }
}

/* —— Dokument-kiste kjøp/salg (doc_chest; data-dk-variant=buy|sell) —— */
.hp-dk-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-dk-hero-mascot {
  border-radius: 14px;
  object-fit: cover;
}
.hp-dk-hero-copy { min-width: 0; grid-column: 2; }
.hp-dk-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.1rem;
  font-size: .88rem;
  color: var(--muted, #5b6470);
}
.hp-dk-lead-bullets li { margin: .15rem 0; }
.hp-dk-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-dk-how summary {
  cursor: pointer; font-weight: 650; font-size: .92rem;
}
.hp-dk-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-dk-how-list li { margin: .2rem 0; }
.hp-dk-demos {
  display: flex; flex-wrap: wrap; gap: .4rem; align-items: center;
  margin: 0 0 .85rem;
}
.hp-dk-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: #fef3c7;
  color: #92400e;
}
.hp-dk-demo-note {
  margin: -.35rem 0 .85rem;
  padding: .45rem .65rem;
  border-radius: 10px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-dk-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .9fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 860px) {
  .hp-dk-layout { grid-template-columns: 1fr; }
  .hp-dk-hero { grid-template-columns: auto 1fr; }
}
.hp-dk-section {
  font-size: 1.05rem;
  margin: 1rem 0 .55rem;
}
.hp-dk-main .hp-dk-section:first-child { margin-top: 0; }
.hp-dk-phase-tabs {
  display: flex; flex-wrap: wrap; gap: .4rem;
  margin: 0 0 .65rem;
}
.hp-dk-tab.is-on,
.hp-dk-tab[aria-selected="true"] {
  background: var(--primary, #0f766e);
  color: #fff;
  border-color: transparent;
}
.hp-dk-tab-pct {
  display: inline-block;
  margin-left: .35rem;
  font-size: .78rem;
  font-weight: 700;
  opacity: .9;
}
.hp-dk-phase { margin-bottom: .5rem; }
.hp-dk-phase-help { margin: 0 0 .55rem; }
.hp-dk-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-dk-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: var(--card, #fff);
  transition: border-color .15s, background .15s;
}
.hp-dk-row.is-critical {
  border-left: 3px solid #d97706;
}
.hp-dk-row.is-gap {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-dk-row.is-ok {
  border-color: #86efac;
  background: #f7fdf9;
}
.hp-dk-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-dk-label {
  flex: 1 1 12rem;
  min-width: 0;
  font-size: .92rem;
  font-weight: 600;
  line-height: 1.35;
}
.hp-dk-crit-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #ffedd5;
  color: #9a3412;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-dk-status-wrap { flex: 0 0 auto; }
.hp-dk-status {
  min-width: 9.5rem;
  min-height: 40px;
  font-size: .88rem;
}
.hp-dk-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
  min-height: 36px;
}
.hp-dk-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .95rem;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-dk-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin-bottom: .75rem;
}
.hp-dk-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  background: var(--card, #fff);
  display: grid;
  gap: .15rem;
}
.hp-dk-gauge strong {
  font-size: 1.25rem;
  font-variant-numeric: tabular-nums;
}
.hp-dk-bars { display: grid; gap: .4rem; margin-bottom: .85rem; }
.hp-dk-bar-row {
  display: grid;
  grid-template-columns: 6.5rem 1fr;
  gap: .45rem;
  align-items: center;
}
.hp-dk-bar {
  height: 8px;
  border-radius: 99px;
  background: var(--border, #e5e7eb);
  overflow: hidden;
}
.hp-dk-bar-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #0f766e, #14b8a6);
  transition: width .2s ease;
}
.hp-dk-readiness {
  border-radius: 12px;
  padding: .65rem .75rem;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-dk-readiness.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-dk-readiness.is-mid {
  border-color: #fde68a;
  background: #fffbeb;
}
.hp-dk-readiness.is-tight {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-dk-ready-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-dk-critical-box {
  border: 1px solid #fecaca;
  background: #fff1f2;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-dk-critical-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-dk-critical-ul li { margin: .15rem 0; }
.hp-dk-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 8rem;
}
.hp-dk-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-dk-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-dk-faq summary {
  cursor: pointer; font-weight: 650; font-size: .92rem;
}
.hp-dk-faq details p { margin: .35rem 0 .15rem; }
.hp-dk-filters {
  display: flex; flex-wrap: wrap; gap: .35rem; align-items: center;
  margin: 0 0 .55rem;
}
.hp-dk-filter.is-on,
.hp-dk-filter[aria-pressed="true"] {
  background: var(--primary, #0f766e);
  color: #fff;
  border-color: transparent;
}
.hp-dk-filter-count { margin: -.25rem 0 .55rem; }
.hp-dk-status-cluster {
  display: flex; flex-wrap: wrap; gap: .35rem; align-items: center;
  flex: 0 0 auto;
}
.hp-dk-advance {
  min-height: 36px;
  min-width: 2.4rem;
  padding: .25rem .45rem;
  font-weight: 700;
}
.hp-dk-row.is-na {
  opacity: .72;
  border-style: dashed;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-dk-row.is-home-hidden { display: none !important; }
.hp-dk-deadline-pill {
  display: grid;
  gap: .1rem;
  margin: 0 0 .65rem;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-dk-deadline-pill.is-soon {
  border-color: #fde68a;
  background: #fffbeb;
}
.hp-dk-deadline-pill.is-past {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-dk-deadline-pill strong {
  font-size: .92rem;
  font-variant-numeric: tabular-nums;
}
.hp-dk-next {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
  background: var(--card, #fff);
}
.hp-dk-next-ol {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-dk-next-ol li { margin: .25rem 0; }
.hp-dk-request {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
  background: var(--card, #fff);
}
.hp-dk-request .hp-dk-commit-text { min-height: 5.5rem; }
@media (max-width: 560px) {
  .hp-dk-panel { position: static; }
  .hp-dk-bar-row { grid-template-columns: 1fr; gap: .2rem; }
  .hp-dk-gauges { grid-template-columns: 1fr; }
  .hp-dk-status { min-width: 100%; width: 100%; }
  .hp-dk-row-top { flex-direction: column; }
  .hp-dk-status-cluster { width: 100%; }
  .hp-dk-status-wrap { flex: 1 1 auto; }
  .hp-dk-status { width: 100%; }
}

/* —— Forbehold-hjelper —— */
.hp-fb-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .85rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-fb-hero-mascot {
  width: 72px; height: 72px; object-fit: contain;
  border-radius: 16px;
}
.hp-fb-hero-copy { min-width: 0; grid-column: 2; }
.hp-fb-lead-bullets {
  margin: .25rem 0 0; padding-left: 1.15rem; font-size: .86rem;
}
.hp-fb-lead-bullets li { margin: .15rem 0; }
.hp-fb-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-fb-how summary { cursor: pointer; font-weight: 700; font-size: .92rem; }
.hp-fb-how-list { margin: .4rem 0 0; padding-left: 1.2rem; font-size: .86rem; }
.hp-fb-how-list li { margin: .2rem 0; }
.hp-fb-demos {
  display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .5rem;
  margin-bottom: .65rem;
}
.hp-fb-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 750;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
  border: 1px solid #fcd34d;
}
.hp-fb-demo-note {
  margin: 0 0 .85rem;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-fb-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 860px) {
  .hp-fb-layout { grid-template-columns: 1fr; }
  .hp-fb-hero { grid-template-columns: auto 1fr; }
}
.hp-fb-section {
  margin: 1rem 0 .45rem;
  font-size: 1.02rem;
  font-weight: 750;
  letter-spacing: -0.02em;
}
.hp-fb-main .hp-fb-section:first-child { margin-top: 0; }
.hp-fb-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-fb-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .65rem .75rem;
  background: var(--bg-elev, #fff);
  transition: border-color .15s, background .15s;
}
.hp-fb-row.is-on {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev, #fff));
}
.hp-fb-row.is-critical.is-on {
  border-color: color-mix(in srgb, #0f766e 40%, var(--border));
}
.hp-fb-row.is-drop {
  opacity: .72;
}
.hp-fb-row-top {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: .45rem .75rem;
}
.hp-fb-on {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  cursor: pointer;
  flex: 1;
  min-width: 12rem;
  font-weight: 650;
  font-size: .92rem;
}
.hp-fb-on input { margin-top: .2rem; accent-color: var(--brand, #0f766e); }
.hp-fb-crit-badge {
  display: inline-block;
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .32rem;
  border-radius: 6px;
  background: #ccfbf1;
  color: #115e59;
  border: 1px solid #99f6e4;
  margin-right: .25rem;
  vertical-align: middle;
}
.hp-fb-status-wrap { flex-shrink: 0; }
.hp-fb-status {
  min-width: 9.5rem;
  font-size: .85rem;
  padding: .3rem .45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-fb-row-fields {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .4rem .5rem;
  align-items: end;
  margin-top: .55rem;
  padding-top: .55rem;
  border-top: 1px dashed var(--border);
}
.hp-fb-row-fields .hp-fb-day-chips { grid-column: 2; }
.hp-fb-row-fields .hp-fb-row-rel { grid-column: 1 / -1; }
.hp-fb-row-fields .hp-fb-note { grid-column: 1 / -1; }
.hp-fb-row-fields .hp-fb-snippet,
.hp-fb-row-fields .hp-fb-custom { grid-column: 1 / -1; font-size: .84rem; }
.hp-fb-dl-lab {
  display: flex;
  flex-direction: column;
  gap: .15rem;
  font-size: .8rem;
}
.hp-fb-dl-lab input[type="date"] {
  font-size: .85rem;
  padding: .3rem .4rem;
  border-radius: 8px;
  border: 1px solid var(--border);
}
@media (max-width: 560px) {
  .hp-fb-row-fields { grid-template-columns: 1fr 1fr; }
  .hp-fb-row-top { flex-direction: column; }
  .hp-fb-status { width: 100%; min-width: 0; }
}
.hp-fb-panel {
  position: sticky;
  top: 4.5rem;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 1rem;
  background: var(--bg-elev, #fff);
  box-shadow: var(--shadow, 0 4px 16px rgba(0,0,0,.04));
}
.hp-fb-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .75rem;
}
.hp-fb-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-fb-gauge-wide { grid-column: 1 / -1; }
.hp-fb-gauge strong { font-size: 1.25rem; font-weight: 800; letter-spacing: -0.02em; }
.hp-fb-accept-block { display: flex; flex-direction: column; gap: .35rem; }
.hp-fb-accept-chips {
  display: flex; flex-wrap: wrap; gap: .3rem .4rem;
}
.hp-fb-accept-rel { margin: 0; min-height: 1.1em; }
.hp-fb-seed-hint {
  margin: .45rem 0 0;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev, #fff));
  border: 1px solid color-mix(in srgb, var(--brand) 25%, var(--border));
}
.hp-fb-day-chips {
  display: flex; flex-wrap: wrap; gap: .25rem;
  align-items: center;
}
.hp-fb-day-chips .btn-sm { padding: .2rem .4rem; font-size: .78rem; }
.hp-fb-row-rel {
  grid-column: 1 / -1;
  font-size: .8rem;
  font-weight: 650;
  color: var(--brand, #0f766e);
}
.hp-fb-row-rel.is-past { color: #b91c1c; }
.hp-fb-profile {
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-fb-profile-badge {
  display: inline-block;
  font-weight: 750;
  font-size: .88rem;
  padding: .15rem .45rem;
  border-radius: 8px;
  background: #f1f5f9;
  border: 1px solid var(--border);
}
.hp-fb-profile.is-bare .hp-fb-profile-badge {
  background: #fef2f2; border-color: #fecaca; color: #991b1b;
}
.hp-fb-profile.is-light .hp-fb-profile-badge {
  background: #ecfdf5; border-color: #a7f3d0; color: #065f46;
}
.hp-fb-profile.is-mid .hp-fb-profile-badge {
  background: #fffbeb; border-color: #fde68a; color: #92400e;
}
.hp-fb-profile.is-heavy .hp-fb-profile-badge {
  background: #eff6ff; border-color: #bfdbfe; color: #1e40af;
}
.hp-fb-readiness {
  border-radius: 12px;
  padding: .65rem .75rem;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-fb-readiness.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-fb-readiness.is-mid {
  border-color: #fde68a;
  background: #fffbeb;
}
.hp-fb-readiness.is-tight {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-fb-ready-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-fb-warn {
  border: 1px solid #fecaca;
  background: #fff1f2;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-fb-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-fb-warn-ul li { margin: .15rem 0; }
.hp-fb-logic {
  border: 1px solid #fde68a;
  background: #fffbeb;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-fb-logic-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-fb-logic-ul li { margin: .15rem 0; }
.hp-fb-next {
  margin: 0 0 .5rem;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-fb-next li { margin: .2rem 0; }
.hp-fb-subh {
  margin: .85rem 0 .35rem;
  font-size: .9rem;
  font-weight: 750;
}
.hp-fb-timeline {
  margin: 0 0 .5rem;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-fb-timeline li { margin: .25rem 0; }
.hp-fb-timeline li.is-past { opacity: .75; }
.hp-fb-tl-rel {
  display: inline-block;
  margin-left: .25rem;
  font-size: .75rem;
  font-weight: 700;
  padding: .05rem .35rem;
  border-radius: 999px;
  background: #ccfbf1;
  color: #115e59;
  border: 1px solid #99f6e4;
}
.hp-fb-tl-rel.is-past {
  background: #fee2e2;
  color: #991b1b;
  border-color: #fecaca;
}
.hp-fb-draft {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 10rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-fb-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-fb-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-fb-faq summary {
  cursor: pointer; font-weight: 650; font-size: .92rem;
}
.hp-fb-faq details p { margin: .35rem 0 .15rem; }
.chip.chip-sm {
  font-size: .75rem;
  padding: .2rem .45rem;
}
@media (max-width: 560px) {
  .hp-fb-panel { position: static; }
  .hp-fb-gauges { grid-template-columns: 1fr; }
  .hp-fb-gauge-wide { grid-column: auto; }
  .hp-fb-row-fields { grid-template-columns: 1fr 1fr; }
}

/* —— Etterkjøp-sjekkliste (buy-etterkjop-sjekk) —— */
.hp-ek { max-width: 1100px; }
.hp-ek-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-ek-hero-mascot {
  border-radius: 16px;
  object-fit: cover;
  background: var(--bg-elev, #f8fafc);
}
.hp-ek-hero-copy { min-width: 0; grid-column: 2; }
.hp-ek-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-ek-lead-bullets li { margin: .15rem 0; }
.hp-ek-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-ek-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-ek-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .88rem;
}
.hp-ek-how-list li { margin: .2rem 0; }
.hp-ek-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-ek-demo-badge {
  display: inline-block;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: #fef3c7;
  color: #92400e;
  border: 1px solid #fcd34d;
  vertical-align: middle;
}
.hp-ek-demo-note {
  margin: 0 0 .85rem;
  padding: .45rem .65rem;
  border-radius: 10px;
  border: 1px dashed #fcd34d;
  background: #fffbeb;
}
.hp-ek-layout {
  display: grid;
  grid-template-columns: 1.35fr minmax(260px, .9fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-ek-layout { grid-template-columns: 1fr; }
  .hp-ek-hero { grid-template-columns: auto 1fr; }
}
.hp-ek-section {
  margin: 1rem 0 .55rem;
  font-size: 1.05rem;
  font-weight: 750;
  letter-spacing: -0.01em;
}
.hp-ek-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .65rem;
}
.hp-ek-tab.is-on,
.hp-ek-tab[aria-selected="true"] {
  background: var(--primary, #0f766e);
  color: #fff;
  border-color: transparent;
}
.hp-ek-tab-pct {
  display: inline-block;
  margin-left: .25rem;
  font-size: .75rem;
  opacity: .9;
  font-weight: 700;
}
.hp-ek-phase { margin-bottom: .5rem; }
.hp-ek-phase-help { margin: 0 0 .55rem; }
.hp-ek-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-ek-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .6rem .7rem;
  background: var(--card, #fff);
  transition: border-color .15s, background .15s;
}
.hp-ek-row.is-critical {
  border-left: 3px solid #f59e0b;
}
.hp-ek-row.is-done {
  opacity: .78;
  background: color-mix(in srgb, #ecfdf5 55%, var(--card, #fff));
}
.hp-ek-row.is-doing {
  border-color: #93c5fd;
  background: color-mix(in srgb, #eff6ff 60%, var(--card, #fff));
}
.hp-ek-row.is-gap {
  border-color: #fca5a5;
  background: color-mix(in srgb, #fef2f2 50%, var(--card, #fff));
}
.hp-ek-row.is-overdue:not(.is-done) {
  box-shadow: inset 0 0 0 1px #f87171;
}
.hp-ek-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  justify-content: space-between;
  align-items: flex-start;
}
.hp-ek-row-label {
  flex: 1 1 12rem;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.hp-ek-crit-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .35rem;
  border-radius: 6px;
  background: #fff7ed;
  color: #c2410c;
  border: 1px solid #fdba74;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-ek-due { display: block; margin-top: .1rem; }
.hp-ek-status-wrap { flex: 0 0 auto; }
.hp-ek-status {
  min-width: 9.5rem;
  font-size: .85rem;
  padding: .3rem .45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-ek-note {
  width: 100%;
  margin-top: .45rem;
  font-size: .86rem;
  padding: .35rem .5rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-ek-panel {
  position: sticky;
  top: 4.5rem;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 1rem;
  background: var(--bg-elev, #fff);
  box-shadow: var(--shadow, 0 4px 16px rgba(0,0,0,.04));
}
.hp-ek-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .75rem;
}
.hp-ek-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-ek-gauge strong { font-size: 1.25rem; font-weight: 800; letter-spacing: -0.02em; }
.hp-ek-bars { margin-bottom: .75rem; display: grid; gap: .35rem; }
.hp-ek-bar-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: .15rem;
}
.hp-ek-bar {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, #fff);
  overflow: hidden;
}
.hp-ek-bar-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #0d9488, #14b8a6);
  transition: width .2s ease;
}
.hp-ek-readiness {
  border-radius: 12px;
  padding: .65rem .75rem;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-ek-readiness.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-ek-readiness.is-mid {
  border-color: #fde68a;
  background: #fffbeb;
}
.hp-ek-readiness.is-tight {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-ek-ready-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-ek-warn {
  border: 1px solid #fecaca;
  background: #fff1f2;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-ek-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-ek-warn-ul li { margin: .15rem 0; }
.hp-ek-subh {
  margin: .85rem 0 .35rem;
  font-size: .9rem;
  font-weight: 750;
}
.hp-ek-timeline {
  margin: 0 0 .5rem;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-ek-timeline li { margin: .25rem 0; }
.hp-ek-timeline li.is-overdue { color: #b91c1c; }
.hp-ek-overdue-flag {
  display: inline-block;
  font-size: .68rem;
  font-weight: 750;
  text-transform: uppercase;
  padding: .05rem .3rem;
  border-radius: 5px;
  background: #fee2e2;
  color: #991b1b;
  margin-left: .25rem;
}
.hp-ek-daybadge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .65rem;
  margin: .5rem 0 .75rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-ek-daybadge strong { font-size: 1.1rem; font-weight: 800; }
.hp-ek-summary {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 10rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-ek-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-ek-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-ek-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-ek-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-ek-panel { position: static; }
  .hp-ek-gauges { grid-template-columns: 1fr; }
  .hp-ek-row-top { flex-direction: column; }
  .hp-ek-status { width: 100%; min-width: 0; }
}

/* —— Flytteplan (buy-flytteplan-kjop) —— */
.hp-fp-hero {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-fp-hero-mascot {
  border-radius: 16px;
  width: 72px;
  height: 72px;
  object-fit: cover;
}
.hp-fp-hero-copy { min-width: 0; grid-column: 2; }
.hp-fp-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-fp-lead-bullets li { margin: .15rem 0; }
.hp-fp-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem;
  background: color-mix(in srgb, var(--bg) 55%, var(--bg-elev, #fff));
}
.hp-fp-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-fp-how-list {
  margin: .35rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-fp-how-list li { margin: .2rem 0; }
.hp-fp-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .85rem;
}
.hp-fp-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
  border: 1px solid #fcd34d;
}
.hp-fp-demo-note {
  margin: -.35rem 0 .85rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-fp-layout {
  display: grid;
  grid-template-columns: 1.35fr minmax(260px, .9fr);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-fp-layout { grid-template-columns: 1fr; }
  .hp-fp-hero { grid-template-columns: auto 1fr; }
}
.hp-fp-section {
  margin: 1rem 0 .55rem;
  font-size: 1.02rem;
  font-weight: 750;
}
.hp-fp-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .65rem;
}
.hp-fp-tab.is-on,
.hp-fp-tab[aria-selected="true"] {
  background: color-mix(in srgb, var(--primary, #2563eb) 18%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--primary, #2563eb) 45%, var(--border));
  font-weight: 700;
}
.hp-fp-tab.is-suggested:not(.is-on) {
  box-shadow: inset 0 0 0 1px #f59e0b;
}
.hp-fp-tab-pct {
  margin-left: .25rem;
  font-size: .75rem;
  opacity: .85;
  font-weight: 650;
}
.hp-fp-phase-help { margin: 0 0 .55rem; }
.hp-fp-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-fp-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .65rem;
  background: var(--card, #fff);
}
.hp-fp-row.is-critical {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
}
.hp-fp-row.is-done {
  opacity: .78;
  background: color-mix(in srgb, #ecfdf5 55%, var(--card, #fff));
}
.hp-fp-row.is-doing {
  background: color-mix(in srgb, #eff6ff 60%, var(--card, #fff));
}
.hp-fp-row.is-gap {
  border-color: #fbbf24;
}
.hp-fp-row.is-overdue {
  border-color: #f87171;
  background: #fef2f2;
}
.hp-fp-row-top {
  display: flex;
  gap: .55rem;
  justify-content: space-between;
  align-items: flex-start;
}
.hp-fp-row-label { min-width: 0; flex: 1; }
.hp-fp-crit-badge {
  display: inline-block;
  font-size: .7rem;
  font-weight: 750;
  padding: .05rem .35rem;
  border-radius: 999px;
  background: #fff7ed;
  color: #c2410c;
  border: 1px solid #fdba74;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-fp-due { display: block; margin-top: .15rem; }
.hp-fp-status-wrap { flex-shrink: 0; }
.hp-fp-status {
  min-width: 8.5rem;
  font-size: .86rem;
}
.hp-fp-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .35rem .5rem;
}
.hp-fp-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: .85rem .9rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-fp-countdown {
  display: flex;
  flex-direction: column;
  gap: .1rem;
  border-radius: 14px;
  padding: .7rem .8rem;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
  text-align: center;
}
.hp-fp-countdown strong {
  font-size: 1.55rem;
  font-weight: 850;
  letter-spacing: -0.03em;
}
.hp-fp-countdown.is-soon {
  border-color: #fbbf24;
  background: #fffbeb;
}
.hp-fp-countdown.is-today {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-fp-countdown.is-past {
  border-color: #93c5fd;
  background: #eff6ff;
}
.hp-fp-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin-bottom: .75rem;
}
.hp-fp-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  background: var(--card, #fff);
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-fp-gauge strong { font-size: 1.2rem; font-weight: 800; letter-spacing: -0.02em; }
.hp-fp-bars { display: grid; gap: .4rem; margin-bottom: .75rem; }
.hp-fp-bar-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(80px, 1.1fr);
  gap: .4rem;
  align-items: center;
}
.hp-fp-bar {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-fp-bar-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #60a5fa, #2563eb);
  transition: width .25s ease;
}
.hp-fp-readiness {
  border-radius: 12px;
  padding: .65rem .75rem;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-fp-readiness.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-fp-readiness.is-mid {
  border-color: #fde68a;
  background: #fffbeb;
}
.hp-fp-readiness.is-tight {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-fp-ready-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-fp-warn {
  border: 1px solid #fecaca;
  background: #fff1f2;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-fp-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-fp-warn-ul li { margin: .15rem 0; }
.hp-fp-subh {
  margin: .85rem 0 .35rem;
  font-size: .9rem;
  font-weight: 750;
}
.hp-fp-timeline {
  margin: 0 0 .5rem;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-fp-timeline li { margin: .25rem 0; }
.hp-fp-timeline li.is-overdue { color: #b91c1c; }
.hp-fp-summary {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 10rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-fp-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-fp-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-fp-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-fp-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-fp-panel { position: static; }
  .hp-fp-gauges { grid-template-columns: 1fr; }
  .hp-fp-row-top { flex-direction: column; }
  .hp-fp-status { width: 100%; min-width: 0; }
  .hp-fp-bar-row { grid-template-columns: 1fr; }
}

/* —— Visningsplan uke (buy-visningsplan) —— */
.hp-vp-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .65rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-vp-hero-mascot {
  border-radius: 14px;
  grid-row: span 2;
}
.hp-vp-hero-copy { min-width: 0; grid-column: 2; }
.hp-vp-lead-bullets {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-vp-lead-bullets li { margin: .15rem 0; }
.hp-vp-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-vp-how summary { cursor: pointer; font-weight: 700; font-size: .92rem; }
.hp-vp-how-list { margin: .4rem 0 0; padding-left: 1.2rem; font-size: .86rem; }
.hp-vp-how-list li { margin: .2rem 0; }
.hp-vp-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-vp-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #e0e7ff;
  color: #3730a3;
  vertical-align: middle;
}
.hp-vp-demo-note {
  margin: 0 0 .75rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: #eef2ff;
  border: 1px dashed #a5b4fc;
}
.hp-vp-demos .chip[aria-pressed="true"] {
  outline: 2px solid var(--brand, #0f766e);
  outline-offset: 1px;
}
.hp-vp-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.1rem;
  align-items: start;
}
@media (min-width: 960px) {
  .hp-vp-layout { grid-template-columns: minmax(0, 1.05fr) minmax(18rem, .95fr); }
}
@media (max-width: 959px) {
  .hp-vp-hero { grid-template-columns: auto 1fr; }
}
.hp-vp-section {
  margin: 1.1rem 0 .55rem;
  font-size: 1.02rem;
  font-weight: 750;
}
.hp-vp-form-col .hp-vp-section:first-child { margin-top: 0; }
.hp-vp-prep {
  display: grid;
  gap: .35rem;
}
.hp-vp-prep-item {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  font-size: .9rem;
  padding: .35rem .45rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--card, #fff);
  cursor: pointer;
}
.hp-vp-prep-item input { margin-top: .2rem; accent-color: var(--brand, #0f766e); }
.hp-vp-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .95rem;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-vp-panel-head {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .75rem;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: .65rem;
}
.hp-vp-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin-bottom: .75rem;
}
.hp-vp-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  background: var(--card, #fff);
  display: grid;
  gap: .1rem;
}
.hp-vp-gauge strong {
  font-size: 1.15rem;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.hp-vp-readiness {
  border-radius: 12px;
  padding: .65rem .75rem;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-vp-readiness.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-vp-readiness.is-mid {
  border-color: #fde68a;
  background: #fffbeb;
}
.hp-vp-readiness.is-tight {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-vp-ready-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-vp-warn {
  border: 1px solid #fecaca;
  background: #fff1f2;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-vp-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-vp-warn-ul li { margin: .15rem 0; }
.hp-vp-week {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: .35rem;
  margin-bottom: .85rem;
}
@media (max-width: 900px) {
  .hp-vp-week { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 420px) {
  .hp-vp-week { grid-template-columns: 1fr; }
}
.hp-vp-daycol {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--card, #fff);
  min-height: 5.5rem;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.hp-vp-daycol.is-hot { border-color: #fbbf24; }
.hp-vp-daycol.has-conflict { border-color: #f87171; }
.hp-vp-daycol-h {
  display: flex;
  flex-wrap: wrap;
  gap: .15rem .35rem;
  align-items: baseline;
  padding: .35rem .4rem;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, var(--card, #fff));
  font-size: .78rem;
}
.hp-vp-day-count.is-hot {
  color: #b45309;
  font-weight: 800;
}
.hp-vp-day-slots {
  display: grid;
  gap: .25rem;
  padding: .3rem;
  flex: 1;
}
.hp-vp-empty-day {
  margin: .25rem;
  font-size: .75rem;
}
.hp-vp-slot {
  display: grid;
  gap: .05rem;
  text-align: left;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: .3rem .35rem;
  background: color-mix(in srgb, var(--brand, #0f766e) 5%, var(--card, #fff));
  cursor: pointer;
  font: inherit;
  color: inherit;
  width: 100%;
}
.hp-vp-slot:hover,
.hp-vp-slot:focus-visible {
  border-color: var(--brand, #0f766e);
  outline: none;
}
.hp-vp-slot.is-conflict {
  border-color: #f87171;
  background: #fef2f2;
}
.hp-vp-slot.is-done {
  opacity: .72;
  border-style: dashed;
}
.hp-vp-slot-time {
  font-weight: 800;
  font-size: .78rem;
  font-variant-numeric: tabular-nums;
}
.hp-vp-slot-name {
  font-size: .78rem;
  font-weight: 600;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.hp-vp-list-wrap { margin-bottom: .75rem; }
.hp-vp-list {
  display: grid;
  gap: .45rem;
}
.hp-vp-card {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .65rem;
  background: var(--card, #fff);
}
.hp-vp-card.is-conflict {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-vp-card.is-done {
  border-color: #86efac;
  background: #f7fdf9;
}
.hp-vp-card.is-skip { opacity: .55; }
.hp-vp-card-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .65rem;
  justify-content: space-between;
  align-items: flex-start;
}
.hp-vp-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
}
.hp-vp-card-flag {
  color: #b91c1c;
  font-size: .82rem;
  font-weight: 650;
  margin-top: .2rem;
}
.hp-vp-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 8rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-vp-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-vp-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-vp-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-vp-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-vp-panel { position: static; }
  .hp-vp-gauges { grid-template-columns: 1fr 1fr; }
  .hp-vp-card-top { flex-direction: column; }
}

/* —— Oppuss før salg (sell_reno / sell-oppuss-for-salg) —— */
.hp-sreno-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-sreno-hero-mascot {
  border-radius: 14px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, #fff);
}
.hp-sreno-hero-copy { min-width: 0; grid-column: 2; }
.hp-sreno-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-sreno-lead-bullets li { margin: .15rem 0; }
.hp-sreno-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-sreno-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-sreno-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-sreno-how-list li { margin: .2rem 0; }
.hp-sreno-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .5rem;
  margin: .35rem 0 .55rem;
}
.hp-sreno-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: #fef3c7;
  color: #92400e;
  vertical-align: middle;
}
.hp-sreno-demo-note {
  margin: 0 0 .65rem;
  padding: .4rem .6rem;
  border-radius: 10px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-sreno-demos .chip {
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  border-radius: 999px;
  padding: .35rem .7rem;
  font-size: .86rem;
  cursor: pointer;
}
.hp-sreno-demos .chip:hover,
.hp-sreno-demos .chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, #fff);
}
.hp-sreno-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-sreno-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-sreno-layout { grid-template-columns: 1fr; }
  .hp-sreno-hero { grid-template-columns: auto 1fr; }
}
.hp-sreno-section {
  margin: 1rem 0 .45rem;
  font-size: 1.02rem;
  font-weight: 750;
  letter-spacing: -0.02em;
}
.hp-sreno-main .hp-sreno-section:first-child { margin-top: 0; }
.hp-sreno-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-elev, #fff);
}
.hp-sreno-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .86rem;
  min-width: 720px;
}
.hp-sreno-table th,
.hp-sreno-table td {
  padding: .55rem .55rem;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
  text-align: left;
}
.hp-sreno-table thead th {
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--muted, #64748b);
  background: color-mix(in srgb, var(--bg) 70%, #fff);
  position: sticky;
  top: 0;
}
.hp-sreno-row.is-on {
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, #fff);
}
.hp-sreno-row.is-pack td:first-child {
  box-shadow: inset 3px 0 0 #0f766e;
}
.hp-sreno-row.is-over {
  background: color-mix(in srgb, #f59e0b 8%, #fff);
}
.hp-sreno-row.is-over td:first-child {
  box-shadow: inset 3px 0 0 #d97706;
}
.hp-sreno-name {
  display: block;
  font-weight: 650;
  font-size: .9rem;
}
.hp-sreno-hint {
  display: block;
  margin-top: .15rem;
  line-height: 1.35;
  max-width: 28rem;
}
.hp-sreno-check { display: inline-flex; align-items: center; }
.hp-sreno-cost {
  width: 7.2rem;
  max-width: 100%;
  font-variant-numeric: tabular-nums;
}
.hp-sreno-weeks-in {
  width: 3.6rem;
  font-variant-numeric: tabular-nums;
}
.hp-sreno-appeal-cell {
  white-space: nowrap;
  min-width: 7.5rem;
}
.hp-sreno-appeal {
  width: 5.5rem;
  vertical-align: middle;
}
.hp-sreno-appeal-val {
  display: inline-block;
  min-width: 1.1rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  margin-left: .25rem;
}
.hp-sreno-kind {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  padding: .15rem .4rem;
  border-radius: 999px;
  white-space: nowrap;
  background: #f1f5f9;
  color: #334155;
}
.hp-sreno-kind-quick { background: #dcfce7; color: #166534; }
.hp-sreno-kind-cosmetic { background: #e0f2fe; color: #075985; }
.hp-sreno-kind-major { background: #ffedd5; color: #9a3412; }
.hp-sreno-kind-fix { background: #fce7f3; color: #9d174d; }
.hp-sreno-kind-disclose { background: #f3e8ff; color: #6b21a8; }
.hp-sreno-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .9rem 1rem;
  background: var(--bg-elev, #fff);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 60%, transparent);
}
.hp-sreno-gauges {
  display: grid;
  grid-template-columns: 1fr;
  gap: .55rem;
  margin-bottom: .75rem;
}
.hp-sreno-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .65rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-sreno-gauge strong {
  font-size: 1.2rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.hp-sreno-status {
  border-radius: 12px;
  padding: .65rem .75rem;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-sreno-status.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-sreno-status.is-mid {
  border-color: #fde68a;
  background: #fffbeb;
}
.hp-sreno-status.is-tight {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-sreno-status-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-sreno-subh {
  margin: .85rem 0 .35rem;
  font-size: .9rem;
  font-weight: 750;
}
.hp-sreno-rank {
  margin: 0 0 .5rem;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-sreno-rank li { margin: .3rem 0; }
.hp-sreno-rank-top strong { color: color-mix(in srgb, var(--brand, #0f766e) 90%, #000); }
.hp-sreno-actions {
  list-style: none;
  margin: 0 0 .5rem;
  padding: 0;
  font-size: .86rem;
}
.hp-sreno-actions li {
  margin: .3rem 0;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, #fff);
}
.hp-sreno-act-do { border-color: #86efac !important; background: #f0fdf4 !important; }
.hp-sreno-act-fix { border-color: #f9a8d4 !important; background: #fdf2f8 !important; }
.hp-sreno-act-disclose { border-color: #d8b4fe !important; background: #faf5ff !important; }
.hp-sreno-act-skip { border-color: #fde68a !important; background: #fffbeb !important; }
.hp-sreno-over-ul,
.hp-sreno-tips-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-sreno-over-ul li,
.hp-sreno-tips-ul li { margin: .2rem 0; }
.hp-sreno-plan-label { display: block; margin: .65rem 0 .25rem; }
.hp-sreno-plan {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 9rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-sreno-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-sreno-faq {
  margin-top: 1rem;
  border-top: 1px solid var(--border);
  padding-top: .5rem;
}
.hp-sreno-faq > summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .95rem;
}
.hp-sreno-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-sreno-faq details summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-sreno-faq details p { margin: .35rem 0 .15rem; }
.hp-sreno-packs,
.hp-sreno-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .45rem;
  margin: 0 0 .55rem;
}
.hp-sreno-packs .chip,
.hp-sreno-filters .chip {
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  border-radius: 999px;
  padding: .3rem .65rem;
  font-size: .84rem;
  cursor: pointer;
}
.hp-sreno-filters .chip-sm {
  padding: .22rem .5rem;
  font-size: .78rem;
}
.hp-sreno-packs .chip:hover,
.hp-sreno-filters .chip:hover,
.hp-sreno-filters .chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, #fff);
}
.hp-sreno-dec {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  padding: .12rem .4rem;
  border-radius: 999px;
  white-space: nowrap;
  background: #f1f5f9;
  color: #64748b;
}
.hp-sreno-dec.is-do { background: #dcfce7; color: #166534; }
.hp-sreno-dec.is-fix { background: #fce7f3; color: #9d174d; }
.hp-sreno-dec.is-disclose { background: #f3e8ff; color: #6b21a8; }
.hp-sreno-dec.is-skip { background: #fef3c7; color: #92400e; }
.hp-sreno-triad {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin-bottom: .7rem;
}
.hp-sreno-triad-card {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .5rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-sreno-triad-card strong {
  font-size: 1.25rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.hp-sreno-triad-card.is-do { border-color: #86efac; background: #f0fdf4; }
.hp-sreno-triad-card.is-skip { border-color: #fde68a; background: #fffbeb; }
.hp-sreno-triad-card.is-disclose { border-color: #d8b4fe; background: #faf5ff; }
.hp-sreno-bar-wrap { margin: 0 0 .75rem; }
.hp-sreno-bar-label {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  margin-bottom: .25rem;
}
.hp-sreno-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, #fff);
  overflow: hidden;
}
.hp-sreno-bar-fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  transition: width .2s ease;
  background: #0f766e;
}
.hp-sreno-bar-fill.is-ok { background: #16a34a; }
.hp-sreno-bar-fill.is-mid { background: #d97706; }
.hp-sreno-bar-fill.is-over { background: #dc2626; }
.hp-sreno-context {
  margin: 0 0 .55rem;
  line-height: 1.4;
}
.hp-sreno-seed-hint {
  margin: 0 0 .5rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  background: #ecfeff;
  border: 1px solid #a5f3fc;
}
.hp-sreno-panel-actions { margin-top: .35rem; }
.hp-sreno-week-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-sreno-week-chips .chip {
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  border-radius: 999px;
  padding: .18rem .45rem;
  font-size: .76rem;
  cursor: pointer;
}
.hp-sreno-week-chips .chip:hover,
.hp-sreno-week-chips .chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, #fff);
}
.hp-sreno-score {
  display: inline-block;
  min-width: 2.2rem;
  font-size: .78rem;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  padding: .12rem .35rem;
  border-radius: 8px;
  background: #f1f5f9;
  color: #475569;
  text-align: center;
}
.hp-sreno-score.is-hi { background: #dcfce7; color: #166534; }
.hp-sreno-score.is-mid { background: #e0f2fe; color: #075985; }
.hp-sreno-score.is-lo { background: #ffedd5; color: #9a3412; }
.hp-sreno-score.is-disclose { background: #f3e8ff; color: #6b21a8; font-size: .7rem; }
.hp-sreno-row.is-home-hint td:nth-child(2) .hp-sreno-name::after {
  content: ' · relevant for boligtype';
  font-weight: 500;
  font-size: .72rem;
  color: #0f766e;
}
.hp-sreno-scenarios {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin: 0 0 .35rem;
}
.hp-sreno-scen {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .5rem;
  display: flex;
  flex-direction: column;
  gap: .12rem;
  background: color-mix(in srgb, var(--bg) 40%, #fff);
}
.hp-sreno-scen strong {
  font-size: 1.05rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.hp-sreno-scen-tag {
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--muted, #64748b);
}
.hp-sreno-scen.is-a { border-color: #86efac; background: #f0fdf4; }
.hp-sreno-scen.is-b { border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border)); background: color-mix(in srgb, var(--brand, #0f766e) 8%, #fff); }
.hp-sreno-scen.is-c { border-color: #fde68a; background: #fffbeb; }
.hp-sreno-scen-note { margin: 0 0 .55rem; line-height: 1.4; }
.hp-sreno-hope-box {
  border: 1px solid #a5f3fc;
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: .55rem 0 .65rem;
  background: #ecfeff;
}
.hp-sreno-hope-box.is-pos {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-sreno-hope-box.is-neg {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-sreno-hope-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
}
.hp-sreno-hope-grid > div {
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-sreno-hope-grid strong {
  font-size: 1rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.hp-sreno-hope-grid strong.is-pos,
.hp-sreno-hope-box .is-pos[data-out="hope_net"] { color: #166534; }
.hp-sreno-hope-grid strong.is-neg,
.hp-sreno-hope-box .is-neg[data-out="hope_net"] { color: #b91c1c; }
.hp-sreno-timeline {
  display: flex;
  flex-direction: column;
  gap: .35rem;
  margin: 0 0 .15rem;
}
.hp-sreno-tl-row {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr) auto;
  gap: .35rem .45rem;
  align-items: center;
  font-size: .78rem;
}
.hp-sreno-tl-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
}
.hp-sreno-tl-track {
  height: .45rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, #fff);
  overflow: hidden;
}
.hp-sreno-tl-fill {
  height: 100%;
  border-radius: 999px;
  background: #0f766e;
  min-width: 4px;
}
.hp-sreno-tl-fill.is-late { background: #d97706; }
.hp-sreno-tl-w {
  font-variant-numeric: tabular-nums;
  color: var(--muted, #64748b);
  font-weight: 650;
}
.hp-sreno-privacy {
  margin-top: .65rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .65rem;
  background: color-mix(in srgb, var(--bg) 50%, #fff);
}
.hp-sreno-privacy summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-sreno-privacy p { margin: .35rem 0 .1rem; }
.hp-sreno-mobile-jump { display: none; }
@media (max-width: 900px) {
  .hp-sreno-mobile-jump { display: inline-flex; }
  .hp-sreno-scenarios { grid-template-columns: 1fr; }
  .hp-sreno-hope-grid { grid-template-columns: 1fr; }
  .hp-sreno-tl-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .hp-sreno-tl-track { grid-column: 1 / -1; order: 3; }
}
@media (max-width: 560px) {
  .hp-sreno-panel { position: static; }
  .hp-sreno-cost { width: 6.2rem; }
  .hp-sreno-triad { grid-template-columns: 1fr; }
  .hp-sreno-table { min-width: 820px; }
}

/* —— Kjøps-notat / buy_decision (buy-beslutningsnotat) —— */
.hp-bdn-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-bdn-hero-mascot {
  border-radius: 14px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, #fff);
}
.hp-bdn-hero-copy { min-width: 0; grid-column: 2; }
.hp-bdn-lead-bullets {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-bdn-lead-bullets li { margin: .15rem 0; }
.hp-bdn-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: color-mix(in srgb, var(--bg) 55%, var(--bg-elev, #fff));
}
.hp-bdn-how summary { cursor: pointer; font-weight: 700; font-size: .92rem; }
.hp-bdn-how-list { margin: .4rem 0 0; padding-left: 1.2rem; font-size: .86rem; }
.hp-bdn-how-list li { margin: .2rem 0; }
.hp-bdn-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .5rem;
  margin-bottom: .65rem;
}
.hp-bdn-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 750;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
  border: 1px solid #fcd34d;
}
.hp-bdn-demo-note {
  margin: 0 0 .85rem;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-bdn-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 860px) {
  .hp-bdn-layout { grid-template-columns: 1fr; }
  .hp-bdn-hero { grid-template-columns: auto 1fr; }
}
.hp-bdn-section {
  margin: 1rem 0 .45rem;
  font-size: 1.02rem;
  font-weight: 750;
  letter-spacing: -0.02em;
}
.hp-bdn-main .hp-bdn-section:first-child { margin-top: 0; }
.hp-bdn-fitlist {
  list-style: none;
  margin: .4rem 0 0;
  padding: 0;
  display: grid;
  gap: .35rem;
}
.hp-bdn-fititem {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .55rem;
  background: var(--bg-elev, #fff);
  font-size: .88rem;
}
.hp-bdn-fititem.is-on {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, var(--bg-elev, #fff));
}
.hp-bdn-fititem label {
  display: flex;
  gap: .45rem;
  align-items: flex-start;
  cursor: pointer;
  margin: 0;
}
.hp-bdn-fititem input { margin-top: .2rem; accent-color: var(--brand, #0f766e); }
.hp-bdn-fitverb {
  font-weight: 700;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: color-mix(in srgb, var(--brand, #0f766e) 80%, #333);
  margin-right: .2rem;
}
.hp-bdn-decision {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .65rem .8rem;
  margin: 0;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-bdn-legend {
  font-weight: 750;
  font-size: .92rem;
  padding: 0 .25rem;
}
.hp-bdn-radio {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  margin: .4rem 0;
  cursor: pointer;
  font-size: .92rem;
}
.hp-bdn-radio input { margin-top: .25rem; accent-color: var(--brand, #0f766e); }
.hp-bdn-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: var(--bg-elev, #fff);
  box-shadow: 0 1px 0 color-mix(in srgb, #000 4%, transparent);
}
.hp-bdn-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin-bottom: .65rem;
}
.hp-bdn-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .65rem;
  display: flex;
  flex-direction: column;
  gap: .15rem;
  min-width: 0;
}
.hp-bdn-gauge strong { font-size: 1.05rem; letter-spacing: -0.02em; }
.hp-bdn-band.is-ok { color: #0f766e; }
.hp-bdn-band.is-mid { color: #b45309; }
.hp-bdn-band.is-tight { color: #b91c1c; }
.hp-bdn-subh {
  margin: .85rem 0 .35rem;
  font-size: .9rem;
  font-weight: 750;
}
.hp-bdn-budget {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .65rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
  margin-bottom: .35rem;
}
.hp-bdn-warn {
  border: 1px solid #fecaca;
  background: #fff1f2;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin: .5rem 0;
}
.hp-bdn-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-bdn-warn-ul li { margin: .15rem 0; }
.hp-bdn-summary {
  margin: 0;
  padding-left: 1.1rem;
}
.hp-bdn-summary li { margin: .2rem 0; }
.hp-bdn-note {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 12rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-bdn-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-bdn-faq { margin-top: 1rem; }
.hp-bdn-faq > summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .95rem;
}
.hp-bdn-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-bdn-faq details summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-bdn-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-bdn-panel { position: static; }
  .hp-bdn-gauges { grid-template-columns: 1fr; }
}

/* —— Visningslogg selger (sell-visnings-logg / visning_logg) —— */
.hp-svl { display: grid; gap: 1rem; }
.hp-svl-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .85rem 1rem;
  align-items: start;
  padding: .85rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
}
.hp-svl-hero-mascot {
  width: 72px; height: 72px; border-radius: 50%;
  object-fit: cover; flex-shrink: 0;
  border: 2px solid color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-svl-hero-copy { min-width: 0; grid-column: 2; }
.hp-svl-lead-bullets {
  margin: .25rem 0 0; padding-left: 1.15rem;
  font-size: .88rem; color: var(--muted);
}
.hp-svl-lead-bullets li { margin: .15rem 0; }
.hp-svl-how {
  grid-column: 1 / -1;
  margin-top: .15rem;
  border-top: 1px dashed color-mix(in srgb, var(--brand) 25%, var(--border));
  padding-top: .45rem;
}
.hp-svl-how summary { cursor: pointer; font-weight: 700; font-size: .92rem; }
.hp-svl-how-list {
  margin: .4rem 0 0; padding-left: 1.2rem;
  font-size: .88rem; color: var(--muted);
}
.hp-svl-how-list li { margin: .2rem 0; }
.hp-svl-demos {
  display: flex; flex-wrap: wrap; align-items: center; gap: .45rem;
}
.hp-svl-demo-badge {
  display: inline-block;
  font-size: .68rem; font-weight: 700; letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem; border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg-elev));
  border: 1px solid color-mix(in srgb, #f59e0b 45%, var(--border));
  color: var(--text);
}
.hp-svl-demo-note {
  margin: 0; padding: .4rem .65rem; border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-svl-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .95fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 860px) {
  .hp-svl-layout { grid-template-columns: 1fr; }
  .hp-svl-hero { grid-template-columns: auto 1fr; }
}
.hp-svl-section {
  font-size: 1rem; font-weight: 750; margin: 1rem 0 .45rem;
  letter-spacing: -0.02em;
}
.hp-svl-form-col .hp-svl-section:first-child { margin-top: 0; }
.hp-svl-dim-val {
  font-weight: 800; font-variant-numeric: tabular-nums;
  color: var(--brand); margin-left: .35rem;
}
.hp-svl-vis-chips {
  display: flex; flex-wrap: wrap; align-items: center; gap: .35rem;
  margin: .35rem 0 .15rem;
}
.hp-svl-vis-chips .chip.is-on {
  border-color: color-mix(in srgb, var(--brand) 50%, var(--border));
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-svl-int-chips {
  display: flex; flex-wrap: wrap; align-items: stretch; gap: .35rem;
  margin-top: .45rem;
}
.hp-svl-int-chip {
  min-width: 3.25rem;
  min-height: 2.5rem;
  padding: .25rem .4rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  font-weight: 750; font-variant-numeric: tabular-nums;
  cursor: pointer; color: var(--text);
  display: inline-flex; flex-direction: column;
  align-items: center; justify-content: center; gap: .05rem;
  line-height: 1.1;
}
.hp-svl-int-chip-n { font-size: 1rem; font-weight: 800; }
.hp-svl-int-chip-lab {
  font-size: .62rem; font-weight: 650; letter-spacing: .01em;
  color: var(--muted); text-transform: uppercase;
}
.hp-svl-int-chip.is-on {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 16%, var(--bg-elev));
  color: var(--brand);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand) 30%, transparent);
}
.hp-svl-int-chip.is-on .hp-svl-int-chip-lab { color: var(--brand); }
.hp-svl-theme-presets {
  display: flex; flex-wrap: wrap; gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-svl-live {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: .45rem .75rem;
  margin-top: .55rem;
  padding: .65rem .85rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
}
.hp-svl-live-num {
  font-size: 1.65rem; font-weight: 800; letter-spacing: -0.03em;
  color: var(--brand); font-variant-numeric: tabular-nums;
}
.hp-svl-band {
  display: inline-block;
  font-size: .78rem; font-weight: 700;
  padding: .15rem .5rem; border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-svl-band.is-ok {
  border-color: color-mix(in srgb, #16a34a 50%, var(--border));
  background: color-mix(in srgb, #16a34a 14%, var(--bg-elev));
}
.hp-svl-band.is-mid {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 12%, var(--bg-elev));
}
.hp-svl-band.is-tight {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 12%, var(--bg-elev));
}
.hp-svl-sig-warn {
  margin: .45rem 0 0;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #f59e0b 55%, var(--border));
  background: color-mix(in srgb, #f59e0b 12%, var(--bg-elev));
  color: var(--text);
}
.hp-svl-themes,
.hp-svl-signals {
  display: flex; flex-wrap: wrap; gap: .4rem;
}
.hp-svl-theme,
.hp-svl-signal {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .35rem .55rem; border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  font-size: .82rem; font-weight: 550; cursor: pointer;
  margin: 0;
}
.hp-svl-theme:has(input:checked) {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-svl-signal.is-warm:has(input:checked) {
  border-color: color-mix(in srgb, #2563eb 45%, var(--border));
  background: color-mix(in srgb, #2563eb 12%, var(--bg-elev));
}
.hp-svl-signal.is-cold:has(input:checked) {
  border-color: color-mix(in srgb, #64748b 50%, var(--border));
  background: color-mix(in srgb, #64748b 14%, var(--bg-elev));
}
.hp-svl-theme input,
.hp-svl-signal input { margin: 0; accent-color: var(--brand); }
.hp-svl-panel {
  padding: 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  box-shadow: var(--shadow);
  position: sticky;
  top: 0.75rem;
  max-height: calc(100vh - 1.5rem);
  overflow: auto;
}
.hp-svl-panel-head {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .5rem;
  margin-bottom: .65rem;
}
.hp-svl-temp {
  margin: 0 0 .75rem;
  padding: .65rem .75rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg));
}
.hp-svl-temp-top {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .35rem .65rem;
  margin-bottom: .4rem;
}
.hp-svl-temp-bar {
  height: .55rem; border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 12%, var(--bg));
  border: 1px solid var(--border); overflow: hidden;
}
.hp-svl-temp-fill {
  display: block; height: 100%;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, #dc2626 70%, #94a3b8),
    color-mix(in srgb, #f59e0b 70%, var(--brand)),
    color-mix(in srgb, #16a34a 75%, var(--brand))
  );
  border-radius: 999px;
  min-width: 0;
  transition: width .25s ease;
}
.hp-svl-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .85rem;
}
.hp-svl-gauge {
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 5%, var(--bg));
  display: flex; flex-direction: column; gap: .15rem;
}
.hp-svl-gauge strong {
  font-size: 1.25rem; font-weight: 800; color: var(--brand);
  font-variant-numeric: tabular-nums; letter-spacing: -0.02em;
}
.hp-svl-typesplit {
  margin: 0 0 .85rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 4%, var(--bg));
}
.hp-svl-type-rows { display: grid; gap: .3rem; }
.hp-svl-type-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  gap: .35rem .55rem;
  align-items: center;
  font-size: .84rem;
}
.hp-svl-type-lab { font-weight: 650; }
.hp-svl-type-stat {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  color: var(--muted);
  white-space: nowrap;
}
.hp-svl-week {
  margin: 0 0 .85rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, #6366f1 35%, var(--border));
  background: color-mix(in srgb, #6366f1 7%, var(--bg));
}
.hp-svl-week-grid {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: .5rem .65rem;
  align-items: start;
}
@media (max-width: 560px) {
  .hp-svl-week-grid { grid-template-columns: 1fr 1fr; }
  .hp-svl-week-delta { grid-column: 1 / -1; }
}
.hp-svl-week-col {
  display: flex; flex-direction: column; gap: .15rem;
  min-width: 0;
}
.hp-svl-week-col strong {
  font-size: .95rem; font-weight: 750;
  font-variant-numeric: tabular-nums;
  color: var(--brand);
}
.hp-svl-week-delta {
  display: flex; flex-direction: column; gap: .15rem;
  align-items: flex-end; text-align: right;
}
.hp-svl-week-delta strong {
  font-size: 1.15rem; font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.hp-svl-week-delta strong.is-up { color: #16a34a; }
.hp-svl-week-delta strong.is-down { color: #dc2626; }
.hp-svl-week-delta strong.is-flat { color: var(--muted); }
.hp-svl-slots {
  margin: 0 0 .85rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 4%, var(--bg));
}
.hp-svl-slot-rows { display: grid; gap: .3rem; }
.hp-svl-slot-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  gap: .35rem .55rem;
  align-items: center;
  font-size: .84rem;
}
.hp-svl-slot-lab { font-weight: 650; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hp-svl-warmleads {
  margin: 0 0 .85rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, #2563eb 40%, var(--border));
  background: color-mix(in srgb, #2563eb 8%, var(--bg));
}
.hp-svl-warm-list {
  margin: 0; padding: 0; list-style: none;
  display: grid; gap: .4rem;
}
.hp-svl-warm-item {
  display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .45rem;
  font-size: .84rem;
}
.hp-svl-warm-date { font-weight: 700; font-variant-numeric: tabular-nums; }
.hp-svl-warm-int {
  font-weight: 800; color: var(--brand);
  font-variant-numeric: tabular-nums;
}
.hp-svl-prep {
  margin: 0 0 .85rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, #d97706 40%, var(--border));
  background: color-mix(in srgb, #d97706 8%, var(--bg));
}
.hp-svl-prep-list {
  margin: 0; padding-left: 1.1rem;
  font-size: .84rem; color: var(--muted);
}
.hp-svl-prep-list li { margin: .3rem 0; }
.hp-svl-fu-head {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .35rem .5rem;
  margin: 0 0 .35rem;
}
.hp-svl-sorts {
  display: flex; flex-wrap: wrap; align-items: center; gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-svl-trend {
  margin: 0 0 .85rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 4%, var(--bg));
}
.hp-svl-spark-vis {
  display: block;
  border-radius: 50%;
  background: color-mix(in srgb, #2563eb 55%, var(--brand));
  opacity: .85;
  flex-shrink: 0;
  min-width: 4px; min-height: 4px;
}
.hp-svl-talk {
  margin: 0 0 .85rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, #0d9488 40%, var(--border));
  background: color-mix(in srgb, #0d9488 8%, var(--bg));
}
.hp-svl-talk-list {
  margin: 0; padding-left: 1.1rem;
  font-size: .84rem; color: var(--muted);
}
.hp-svl-talk-list li { margin: .3rem 0; }
.hp-svl-seeds {
  margin: 0 0 .85rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg));
}
.hp-svl-seed-links {
  display: grid; gap: .4rem;
}
.hp-svl-seed {
  display: flex; flex-direction: column; gap: .1rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  text-decoration: none; color: inherit;
}
.hp-svl-seed:hover {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
}
.hp-svl-theme-filters {
  display: flex; flex-wrap: wrap; align-items: center; gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-svl-spark {
  display: flex; align-items: flex-end; gap: .35rem;
  min-height: 4.25rem;
  padding: .25rem 0;
}
.hp-svl-spark-col {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column;
  align-items: center; justify-content: flex-end;
  gap: .2rem; height: 4rem;
}
.hp-svl-spark-bar {
  width: 100%; max-width: 1.75rem;
  border-radius: 6px 6px 2px 2px;
  background: color-mix(in srgb, var(--brand) 55%, #94a3b8);
  min-height: 4px;
}
.hp-svl-spark-bar.is-ok {
  background: color-mix(in srgb, #16a34a 70%, var(--brand));
}
.hp-svl-spark-bar.is-mid {
  background: color-mix(in srgb, #f59e0b 65%, var(--brand));
}
.hp-svl-spark-bar.is-tight {
  background: color-mix(in srgb, #dc2626 60%, #94a3b8);
}
.hp-svl-spark-n {
  font-size: .7rem; font-weight: 700;
  font-variant-numeric: tabular-nums; color: var(--muted);
}
.hp-svl-patterns { margin-bottom: .75rem; }
.hp-svl-theme-bars,
.hp-svl-sig-bars { display: grid; gap: .35rem; }
.hp-svl-bar-row {
  display: grid;
  grid-template-columns: minmax(0, 5.5rem) 1fr auto;
  gap: .4rem; align-items: center;
  font-size: .82rem;
}
.hp-svl-bar-lab { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hp-svl-bar-track {
  height: .55rem; border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg));
  border: 1px solid var(--border); overflow: hidden;
}
.hp-svl-bar-fill {
  display: block; height: 100%;
  background: color-mix(in srgb, var(--brand) 70%, #22c55e);
  border-radius: 999px; min-width: 2px;
}
.hp-svl-bar-n { font-weight: 700; font-variant-numeric: tabular-nums; min-width: 1.25rem; text-align: right; }
.hp-svl-followups {
  margin: 0 0 .85rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, #2563eb 35%, var(--border));
  background: color-mix(in srgb, #2563eb 7%, var(--bg));
}
.hp-svl-fu-list {
  margin: 0; padding: 0; list-style: none;
  display: grid; gap: .4rem;
}
.hp-svl-fu-item {
  display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .5rem;
  font-size: .84rem;
}
.hp-svl-fu-date { font-weight: 700; font-variant-numeric: tabular-nums; }
.hp-svl-fu-text { flex: 1; min-width: 8rem; color: var(--muted); }
.hp-svl-hints {
  margin: .5rem 0 .85rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg));
}
.hp-svl-hint-list {
  margin: 0; padding-left: 1.1rem;
  font-size: .84rem; color: var(--muted);
}
.hp-svl-hint-list li { margin: .25rem 0; }
.hp-svl-filters {
  display: flex; flex-wrap: wrap; gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-svl-list { display: grid; gap: .65rem; margin-bottom: .85rem; }
.hp-svl-card {
  padding: .75rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 4%, var(--bg));
}
.hp-svl-card.is-warm {
  border-color: color-mix(in srgb, #2563eb 40%, var(--border));
  background: color-mix(in srgb, #2563eb 6%, var(--bg));
}
.hp-svl-card.has-fu {
  box-shadow: inset 3px 0 0 color-mix(in srgb, #f59e0b 70%, transparent);
}
.hp-svl-card-top {
  display: flex; justify-content: space-between; gap: .65rem;
  align-items: flex-start;
}
.hp-svl-card-score {
  display: flex; flex-direction: column; align-items: flex-end;
  flex-shrink: 0; gap: .15rem;
}
.hp-svl-card-avg {
  font-size: 1.35rem; font-weight: 800; color: var(--brand);
  font-variant-numeric: tabular-nums; letter-spacing: -0.02em;
  line-height: 1.1;
}
.hp-svl-card-tags {
  display: flex; flex-wrap: wrap; gap: .25rem;
  margin: .4rem 0 .15rem;
}
.hp-svl-tag {
  font-size: .72rem; font-weight: 650;
  padding: .12rem .4rem; border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-svl-warm-badge {
  display: inline-block;
  font-size: .68rem; font-weight: 700;
  padding: .08rem .35rem; border-radius: 999px;
  border: 1px solid color-mix(in srgb, #2563eb 45%, var(--border));
  background: color-mix(in srgb, #2563eb 14%, var(--bg-elev));
  color: var(--text);
  vertical-align: middle;
}
.hp-svl-done-badge {
  display: inline-block;
  font-size: .68rem; font-weight: 700;
  padding: .08rem .35rem; border-radius: 999px;
  border: 1px solid color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 12%, var(--bg-elev));
}
.hp-svl-card-notes { margin: .3rem 0 0; }
.hp-svl-card-next { margin: .25rem 0 0; }
.hp-svl-card-next.is-done { opacity: .75; text-decoration: line-through; text-decoration-thickness: 1px; }
.hp-svl-card-actions { margin-top: .45rem; gap: .35rem; flex-wrap: wrap; }
.hp-svl-commit-text {
  width: 100%; font-family: inherit; font-size: .85rem;
  resize: vertical; min-height: 6rem;
}
.hp-svl-nonadvice {
  margin: .65rem 0 0;
  font-size: .78rem;
  opacity: .9;
}
.hp-svl-faq details { margin: .35rem 0; }
.hp-svl-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-svl-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-svl-panel { position: static; max-height: none; }
  .hp-svl-gauges { grid-template-columns: 1fr 1fr; }
  .hp-svl-bar-row { grid-template-columns: minmax(0, 4.5rem) 1fr auto; }
  .hp-svl-int-chip { min-width: 2.75rem; min-height: 2.6rem; }
  .hp-svl-type-row,
  .hp-svl-slot-row {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .2rem .4rem;
  }
  .hp-svl-type-stat { font-size: .78rem; }
  .hp-svl-warm-item { font-size: .8rem; }
}

/* —— Omkostningskalkyle (buy-omkostninger) —— */
.hp-omk { position: relative; }
.hp-omk-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-omk-hero-copy { min-width: 0; grid-column: 1; }
.hp-omk-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  justify-self: end;
}
.hp-omk-how { grid-column: 1 / -1; }
.hp-omk-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-omk-lead-bullets li { margin: .15rem 0; }
.hp-omk-how {
  margin-top: .55rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem;
  background: color-mix(in srgb, var(--brand) 4%, var(--bg-elev, #fff));
}
.hp-omk-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-omk-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-omk-how-list li { margin: .2rem 0; }
@media (max-width: 820px) {
  .hp-omk-hero {
    grid-template-columns: auto 1fr;
  }
  .hp-omk-hero-mascot { width: 56px; height: 56px; }
  .hp-omk-how { order: 3; }
  .hp-omk-hero-copy { order: 1; }
}
.hp-omk-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 750;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
  border: 1px solid #fcd34d;
}
.hp-omk-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .5rem;
  margin-bottom: .65rem;
}
.hp-omk-demos .chip {
  font-size: .82rem;
  font-weight: 650;
}
.hp-omk-demos .chip:hover,
.hp-omk-demos .chip.active,
.hp-omk-demos .chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-omk-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-omk-demo-note {
  margin: 0 0 .85rem;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-omk [data-omk-seed-hint]:not([hidden]) {
  margin: 0 0 .75rem;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev, #fff));
  border: 1px solid color-mix(in srgb, var(--brand) 25%, var(--border));
}
.hp-omk-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 860px) {
  .hp-omk-layout { grid-template-columns: 1fr; }
  .hp-omk-panel { order: -1; }
}
.hp-omk-section {
  margin: 1rem 0 .45rem;
  font-size: 1.02rem;
  font-weight: 750;
  letter-spacing: -0.02em;
}
.hp-omk-main .hp-omk-section:first-child { margin-top: 0; }
.hp-omk-lines {
  list-style: none;
  margin: 0 0 .5rem;
  padding: 0;
  display: grid;
  gap: .4rem;
}
.hp-omk-line {
  display: grid;
  grid-template-columns: 1fr minmax(7rem, 9rem);
  gap: .45rem .65rem;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .65rem;
  background: var(--bg-elev, #fff);
  transition: opacity .15s, border-color .15s, background .15s;
}
.hp-omk-line.is-off {
  opacity: .62;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-omk-line-on {
  display: flex;
  gap: .45rem;
  align-items: flex-start;
  cursor: pointer;
  min-width: 0;
  font-size: .9rem;
  font-weight: 600;
}
.hp-omk-line-on input {
  margin-top: .2rem;
  accent-color: var(--brand, #0f766e);
  flex-shrink: 0;
}
.hp-omk-line-on .field-label-row {
  display: flex;
  flex-wrap: wrap;
  gap: .2rem .35rem;
  align-items: center;
}
.hp-omk-line-amt {
  width: 100%;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
@media (max-width: 520px) {
  .hp-omk-line {
    grid-template-columns: 1fr;
  }
  .hp-omk-line-amt { text-align: left; max-width: 12rem; }
}
.hp-omk-seed-help {
  margin: .45rem 0 0;
  max-width: 40rem;
}
.hp-omk-panel {
  position: sticky;
  top: 4.5rem;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 1rem;
  background: var(--bg-elev, #fff);
  box-shadow: var(--shadow, 0 4px 16px rgba(0, 0, 0, .04));
}
.hp-omk-empty {
  padding: .35rem 0;
}
.hp-omk-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .75rem;
}
.hp-omk-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
  min-width: 0;
}
.hp-omk-gauge strong {
  font-size: 1.2rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  word-break: break-word;
}
.hp-omk-gauge-tot {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-omk-gauge-cash {
  grid-column: 1 / -1;
  border-color: color-mix(in srgb, #0f766e 35%, var(--border));
  background: #f0fdfa;
}
.hp-omk-stack { margin: .35rem 0 .75rem; }
.hp-omk-stack-bar {
  display: flex;
  width: 100%;
  height: .85rem;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--border) 60%, transparent);
}
.hp-omk-seg {
  display: block;
  min-width: 0;
  height: 100%;
  transition: width .2s ease;
}
@media (prefers-reduced-motion: reduce) {
  .hp-omk-seg { transition: none; }
}
.hp-omk-seg-price { background: var(--brand, #0f766e); }
.hp-omk-seg-doc { background: color-mix(in srgb, var(--brand) 55%, #f59e0b); }
.hp-omk-seg-fixed { background: #7fd4ce; }
.hp-omk-legend {
  list-style: none;
  margin: .4rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .75rem;
  font-size: .78rem;
}
.hp-omk-legend li {
  display: flex;
  align-items: center;
  gap: .3rem;
}
.hp-omk-dot {
  width: .65rem;
  height: .65rem;
  border-radius: 3px;
  display: inline-block;
}
.hp-omk-dot.hp-omk-seg-price { background: var(--brand, #0f766e); }
.hp-omk-dot.hp-omk-seg-doc { background: color-mix(in srgb, var(--brand) 55%, #f59e0b); }
.hp-omk-dot.hp-omk-seg-fixed { background: #7fd4ce; }
.hp-omk-subh {
  margin: .85rem 0 .35rem;
  font-size: .9rem;
  font-weight: 750;
}
.hp-omk-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .88rem;
  margin-bottom: .35rem;
}
.hp-omk-table th {
  text-align: left;
  font-weight: 600;
  padding: .28rem .2rem .28rem 0;
  border-bottom: 1px solid var(--border);
  color: var(--muted, #64748b);
}
.hp-omk-table td {
  text-align: right;
  padding: .28rem 0;
  border-bottom: 1px solid var(--border);
  font-variant-numeric: tabular-nums;
  font-weight: 650;
}
.hp-omk-tr-strong th,
.hp-omk-tr-strong td {
  font-weight: 800;
  border-bottom-width: 2px;
  color: inherit;
}
.hp-omk-breakdown {
  margin: .25rem 0 .5rem;
  padding-left: 1.1rem;
}
.hp-omk-breakdown li { margin: .12rem 0; }
.hp-omk-rev,
.hp-omk-eqbox {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  margin: .55rem 0;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-omk-tips-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-omk-tips-ul li { margin: .2rem 0; }
.hp-omk-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-omk-faq {
  margin-top: 1rem;
  border-top: 1px solid var(--border);
  padding-top: .35rem;
}
.hp-omk-faq > summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .95rem;
  padding: .35rem 0;
}
.hp-omk-faq details {
  border-bottom: 1px solid var(--border);
  padding: .4rem 0;
}
.hp-omk-faq details summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-omk-faq details p { margin: .35rem 0 .15rem; }
.hp-omk-mobile-bar {
  display: none;
}
@media (max-width: 860px) {
  .hp-omk { padding-bottom: 4.25rem; }
  .hp-omk-mobile-bar {
    display: flex;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    gap: .5rem;
    justify-content: center;
    padding: .55rem .75rem calc(.55rem + env(safe-area-inset-bottom, 0));
    background: color-mix(in srgb, var(--bg-elev, #fff) 92%, transparent);
    border-top: 1px solid var(--border);
    backdrop-filter: blur(8px);
  }
  .hp-omk-panel { position: static; }
  .hp-omk-gauges { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .hp-omk-gauges { grid-template-columns: 1fr; }
  .hp-omk-gauge-cash { grid-column: auto; }
}
.hp-omk-seed-applied {
  margin: 0 0 .75rem;
  padding: .4rem .65rem;
  border-radius: 8px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
}


/* —— Annonse-atelier (sell-annonse-atelier / ad_atelier) —— */
.hp-ad { margin: 0 0 .5rem; }
.hp-ad-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-ad-hero-mascot {
  border-radius: 14px;
  background: color-mix(in srgb, var(--accent, #0d9488) 12%, transparent);
}
.hp-ad-hero-copy { min-width: 0; grid-column: 2; }
.hp-ad-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
  color: var(--muted, #64748b);
}
.hp-ad-lead-bullets li { margin: .15rem 0; }
.hp-ad-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 80%, var(--bg));
}
.hp-ad-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-ad-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
  color: var(--muted, #64748b);
}
.hp-ad-how-list li { margin: .2rem 0; }
.hp-ad-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  margin: 0 0 .55rem;
}
.hp-ad-demo-badge {
  display: inline-block;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 22%, transparent);
  color: #92400e;
  vertical-align: middle;
}
.hp-ad-demo-note {
  margin: 0 0 .75rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: color-mix(in srgb, #f59e0b 12%, transparent);
}
.hp-ad-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .95fr);
  gap: 1rem 1.25rem;
  align-items: start;
}
@media (max-width: 860px) {
  .hp-ad-layout { grid-template-columns: 1fr; }
  .hp-ad-hero { grid-template-columns: auto 1fr; }
}
.hp-ad-section {
  font-size: 1rem;
  font-weight: 750;
  margin: 1rem 0 .45rem;
}
.hp-ad-main .hp-ad-section:first-child { margin-top: 0; }
.hp-ad-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--bg));
  box-shadow: 0 1px 0 color-mix(in srgb, var(--fg, #0f172a) 4%, transparent);
}
.hp-ad-empty {
  padding: .35rem 0;
}
.hp-ad-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin: 0 0 .65rem;
}
.hp-ad-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .55rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-ad-gauge strong {
  font-size: 1.15rem;
  font-weight: 750;
  letter-spacing: -0.01em;
}
.hp-ad-scorebar {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  overflow: hidden;
  margin: 0 0 .75rem;
}
.hp-ad-scorebar-fill {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0d9488, #14b8a6);
  transition: width .25s ease;
}
.hp-ad-subh {
  font-size: .88rem;
  font-weight: 700;
  margin: .65rem 0 .3rem;
}
.hp-ad-title-out {
  width: 100%;
  font-weight: 650;
  font-size: .95rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .45rem .55rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-ad-body-out {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.45;
  resize: vertical;
  min-height: 12rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-ad-checks {
  margin: 0;
  padding-left: 0;
  list-style: none;
  font-size: .84rem;
}
.hp-ad-checks li {
  margin: .28rem 0;
  padding: .2rem .35rem;
  border-radius: 8px;
}
.hp-ad-checks li.is-ok {
  background: color-mix(in srgb, #10b981 12%, transparent);
  color: color-mix(in srgb, #065f46 70%, var(--fg, #0f172a));
}
.hp-ad-checks li.is-miss {
  background: color-mix(in srgb, #f59e0b 10%, transparent);
  color: color-mix(in srgb, #92400e 65%, var(--fg, #0f172a));
}
.hp-ad-tips-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  color: var(--muted, #64748b);
}
.hp-ad-tips-ul li { margin: .2rem 0; }
.hp-ad-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-ad-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-ad-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-ad-faq details p { margin: .35rem 0 .15rem; }
.hp-ad-demos .chip.is-on,
.hp-ad-demos .chip[aria-pressed="true"] {
  background: color-mix(in srgb, var(--accent, #0d9488) 18%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--accent, #0d9488) 45%, var(--border));
  font-weight: 650;
}
@media (max-width: 560px) {
  .hp-ad-panel { position: static; }
  .hp-ad-gauges { grid-template-columns: 1fr; }
  .hp-ad-hero { grid-template-columns: auto 1fr; }
}


/* —— Sameie-sjekk (sameie) —— */
.hp-sm-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-sm-hero-mascot {
  border-radius: 14px;
  object-fit: cover;
}
.hp-sm-hero-copy { min-width: 0; grid-column: 2; }
.hp-sm-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.1rem;
  font-size: .88rem;
  color: var(--muted, #5b6470);
}
.hp-sm-lead-bullets li { margin: .15rem 0; }
.hp-sm-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-sm-how summary {
  cursor: pointer; font-weight: 650; font-size: .92rem;
}
.hp-sm-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-sm-how-list li { margin: .2rem 0; }
.hp-sm-demos {
  display: flex; flex-wrap: wrap; gap: .4rem; align-items: center;
  margin: 0 0 .85rem;
}
.hp-sm-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: #fef3c7;
  color: #92400e;
}
.hp-sm-demo-note {
  margin: -.35rem 0 .85rem;
  padding: .45rem .65rem;
  border-radius: 10px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-sm-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .9fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 860px) {
  .hp-sm-layout { grid-template-columns: 1fr; }
  .hp-sm-hero { grid-template-columns: auto 1fr; }
}
.hp-sm-section {
  font-size: 1.05rem;
  margin: 1rem 0 .55rem;
}
.hp-sm-main .hp-sm-section:first-child { margin-top: 0; }
.hp-sm-group { margin: 0 0 1rem; }
.hp-sm-group-title {
  font-size: .98rem;
  margin: 0 0 .25rem;
  display: flex;
  align-items: center;
  gap: .45rem;
  flex-wrap: wrap;
}
.hp-sm-group-pct {
  font-size: .78rem;
  font-weight: 700;
  padding: .08rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--primary, #0f766e) 12%, transparent);
  color: var(--primary, #0f766e);
}
.hp-sm-group-help { margin: 0 0 .5rem; }
.hp-sm-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-sm-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: var(--card, #fff);
  transition: border-color .15s, background .15s;
}
.hp-sm-row.is-critical {
  border-left: 3px solid #d97706;
}
.hp-sm-row.is-gap {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-sm-row.is-ok {
  border-color: color-mix(in srgb, #059669 35%, var(--border));
  background: color-mix(in srgb, #059669 6%, var(--card, #fff));
}
.hp-sm-row.is-flag {
  border-color: #f59e0b;
  background: #fffbeb;
}
.hp-sm-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-sm-label { flex: 1 1 12rem; min-width: 0; font-size: .92rem; }
.hp-sm-crit-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .32rem;
  border-radius: 6px;
  background: #ffedd5;
  color: #9a3412;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-sm-status-wrap { flex: 0 0 auto; }
.hp-sm-status {
  min-height: 40px;
  font-size: .88rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .3rem .45rem;
  background: var(--bg, #fff);
}
.hp-sm-note {
  width: 100%;
  margin-top: .4rem;
  min-height: 40px;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .4rem .55rem;
  font-size: .88rem;
}
.hp-sm-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: .85rem .9rem 1rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--primary, #0f766e) 8%);
  box-shadow: 0 1px 0 rgba(0,0,0,.03);
}
.hp-sm-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin: 0 0 .85rem;
}
.hp-sm-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .55rem;
  background: var(--card, #fff);
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-sm-gauge strong {
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
}
.hp-sm-stack { margin: 0 0 .85rem; }
.hp-sm-stack[aria-hidden="true"] { display: none; }
.hp-sm-stack-bar {
  display: flex;
  height: 12px;
  border-radius: 999px;
  overflow: hidden;
  background: var(--border);
}
.hp-sm-seg { display: block; height: 100%; min-width: 0; transition: width .2s ease; }
.hp-sm-seg-ask { background: var(--primary, #0f766e); }
.hp-sm-seg-debt { background: #f59e0b; }
.hp-sm-legend {
  list-style: none;
  margin: .35rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .55rem 1rem;
  font-size: .8rem;
  color: var(--muted, #5b6470);
}
.hp-sm-dot {
  display: inline-block;
  width: .65rem;
  height: .65rem;
  border-radius: 3px;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-sm-readiness {
  border-radius: 12px;
  padding: .65rem .7rem;
  margin: 0 0 .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-sm-readiness.is-ok {
  border-color: color-mix(in srgb, #059669 40%, var(--border));
  background: color-mix(in srgb, #059669 8%, var(--card, #fff));
}
.hp-sm-readiness.is-mid {
  border-color: color-mix(in srgb, #d97706 40%, var(--border));
  background: color-mix(in srgb, #d97706 8%, var(--card, #fff));
}
.hp-sm-readiness.is-tight {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 7%, var(--card, #fff));
}
.hp-sm-ready-title {
  margin: 0 0 .2rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-sm-flags-box {
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: 0 0 .75rem;
  border: 1px solid #fca5a5;
  background: #fff7f7;
}
.hp-sm-flags-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .85rem;
}
.hp-sm-flags-ul li { margin: .2rem 0; }
.hp-sm-commit-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  border-radius: 12px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
  resize: vertical;
  min-height: 8rem;
}
.hp-sm-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-sm-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-sm-faq summary {
  cursor: pointer; font-weight: 650; font-size: .92rem;
}
.hp-sm-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-sm-panel { position: static; }
  .hp-sm-gauges { grid-template-columns: 1fr; }
}

/* —— Salgstidslinje (sell_timeline) —— */
.hp-st { display: grid; gap: 1rem; }
.hp-st-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
}
.hp-st-hero-mascot {
  border-radius: 14px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
.hp-st-hero-copy { min-width: 0; grid-column: 2; }
.hp-st-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-st-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .75rem;
  background: var(--bg-elev);
}
.hp-st-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-st-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-st-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
}
.hp-st-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #e0e7ff;
  color: #3730a3;
  vertical-align: middle;
}
.hp-st-demo-note {
  margin: .15rem 0 0;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
}
.hp-st-layout {
  display: grid;
  grid-template-columns: 1fr minmax(240px, 320px);
  gap: 1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-st-layout { grid-template-columns: 1fr; }
  .hp-st-panel { position: static; }
}
.hp-st-section {
  font-size: 1.02rem;
  margin: 1rem 0 .55rem;
  font-weight: 700;
}
.hp-st-section:first-child { margin-top: 0; }
.hp-st-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: .35rem 0 .75rem;
}
.hp-st-tab {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}
.hp-st-tab.is-on,
.hp-st-tab[aria-selected="true"] {
  background: color-mix(in srgb, var(--brand) 18%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  font-weight: 700;
}
.hp-st-tab-pct {
  font-size: .72rem;
  font-variant-numeric: tabular-nums;
  opacity: .8;
  font-weight: 700;
}
.hp-st-phase-head {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1rem;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: .55rem;
}
.hp-st-phase-help { margin: 0; flex: 1 1 12rem; }
.hp-st-phase-date-lab {
  display: grid;
  gap: .2rem;
  font-size: .86rem;
}
.hp-st-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-st-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: var(--card, #fff);
  transition: border-color .15s, background .15s;
}
.hp-st-row.is-critical { border-left: 3px solid #d97706; }
.hp-st-row.is-gap {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-st-row.is-ok {
  border-color: #86efac;
  background: #f7fdf9;
}
.hp-st-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
}
.hp-st-on {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  flex: 1 1 12rem;
  min-width: 0;
  cursor: pointer;
}
.hp-st-on input { margin-top: .2rem; flex: 0 0 auto; }
.hp-st-label {
  font-size: .92rem;
  font-weight: 600;
  line-height: 1.35;
  min-width: 0;
}
.hp-st-crit-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #ffedd5;
  color: #9a3412;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-st-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
  min-height: 36px;
}
.hp-st-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .95rem;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-st-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin-bottom: .75rem;
}
.hp-st-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  background: var(--card, #fff);
  display: grid;
  gap: .15rem;
}
.hp-st-gauge strong {
  font-size: 1.25rem;
  font-variant-numeric: tabular-nums;
}
.hp-st-bars { display: grid; gap: .4rem; margin-bottom: .85rem; }
.hp-st-bar-row {
  display: grid;
  grid-template-columns: 7.5rem 1fr;
  gap: .45rem;
  align-items: center;
}
.hp-st-bar {
  height: 8px;
  border-radius: 99px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-st-bar-fill {
  display: block;
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--brand), color-mix(in srgb, var(--brand) 55%, #3aa6a0));
  border-radius: 99px;
  transition: width .2s ease;
}
.hp-st-next {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
  background: color-mix(in srgb, var(--brand) 6%, var(--card, #fff));
}
.hp-st-next-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-st-warn {
  border: 1px solid #fca5a5;
  background: #fff7f7;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-st-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-st-schedule { margin-bottom: .75rem; }
.hp-st-schedule-ol {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  line-height: 1.45;
}
.hp-st-commit-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  min-height: 10rem;
}
.hp-st-nonadvice {
  margin-top: .65rem;
  font-size: .78rem !important;
}
.hp-st-faq details {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .7rem;
  margin: .4rem 0;
  background: var(--bg-elev);
}
.hp-st-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-st-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-st-hero {
    grid-template-columns: 1fr;
  }
  .hp-st-hero-mascot { width: 56px; height: 56px; }
  .hp-st-hero-copy { grid-column: 1; }
  .hp-st-gauges { grid-template-columns: 1fr; }
  .hp-st-bar-row { grid-template-columns: 1fr; gap: .2rem; }
}
@media (min-width: 901px) {
  .hp-st-hero {
    grid-template-columns: 72px 1fr;
  }
}

/* —— Prisantydning-ramme (price_frame / sell-prisantydning) —— */
.hp-pf-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-pf-hero-mascot {
  border-radius: 14px;
  object-fit: cover;
}
.hp-pf-hero-copy { min-width: 0; grid-column: 2; }
.hp-pf-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.1rem;
  font-size: .88rem;
  color: var(--muted, #5b6470);
}
.hp-pf-lead-bullets li { margin: .15rem 0; }
.hp-pf-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-pf-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-pf-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-pf-how-list li { margin: .2rem 0; }
.hp-pf-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .85rem;
}
.hp-pf-demos .chip {
  min-height: 44px;
  padding: .45rem .75rem;
}
.hp-pf-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: #fef3c7;
  color: #92400e;
}
.hp-pf-demo-note {
  margin: -.35rem 0 .85rem;
  padding: .45rem .65rem;
  border-radius: 10px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-pf-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .9fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 860px) {
  .hp-pf-layout { grid-template-columns: 1fr; }
}
.hp-pf-section {
  font-size: 1.05rem;
  margin: 1rem 0 .55rem;
}
.hp-pf-main .hp-pf-section:first-child { margin-top: 0; }
.hp-pf-comps {
  display: grid;
  gap: .65rem;
  margin-bottom: .35rem;
}
.hp-pf-comp {
  display: grid;
  grid-template-columns: 1.4fr 1fr .7fr;
  gap: .45rem;
  padding: .55rem .65rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--card, #fff);
}
@media (max-width: 640px) {
  .hp-pf-comp { grid-template-columns: 1fr; }
}
.hp-pf-adj {
  display: grid;
  gap: .45rem;
  margin-bottom: .35rem;
}
.hp-pf-adj-row {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) 1fr 2rem;
  gap: .45rem;
  align-items: center;
}
.hp-pf-adj-lab { min-width: 0; }
.hp-pf-adj-val {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  text-align: center;
}
.hp-pf-adj-row input[type="range"] {
  width: 100%;
  min-height: 44px;
  touch-action: pan-y;
}
.hp-pf-lock-lab {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 44px;
  font-size: .92rem;
  cursor: pointer;
}
.hp-pf-actions .btn,
.hp-pf-actions a.btn {
  min-height: 44px;
}
.hp-pf-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .95rem;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-pf-gauges {
  display: grid;
  grid-template-columns: 1fr 1.15fr 1fr;
  gap: .45rem;
  margin-bottom: .75rem;
}
.hp-pf-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .55rem;
  background: var(--card, #fff);
  display: grid;
  gap: .12rem;
}
.hp-pf-gauge strong {
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}
.hp-pf-gauge-mid {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, var(--card, #fff));
}
.hp-pf-range {
  margin: 0 0 .85rem;
}
.hp-pf-range-track {
  position: relative;
  height: 10px;
  border-radius: 99px;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, #94a3b8 35%, var(--border)),
    color-mix(in srgb, var(--brand, #0f766e) 55%, #86efac),
    color-mix(in srgb, #f59e0b 50%, #fde68a)
  );
  margin: .35rem 0 .25rem;
}
.hp-pf-range-fill {
  display: none;
}
.hp-pf-range-ask,
.hp-pf-range-floor {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px rgba(0,0,0,.15);
}
.hp-pf-range-ask {
  background: var(--brand, #0f766e);
  width: 14px;
  height: 14px;
  z-index: 2;
}
.hp-pf-range-floor {
  background: #b45309;
  z-index: 1;
}
.hp-pf-range-labs {
  display: flex;
  justify-content: space-between;
  font-size: .78rem;
  color: var(--muted, #5b6470);
}
.hp-pf-askbox {
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  border-radius: 12px;
  padding: .65rem .75rem;
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, var(--card, #fff));
  display: grid;
  gap: .15rem;
  margin-bottom: .65rem;
}
.hp-pf-ask-val {
  font-size: 1.35rem;
  font-variant-numeric: tabular-nums;
}
.hp-pf-floorbox {
  border: 1px solid #fde68a;
  border-radius: 12px;
  padding: .55rem .7rem;
  background: #fffbeb;
  margin-bottom: .65rem;
  display: grid;
  gap: .1rem;
}
.hp-pf-subh {
  font-size: .95rem;
  margin: .75rem 0 .35rem;
}
.hp-pf-args {
  margin: 0 0 .5rem;
  padding-left: 1.1rem;
}
.hp-pf-args li { margin: .2rem 0; }
.hp-pf-tips-ul {
  margin: 0 0 .65rem;
  padding-left: 1.1rem;
  font-size: .86rem;
  color: var(--muted, #5b6470);
}
.hp-pf-tips-ul li { margin: .2rem 0; }
.hp-pf-summary {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  min-height: 8rem;
  margin: .35rem 0 .5rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  resize: vertical;
}
.hp-pf-nonadvice {
  margin: .5rem 0 0;
  font-size: .78rem;
}
.hp-pf-faq {
  margin-top: 1rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-pf-faq > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-pf-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-pf-faq details summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-pf-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-pf-panel { position: static; }
  .hp-pf-gauges { grid-template-columns: 1fr; }
  .hp-pf-adj-row {
    grid-template-columns: 1fr;
    gap: .2rem;
  }
  .hp-pf-adj-val { text-align: left; }
}

/* —— Leiepris-ramme (rent_price · rent_out-leiepris-ramme) —— */
.hp-lpr { margin-top: .25rem; }
.hp-lpr-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-lpr-hero-mascot {
  border-radius: 14px;
  object-fit: cover;
}
.hp-lpr-hero-copy { min-width: 0; grid-column: 2; }
.hp-lpr-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.1rem;
  font-size: .88rem;
  color: var(--muted, #5b6470);
}
.hp-lpr-lead-bullets li { margin: .15rem 0; }
.hp-lpr-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: var(--surface-2, rgba(0,0,0,.02));
  margin-top: .55rem;
}
.hp-lpr-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-lpr-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-lpr-how-list li { margin: .2rem 0; }
.hp-lpr-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .85rem;
}
.hp-lpr-demos .chip {
  min-height: 44px;
  padding: .45rem .75rem;
}
.hp-lpr-demos .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand, #0f766e) 55%, transparent);
}
.hp-lpr-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: #fef3c7;
  color: #92400e;
}
.hp-lpr-demo-note {
  margin: -.35rem 0 .85rem;
  padding: .45rem .65rem;
  border-radius: 10px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-lpr-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .9fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 860px) {
  .hp-lpr-layout { grid-template-columns: 1fr; }
}
.hp-lpr-section {
  font-size: 1.05rem;
  margin: 1rem 0 .55rem;
}
.hp-lpr-main .hp-lpr-section:first-child { margin-top: 0; }
.hp-lpr-comps {
  display: grid;
  gap: .65rem;
  margin-bottom: .35rem;
}
.hp-lpr-comp {
  display: grid;
  grid-template-columns: 1.4fr 1fr .7fr;
  gap: .45rem;
  padding: .55rem .65rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--card, #fff);
}
.hp-lpr-comp-psm {
  display: block;
  margin-top: .2rem;
  font-variant-numeric: tabular-nums;
  font-size: .78rem;
}
.hp-lpr-quick {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  justify-content: flex-end;
}
.hp-lpr-quick-row {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
}
.hp-lpr-quick-row .chip {
  min-height: 36px;
  padding: .3rem .55rem;
  font-size: .82rem;
}
.hp-lpr-quick-row .chip.is-active,
.hp-lpr-quick-row .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand, #0f766e) 55%, transparent);
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, var(--card, #fff));
}
.hp-lpr-range-track {
  cursor: pointer;
}
.hp-lpr-range-track:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--brand, #0f766e) 50%, transparent);
  outline-offset: 2px;
}
@media (max-width: 640px) {
  .hp-lpr-comp { grid-template-columns: 1fr; }
}
.hp-lpr-adj {
  display: grid;
  gap: .45rem;
  margin-bottom: .35rem;
}
.hp-lpr-adj-row {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) 1fr 2rem;
  gap: .45rem;
  align-items: center;
}
.hp-lpr-adj-lab { min-width: 0; }
.hp-lpr-adj-val {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  text-align: center;
}
.hp-lpr-adj-row input[type="range"] {
  width: 100%;
  min-height: 44px;
  touch-action: pan-y;
}
.hp-lpr-incl {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  margin-bottom: .35rem;
}
.hp-lpr-check {
  display: inline-flex;
  align-items: flex-start;
  gap: .4rem;
  min-height: 44px;
  font-size: .9rem;
  cursor: pointer;
  padding: .25rem .15rem;
}
.hp-lpr-check input { margin-top: .2rem; }
.hp-lpr-lock-lab {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 44px;
  font-size: .92rem;
  cursor: pointer;
}
.hp-lpr-actions .btn,
.hp-lpr-actions a.btn {
  min-height: 44px;
}
.hp-lpr-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .95rem;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-lpr-gauges {
  display: grid;
  grid-template-columns: 1fr 1.15fr 1fr;
  gap: .45rem;
  margin-bottom: .75rem;
}
.hp-lpr-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .55rem;
  background: var(--card, #fff);
  display: grid;
  gap: .12rem;
}
.hp-lpr-gauge strong {
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}
.hp-lpr-gauge-mid {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, var(--card, #fff));
}
.hp-lpr-range { margin: 0 0 .85rem; }
.hp-lpr-range-track {
  position: relative;
  height: 10px;
  border-radius: 99px;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, #94a3b8 35%, var(--border)),
    color-mix(in srgb, var(--brand, #0f766e) 55%, #86efac),
    color-mix(in srgb, #f59e0b 50%, #fde68a)
  );
  margin: .35rem 0 .25rem;
}
.hp-lpr-range-fill { display: none; }
.hp-lpr-range-ask,
.hp-lpr-range-floor {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px rgba(0,0,0,.15);
}
.hp-lpr-range-ask {
  background: var(--brand, #0f766e);
  width: 14px;
  height: 14px;
  z-index: 2;
}
.hp-lpr-range-floor {
  background: #b45309;
  z-index: 1;
}
.hp-lpr-range-labs {
  display: flex;
  justify-content: space-between;
  font-size: .78rem;
  color: var(--muted, #5b6470);
}
.hp-lpr-askbox {
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  border-radius: 12px;
  padding: .65rem .75rem;
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, var(--card, #fff));
  display: grid;
  gap: .15rem;
  margin-bottom: .65rem;
}
.hp-lpr-ask-val {
  font-size: 1.35rem;
  font-variant-numeric: tabular-nums;
}
.hp-lpr-meta {
  display: grid;
  gap: .35rem;
  margin-bottom: .65rem;
  padding: .5rem .6rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--card, #fff);
}
.hp-lpr-meta-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: .5rem;
  font-size: .88rem;
}
.hp-lpr-meta-row strong {
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.hp-lpr-floorbox {
  border: 1px solid #fde68a;
  border-radius: 12px;
  padding: .55rem .7rem;
  background: #fffbeb;
  margin-bottom: .65rem;
  display: grid;
  gap: .1rem;
}
.hp-lpr-subh {
  font-size: .95rem;
  margin: .75rem 0 .35rem;
}
.hp-lpr-args {
  margin: 0 0 .5rem;
  padding-left: 1.1rem;
}
.hp-lpr-args li { margin: .2rem 0; }
.hp-lpr-tips-ul {
  margin: 0 0 .65rem;
  padding-left: 1.1rem;
  font-size: .86rem;
  color: var(--muted, #5b6470);
}
.hp-lpr-tips-ul li { margin: .2rem 0; }
.hp-lpr-summary {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  min-height: 9rem;
  margin: .35rem 0 .5rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  resize: vertical;
}
.hp-lpr-nonadvice {
  margin: .5rem 0 0;
  font-size: .78rem;
}
.hp-lpr-formula {
  margin: 0 0 .65rem;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, var(--card, #fff));
  font-size: .82rem;
  line-height: 1.35;
  word-break: break-word;
}
.hp-lpr-status-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .65rem;
  margin-bottom: .35rem;
}
.hp-lpr-status {
  display: inline-flex;
  align-items: center;
  min-height: 1.75rem;
  padding: .15rem .55rem;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .02em;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-lpr-status[data-temp="klar"] {
  background: color-mix(in srgb, #16a34a 14%, var(--card, #fff));
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  color: #166534;
}
.hp-lpr-status[data-temp="sjekk"] {
  background: color-mix(in srgb, #f59e0b 16%, var(--card, #fff));
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  color: #92400e;
}
.hp-lpr-status[data-temp="mangler"],
.hp-lpr-status[data-temp="empty"] {
  background: color-mix(in srgb, #94a3b8 18%, var(--card, #fff));
  border-color: color-mix(in srgb, #64748b 40%, var(--border));
  color: #475569;
}
.hp-lpr-strat {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .4rem;
  margin-bottom: .35rem;
}
.hp-lpr-strat-card {
  display: grid;
  gap: .12rem;
  text-align: left;
  padding: .5rem .55rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--card, #fff);
  cursor: pointer;
  min-height: 64px;
  font: inherit;
  color: inherit;
  transition: border-color .12s ease, box-shadow .12s ease, background .12s ease;
}
.hp-lpr-strat-card strong {
  font-size: 1rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}
.hp-lpr-strat-card .muted.small {
  font-size: .72rem;
  line-height: 1.25;
  display: block;
  margin-top: .15rem;
}
.hp-lpr-strat-card:hover,
.hp-lpr-strat-card:focus-visible {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 55%, var(--border));
  outline: none;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand, #0f766e) 22%, transparent);
}
.hp-lpr-strat-card.is-active,
.hp-lpr-strat-card[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 60%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, var(--card, #fff));
}
.hp-lpr-strat-delta {
  margin: 0 0 .65rem;
  font-size: .82rem;
  line-height: 1.35;
}
.hp-lpr-faq {
  margin-top: 1rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-lpr-faq > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-lpr-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-lpr-faq details summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-lpr-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-lpr-panel { position: static; }
  .hp-lpr-gauges { grid-template-columns: 1fr; }
  .hp-lpr-strat { grid-template-columns: 1fr; }
  .hp-lpr-adj-row {
    grid-template-columns: 1fr;
    gap: .2rem;
  }
  .hp-lpr-adj-val { text-align: left; }
  .hp-lpr-hero { grid-template-columns: 1fr; }
  .hp-lpr-hero-copy { grid-column: 1; }
}
@media (min-width: 861px) {
  .hp-lpr-hero { grid-template-columns: 72px 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-lpr-panel { scroll-behavior: auto; }
  .hp-lpr-strat-card { transition: none; }
}

/* —— Selger-netto (seller_net) —— */
.hp-sn { margin-top: .25rem; }
.hp-sn-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-sn-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-sn-hero-copy { min-width: 0; }
.hp-sn-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  color: var(--muted, #5b6470);
}
.hp-sn-lead-bullets li { margin: .2rem 0; }
.hp-sn-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-sn-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-sn-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-sn-how-list li { margin: .2rem 0; }
.hp-sn-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  color: var(--brand);
  vertical-align: middle;
}
.hp-sn-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .45rem;
  margin: 0 0 .65rem;
}
.hp-sn-demos .chip {
  font-size: .82rem;
  padding: .28rem .65rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-sn-demos .chip:hover,
.hp-sn-demos .chip.active,
.hp-sn-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-sn-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-sn-demo-note { margin: 0 0 .65rem; }
.hp-sn-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.95fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 820px) {
  .hp-sn-layout {
    grid-template-columns: 1fr;
    display: flex;
    flex-direction: column;
  }
  .hp-sn-panel { order: -1; }
  .hp-sn-hero {
    grid-template-columns: 1fr;
  }
  .hp-sn-hero-mascot { width: 56px; height: 56px; }
}
.hp-sn-section {
  margin: 1rem 0 .45rem;
  font-size: .95rem;
  letter-spacing: -0.01em;
}
.hp-sn-section:first-child { margin-top: 0; }
.hp-sn-lines {
  list-style: none;
  margin: 0 0 .5rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .45rem;
}
.hp-sn-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(7.5rem, 9rem);
  gap: .45rem .65rem;
  align-items: center;
  padding: .45rem .55rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-elev, #fff);
}
.hp-sn-line-on {
  display: flex;
  align-items: flex-start;
  gap: .45rem;
  font-size: .88rem;
  margin: 0;
  cursor: pointer;
}
.hp-sn-line-on input[type="checkbox"] { margin-top: .2rem; flex-shrink: 0; }
.hp-sn-line-amt { width: 100%; }
@media (max-width: 520px) {
  .hp-sn-line {
    grid-template-columns: 1fr;
  }
}
.hp-sn-panel {
  position: sticky;
  top: 4.5rem;
  padding: 1rem 1.05rem 1.1rem;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
  box-shadow: var(--shadow, 0 4px 16px rgba(0,0,0,.04));
  scroll-margin-top: 4.5rem;
}
@media (max-width: 820px) {
  .hp-sn-panel {
    position: relative;
    top: auto;
  }
}
.hp-sn-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .75rem;
}
.hp-sn-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
  background: var(--card, #fff);
}
.hp-sn-gauge strong {
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.hp-sn-gauge-net {
  grid-column: 1 / -1;
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  background: color-mix(in srgb, var(--brand) 10%, #fff);
}
.hp-sn-gauge-net strong {
  font-size: clamp(1.45rem, 3.5vw, 1.9rem);
  color: var(--brand);
}
.hp-sn-stack { margin: .65rem 0 .55rem; }
.hp-sn-stack-bar {
  display: flex;
  height: 14px;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  border: 1px solid var(--border);
}
.hp-sn-seg { display: block; min-width: 0; height: 100%; transition: width .2s ease; }
@media (prefers-reduced-motion: reduce) {
  .hp-sn-seg { transition: none !important; }
}
.hp-sn-seg-net { background: color-mix(in srgb, var(--brand) 75%, #16a34a); }
.hp-sn-seg-debt { background: color-mix(in srgb, #64748b 70%, var(--border)); }
.hp-sn-seg-cost { background: color-mix(in srgb, #f59e0b 65%, #fde68a); }
.hp-sn-legend {
  list-style: none;
  margin: .4rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .75rem;
  font-size: .78rem;
  color: var(--muted, #5b6470);
}
.hp-sn-legend li { display: flex; align-items: center; gap: .3rem; }
.hp-sn-dot {
  width: .65rem;
  height: .65rem;
  border-radius: 3px;
  display: inline-block;
}
.hp-sn-subh {
  margin: .85rem 0 .35rem;
  font-size: .9rem;
  font-weight: 750;
}
.hp-sn-table,
.hp-sn-scen-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .86rem;
  font-variant-numeric: tabular-nums;
}
.hp-sn-table th,
.hp-sn-scen-table th {
  text-align: left;
  font-weight: 600;
  padding: .28rem .2rem .28rem 0;
  border-bottom: 1px solid var(--border);
}
.hp-sn-table td,
.hp-sn-scen-table td {
  text-align: right;
  padding: .28rem 0 .28rem .2rem;
  border-bottom: 1px solid var(--border);
}
.hp-sn-tr-strong th,
.hp-sn-tr-strong td { font-weight: 750; }
.hp-sn-breakdown {
  margin: .35rem 0 0;
  padding-left: 1.1rem;
}
.hp-sn-breakdown li { margin: .12rem 0; }
.hp-sn-rev {
  margin-top: .65rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-sn-tips-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
  color: var(--muted, #5b6470);
}
.hp-sn-tips-ul li { margin: .2rem 0; }
.hp-sn-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-sn-faq { margin-top: 1rem; }
.hp-sn-faq > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .95rem;
}
.hp-sn-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-sn-faq details summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-sn-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-sn-gauges { grid-template-columns: 1fr; }
  .hp-sn-gauge-net { grid-column: auto; }
}

/* —— Foto & staging-sjekk (sell-foto-sjekk / foto_sjekk) —— */
.hp-fs { display: grid; gap: 1rem; }
.hp-fs-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .85rem 1rem;
  align-items: start;
  padding: .85rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
}
.hp-fs-hero-mascot {
  width: 72px; height: 72px; border-radius: 50%;
  object-fit: cover; flex-shrink: 0;
  border: 2px solid color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-fs-hero-copy { min-width: 0; grid-column: 2; }
.hp-fs-lead-bullets {
  margin: .25rem 0 0; padding-left: 1.15rem;
  font-size: .88rem; color: var(--muted);
}
.hp-fs-lead-bullets li { margin: .15rem 0; }
.hp-fs-how {
  grid-column: 1 / -1;
  margin-top: .15rem;
  border-top: 1px dashed color-mix(in srgb, var(--brand) 25%, var(--border));
  padding-top: .45rem;
}
.hp-fs-how summary {
  cursor: pointer; font-weight: 700; font-size: .92rem;
}
.hp-fs-how-list {
  margin: .4rem 0 0; padding-left: 1.2rem;
  font-size: .88rem; color: var(--muted);
}
.hp-fs-how-list li { margin: .2rem 0; }
.hp-fs-demos {
  display: flex; flex-wrap: wrap; align-items: center; gap: .45rem;
}
.hp-fs-demo-badge {
  display: inline-block;
  font-size: .68rem; font-weight: 700; letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem; border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg-elev));
  border: 1px solid color-mix(in srgb, #f59e0b 45%, var(--border));
  color: var(--text);
}
.hp-fs-demo-note {
  margin: 0; padding: .4rem .65rem; border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-fs-demos .chip.is-on,
.hp-fs-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-fs-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .95fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 860px) {
  .hp-fs-layout { grid-template-columns: 1fr; }
  .hp-fs-hero { grid-template-columns: auto 1fr; }
}
.hp-fs-section {
  font-size: 1rem; font-weight: 750; margin: 1rem 0 .45rem;
  letter-spacing: -0.02em;
}
.hp-fs-main .hp-fs-section:first-child { margin-top: 0; }
.hp-fs-staging {
  display: flex; flex-wrap: wrap; gap: .4rem;
}
.hp-fs-stag {
  display: inline-flex; align-items: flex-start; gap: .35rem;
  padding: .4rem .55rem; border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  font-size: .82rem; font-weight: 550; cursor: pointer;
  margin: 0; max-width: 100%;
}
.hp-fs-stag:has(input:checked) {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 10%, var(--bg-elev));
}
.hp-fs-stag input { margin: .15rem 0 0; accent-color: #16a34a; flex-shrink: 0; }
.hp-fs-shots {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: .55rem;
}
.hp-fs-shot {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: var(--bg-elev);
}
.hp-fs-shot.is-critical {
  border-color: color-mix(in srgb, #0f766e 35%, var(--border));
}
.hp-fs-shot.is-gap {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 8%, var(--bg-elev));
}
.hp-fs-shot.is-ok {
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
  background: color-mix(in srgb, #16a34a 7%, var(--bg-elev));
}
.hp-fs-shot-top {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .45rem;
}
.hp-fs-shot-label {
  display: inline-flex; flex-wrap: wrap; align-items: center; gap: .35rem;
  font-weight: 600; font-size: .9rem;
}
.hp-fs-crit-badge {
  display: inline-block;
  font-size: .65rem; font-weight: 800; letter-spacing: .03em;
  text-transform: uppercase;
  padding: .08rem .35rem; border-radius: 999px;
  background: color-mix(in srgb, #0f766e 18%, var(--bg));
  border: 1px solid color-mix(in srgb, #0f766e 40%, var(--border));
  color: var(--text);
}
.hp-fs-status-wrap { margin: 0; }
.hp-fs-status {
  min-width: 8.5rem;
  font-size: .85rem;
  padding: .3rem .45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-fs-shot-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .84rem;
  padding: .35rem .5rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
}
.hp-fs-dims {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem .85rem;
}
@media (max-width: 560px) {
  .hp-fs-dims { grid-template-columns: 1fr; }
  .hp-fs-shot-top { flex-direction: column; align-items: stretch; }
  .hp-fs-status { width: 100%; min-width: 0; }
}
.hp-fs-dim {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  gap: .15rem .5rem;
  align-items: center;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  margin: 0;
}
.hp-fs-dim-label { grid-column: 1; font-size: .9rem; font-weight: 600; }
.hp-fs-dim input[type="range"] {
  grid-column: 1 / -1;
  width: 100%;
  accent-color: var(--brand);
}
.hp-fs-dim-val {
  grid-column: 2; grid-row: 1;
  font-weight: 800; font-variant-numeric: tabular-nums;
  color: var(--brand); min-width: 1.25rem; text-align: right;
}
.hp-fs-live {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: .45rem .75rem;
  margin-top: .75rem;
  padding: .65rem .85rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
}
.hp-fs-live-num {
  font-size: 1.65rem; font-weight: 800; letter-spacing: -0.03em;
  color: var(--brand); font-variant-numeric: tabular-nums;
}
.hp-fs-band {
  display: inline-block;
  font-size: .78rem; font-weight: 700;
  padding: .15rem .5rem; border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-fs-band.is-ok {
  border-color: color-mix(in srgb, #16a34a 50%, var(--border));
  background: color-mix(in srgb, #16a34a 14%, var(--bg-elev));
}
.hp-fs-band.is-mid {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 12%, var(--bg-elev));
}
.hp-fs-band.is-tight {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 12%, var(--bg-elev));
}
.hp-fs-panel {
  position: sticky;
  top: 0.75rem;
  padding: 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  box-shadow: var(--shadow);
}
.hp-fs-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .75rem;
}
.hp-fs-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-fs-gauge strong {
  font-size: 1.25rem; font-weight: 800; letter-spacing: -0.02em;
}
.hp-fs-bar-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: .45rem;
  align-items: center;
  margin-bottom: .75rem;
}
.hp-fs-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-fs-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--brand) 70%, #16a34a), var(--brand));
  transition: width .2s ease;
}
.hp-fs-readiness {
  border-radius: 12px;
  padding: .65rem .75rem;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-fs-readiness.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-fs-readiness.is-mid {
  border-color: #fde68a;
  background: #fffbeb;
}
.hp-fs-readiness.is-tight {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-fs-ready-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-fs-gaps {
  border: 1px solid #fecaca;
  background: #fff1f2;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-fs-gaps-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-fs-gaps-ul li { margin: .15rem 0; }
.hp-fs-order {
  margin-bottom: .75rem;
}
.hp-fs-order-ol {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-fs-order-ol li { margin: .2rem 0; }
.hp-fs-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 8rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-fs-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-fs-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-fs-faq summary {
  cursor: pointer; font-weight: 650; font-size: .92rem;
}
.hp-fs-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-fs-panel { position: static; }
  .hp-fs-gauges { grid-template-columns: 1fr; }
  .hp-fs-bar-row { grid-template-columns: 1fr auto; }
  .hp-fs-bar-row > .muted { grid-column: 1 / -1; }
}


/* —— Område-fit (buy-omrade-fit) —— */
.hp-of { display: grid; gap: 1rem; }
.hp-of-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .85rem 1rem;
  align-items: start;
  padding: .85rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
}
.hp-of-hero-mascot {
  width: 72px; height: 72px; border-radius: 50%;
  object-fit: cover; flex-shrink: 0;
  border: 2px solid color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-of-hero-copy { min-width: 0; grid-column: 2; }
.hp-of-lead-bullets {
  margin: .25rem 0 0; padding-left: 1.15rem;
  font-size: .88rem; color: var(--muted);
}
.hp-of-lead-bullets li { margin: .15rem 0; }
.hp-of-how {
  grid-column: 1 / -1;
  margin-top: .15rem;
  border-top: 1px dashed color-mix(in srgb, var(--brand) 25%, var(--border));
  padding-top: .45rem;
}
.hp-of-how summary {
  cursor: pointer; font-weight: 700; font-size: .92rem;
}
.hp-of-how-list {
  margin: .4rem 0 0; padding-left: 1.2rem;
  font-size: .88rem; color: var(--muted);
}
.hp-of-how-list li { margin: .2rem 0; }
.hp-of-demos {
  display: flex; flex-wrap: wrap; align-items: center; gap: .45rem;
}
.hp-of-demo-badge {
  display: inline-block;
  font-size: .68rem; font-weight: 700; letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem; border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg-elev));
  border: 1px solid color-mix(in srgb, #f59e0b 45%, var(--border));
  color: var(--text);
}
.hp-of-demo-note {
  margin: 0; padding: .4rem .65rem; border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-of-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .95fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 860px) {
  .hp-of-layout { grid-template-columns: 1fr; }
  .hp-of-hero { grid-template-columns: auto 1fr; }
}
.hp-of-section {
  font-size: 1rem; font-weight: 750; margin: 1rem 0 .45rem;
  letter-spacing: -0.02em;
}
.hp-of-form-col .hp-of-section:first-child { margin-top: 0; }
.hp-of-weights,
.hp-of-dims {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem .85rem;
}
@media (max-width: 560px) {
  .hp-of-weights,
  .hp-of-dims { grid-template-columns: 1fr; }
}
.hp-of-weight,
.hp-of-dim {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  gap: .15rem .5rem;
  align-items: center;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  margin: 0;
}
.hp-of-weight-label,
.hp-of-dim-label { grid-column: 1; font-size: .9rem; font-weight: 600; }
.hp-of-weight input[type="range"],
.hp-of-dim input[type="range"] {
  grid-column: 1 / -1;
  width: 100%;
  accent-color: var(--brand);
}
.hp-of-dim-val {
  grid-column: 2; grid-row: 1;
  font-weight: 800; font-variant-numeric: tabular-nums;
  color: var(--brand); min-width: 1.25rem; text-align: right;
}
.hp-of-live {
  margin-top: .75rem;
  padding: .65rem .85rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
}
.hp-of-live-main {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: .45rem .75rem;
}
.hp-of-live-num {
  font-size: 1.65rem; font-weight: 800; letter-spacing: -0.03em;
  color: var(--brand); font-variant-numeric: tabular-nums;
}
.hp-of-live-sub { margin-top: .25rem; }
.hp-of-band {
  display: inline-block;
  font-size: .78rem; font-weight: 700;
  padding: .15rem .5rem; border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-of-band.is-ok {
  border-color: color-mix(in srgb, #16a34a 50%, var(--border));
  background: color-mix(in srgb, #16a34a 14%, var(--bg-elev));
}
.hp-of-band.is-mid {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 12%, var(--bg-elev));
}
.hp-of-band.is-tight {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 12%, var(--bg-elev));
}
.hp-of-checks {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .65rem;
}
@media (max-width: 640px) {
  .hp-of-checks { grid-template-columns: 1fr; }
}
.hp-of-check-group {
  display: flex; flex-direction: column; gap: .35rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-of-check-title { font-weight: 700; margin-bottom: .15rem; }
.hp-of-check {
  display: flex; align-items: flex-start; gap: .4rem;
  font-size: .86rem; font-weight: 550; cursor: pointer; margin: 0;
}
.hp-of-check input { margin: .15rem 0 0; flex-shrink: 0; }
.hp-of-check--must input { accent-color: #16a34a; }
.hp-of-check--deal input { accent-color: #dc2626; }
.hp-of-check--must:has(input:checked) {
  color: color-mix(in srgb, #16a34a 70%, var(--text));
}
.hp-of-check--deal:has(input:checked) {
  color: color-mix(in srgb, #dc2626 75%, var(--text));
}
.hp-of-panel {
  padding: 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  box-shadow: var(--shadow);
  position: sticky;
  top: 0.75rem;
}
.hp-of-panel-head {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .5rem;
  margin-bottom: .65rem;
}
.hp-of-sort { display: flex; flex-wrap: wrap; gap: .3rem; }
.hp-of-sort .chip.is-on,
.hp-of-sort .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-of-list { display: grid; gap: .65rem; }
.hp-of-card {
  padding: .75rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 4%, var(--bg));
}
.hp-of-card.has-deal {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 6%, var(--bg));
}
.hp-of-card-top {
  display: flex; justify-content: space-between; gap: .65rem;
  align-items: flex-start;
}
.hp-of-card-score {
  display: flex; flex-direction: column; align-items: flex-end;
  flex-shrink: 0;
}
.hp-of-card-avg {
  font-size: 1.35rem; font-weight: 800; color: var(--brand);
  font-variant-numeric: tabular-nums; letter-spacing: -0.02em;
  line-height: 1.1;
}
.hp-of-card-meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: .35rem;
  margin-top: .2rem;
}
.hp-of-card-dims {
  display: flex; flex-wrap: wrap; gap: .25rem .55rem;
  margin: .4rem 0 .2rem;
}
.hp-of-card-deals {
  font-size: .82rem; color: color-mix(in srgb, #dc2626 70%, var(--text));
  margin: .25rem 0;
}
.hp-of-card-musts { margin: .15rem 0; }
.hp-of-card-actions {
  display: flex; gap: .35rem; margin-top: .45rem;
}
.hp-of-rank {
  margin-top: .85rem;
  padding-top: .65rem;
  border-top: 1px solid var(--border);
}
.hp-of-rank-ol {
  margin: 0; padding-left: 1.2rem;
  font-size: .9rem;
}
.hp-of-rank-ol li { margin: .2rem 0; }
.hp-of-commit { margin-top: .85rem; }
.hp-of-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .8rem;
  line-height: 1.4;
  resize: vertical;
}
.hp-of-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-of-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-of-faq summary {
  cursor: pointer; font-weight: 650; font-size: .92rem;
}
.hp-of-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-of-panel { position: static; }
}

/* —— Privat budjournal (bid_journal) —— */
.hp-bj-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  margin-bottom: .85rem;
  align-items: start;
}
.hp-bj-hero-mascot {
  border-radius: 14px;
  object-fit: cover;
  background: var(--bg-elev);
}
.hp-bj-hero-copy { min-width: 0; }
.hp-bj-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
  display: grid;
  gap: .2rem;
  font-size: .9rem;
  color: var(--muted);
}
.hp-bj-lead-bullets li { margin: .12rem 0; }
.hp-bj-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .35rem .7rem .55rem;
  background: var(--bg-elev);
}
.hp-bj-how summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
}
.hp-bj-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
  color: var(--muted);
  display: grid;
  gap: .25rem;
}
.hp-bj-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg-elev));
  color: #92400e;
  vertical-align: middle;
}
.hp-bj-demo-note {
  margin: .35rem 0 .55rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev));
}
.hp-bj-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: .55rem 0 .35rem;
}
.hp-bj-demos .chip,
.hp-bj-step-chips .chip {
  min-height: 40px;
  padding: .45rem .85rem;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  border-radius: 999px;
  font-size: .84rem;
  font-weight: 650;
  cursor: pointer;
  color: inherit;
}
.hp-bj-demos .chip:hover,
.hp-bj-demos .chip[aria-pressed="true"],
.hp-bj-step-chips .chip:hover {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-bj-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-bj-step-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .35rem 0 .15rem;
}
.hp-bj-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .95fr);
  gap: 1rem;
  margin-top: .75rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-bj-layout { grid-template-columns: 1fr; }
  .hp-bj-hero { grid-template-columns: auto 1fr; }
}
.hp-bj-section {
  margin: 1.1rem 0 .55rem;
  font-size: 1.05rem;
  font-weight: 750;
}
.hp-bj-main .hp-bj-section:first-child { margin-top: 0; }
.hp-bj-subh {
  margin: .85rem 0 .35rem;
  font-size: .95rem;
  font-weight: 700;
}
.hp-bj-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .9rem 1rem 1.05rem;
  background: var(--bg-elev);
  display: grid;
  gap: .65rem;
}
.hp-bj-panel-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .45rem;
}
.hp-bj-band {
  display: inline-block;
  font-size: .78rem;
  font-weight: 700;
  padding: .2rem .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--muted) 18%, var(--bg));
  color: inherit;
}
.hp-bj-band.is-ok {
  background: color-mix(in srgb, #16a34a 18%, var(--bg));
  color: #14532d;
}
.hp-bj-band.is-mid {
  background: color-mix(in srgb, #f59e0b 22%, var(--bg));
  color: #92400e;
}
.hp-bj-band.is-tight {
  background: color-mix(in srgb, #dc2626 18%, var(--bg));
  color: #991b1b;
}
.hp-bj-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
}
.hp-bj-gauge {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .55rem;
  background: var(--bg);
  display: grid;
  gap: .15rem;
}
.hp-bj-gauge strong {
  font-size: .98rem;
  font-variant-numeric: tabular-nums;
}
.hp-bj-water {
  margin-top: .15rem;
}
.hp-bj-water-row {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  align-items: baseline;
  margin-bottom: .3rem;
}
.hp-bj-water-bar {
  position: relative;
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-bj-water-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 70%, #22c55e);
  transition: width .2s ease;
}
.hp-bj-water-fill.is-over {
  background: color-mix(in srgb, #dc2626 75%, var(--brand));
}
.hp-bj-water-mark {
  position: absolute;
  top: -2px;
  bottom: -2px;
  width: 2px;
  background: var(--fg, #111);
  opacity: .55;
  transform: translateX(-1px);
}
.hp-bj-next {
  border-top: 1px solid var(--border);
  padding-top: .55rem;
}
.hp-bj-next-list {
  margin: .25rem 0 0;
  padding-left: 1.1rem;
  font-size: .9rem;
  display: grid;
  gap: .2rem;
}
.hp-bj-cost-note {
  margin: .4rem 0 0;
  font-style: italic;
}
.hp-bj-flags {
  border: 1px solid color-mix(in srgb, #f59e0b 45%, var(--border));
  border-radius: 10px;
  padding: .5rem .65rem;
  background: color-mix(in srgb, #f59e0b 8%, var(--bg));
}
.hp-bj-flag-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  color: var(--muted);
  display: grid;
  gap: .2rem;
}
.hp-bj-summary {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .8rem;
  line-height: 1.4;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .65rem .75rem;
  background: var(--bg);
  resize: vertical;
  min-height: 10rem;
}
.hp-bj-nonadvice {
  margin: .25rem 0 0;
  opacity: .9;
}
.hp-bj-ledger {
  list-style: none;
  padding: 0;
  margin: .5rem 0 0;
  display: grid;
  gap: .4rem;
}
.hp-bj-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .4rem .65rem;
  align-items: start;
  padding: .55rem .7rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-elev);
  font-size: .9rem;
}
.hp-bj-row.is-me {
  border-left: 3px solid color-mix(in srgb, var(--brand) 70%, #16a34a);
}
.hp-bj-row.is-other {
  border-left: 3px solid color-mix(in srgb, #dc2626 55%, var(--border));
}
.hp-bj-row.is-unknown {
  border-left: 3px solid color-mix(in srgb, #f59e0b 55%, var(--border));
}
.hp-bj-when { color: var(--muted); font-size: .84rem; }
.hp-bj-kind {
  font-weight: 700;
  margin-right: .2rem;
}
.hp-bj-side {
  font-size: .82rem;
  color: var(--muted);
}
.hp-bj-amt {
  font-variant-numeric: tabular-nums;
  margin-left: .25rem;
}
.hp-bj-note-txt { color: var(--muted); }
.hp-bj-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .2rem;
  justify-content: flex-end;
}
.hp-bj-privacy {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .35rem .7rem .55rem;
  background: var(--bg-elev);
}
.hp-bj-privacy summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
}
.hp-bj-seed-hint {
  margin: .35rem 0 0;
  padding: .35rem .5rem;
  border-radius: 8px;
  border: 1px dashed var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev));
}
@media (max-width: 520px) {
  .hp-bj-gauges { grid-template-columns: 1fr; }
  .hp-bj-row { grid-template-columns: 1fr; }
  .hp-bj-row-actions { justify-content: flex-start; }
}

/* —— Belåningsgrad-overblikk (buy-ltv-overblikk) —— */
.hp-ltv { margin: 0; }
.hp-ltv-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-ltv-hero-copy { min-width: 0; grid-column: 1; }
.hp-ltv-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  justify-self: end;
  border-radius: 14px;
  object-fit: cover;
}
.hp-ltv-how { grid-column: 1 / -1; }
.hp-ltv-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  line-height: 1.45;
}
.hp-ltv-lead-bullets li { margin: .2rem 0; }
.hp-ltv-how {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .65rem;
  background: color-mix(in srgb, var(--bg-elev) 80%, transparent);
}
.hp-ltv-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-ltv-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.2rem;
  font-size: .84rem;
  line-height: 1.45;
}
.hp-ltv-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg-elev));
  color: color-mix(in srgb, #b45309 80%, var(--text));
  border: 1px solid color-mix(in srgb, #f59e0b 40%, var(--border));
  vertical-align: middle;
}
.hp-ltv-demo-note {
  margin: .35rem 0 .65rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
  border: 1px dashed color-mix(in srgb, #f59e0b 45%, var(--border));
}
.hp-ltv-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  margin: .35rem 0 .5rem;
}
.hp-ltv-demos .chip {
  font-size: .8rem;
}
.hp-ltv-demos .chip.active,
.hp-ltv-demos .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  outline-offset: 1px;
}
.hp-ltv-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-ltv-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
  gap: 1rem;
  align-items: start;
}
.hp-ltv-main { order: 1; min-width: 0; }
.hp-ltv-panel {
  order: 2;
  position: sticky;
  top: .75rem;
  padding: .85rem .9rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--text) 4%, transparent);
}
.hp-ltv-section {
  font-size: .95rem;
  font-weight: 700;
  margin: 1rem 0 .5rem;
  letter-spacing: -0.01em;
}
.hp-ltv-section:first-child { margin-top: 0; }
.hp-ltv-quick-row {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-top: .25rem;
}
.hp-ltv-quick .chip-sm.active,
.hp-ltv-quick .chip-sm[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  outline-offset: 1px;
  font-weight: 700;
}
.hp-ltv-live { text-align: center; margin-bottom: .65rem; }
.hp-ltv-live .hp-bid-num { margin: .15rem 0; }
.hp-ltv-nonadvice-fixed {
  font-size: .72rem;
  opacity: .85;
  margin: .2rem 0 0;
}
.hp-ltv-gauges {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .4rem;
  margin: .55rem 0;
}
.hp-ltv-gauges .hp-gauge {
  padding: .5rem .55rem;
  font-size: .82rem;
}
.hp-ltv-gauges .hp-gauge strong {
  font-size: .95rem;
}
.hp-ltv-bar-wrap { margin: .65rem 0; }
.hp-ltv-bar {
  position: relative;
  height: 12px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  border: 1px solid var(--border);
  overflow: visible;
}
.hp-ltv-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 70%, #22c55e);
  transition: width .2s ease;
  max-width: 100%;
}
.hp-ltv-fill.is-ok {
  background: color-mix(in srgb, var(--brand) 70%, #22c55e);
}
.hp-ltv-fill.is-mid {
  background: color-mix(in srgb, #f59e0b 70%, var(--brand));
}
.hp-ltv-fill.is-over {
  background: color-mix(in srgb, #ef4444 75%, var(--brand));
}
.hp-ltv-mark {
  position: absolute;
  top: -3px;
  bottom: -3px;
  width: 2px;
  background: color-mix(in srgb, var(--text) 40%, transparent);
  transform: translateX(-1px);
}
.hp-ltv-mark-mid {
  background: color-mix(in srgb, #b45309 70%, transparent);
}
.hp-ltv-mark-warn {
  background: color-mix(in srgb, #dc2626 75%, transparent);
}
.hp-ltv-bar-labels {
  display: flex;
  justify-content: space-between;
  font-size: .68rem;
  color: color-mix(in srgb, var(--text) 65%, transparent);
  margin-top: .2rem;
  padding: 0 .1rem;
}
.hp-ltv-stack { margin: .7rem 0; }
.hp-ltv-stack-bar {
  display: flex;
  height: 14px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--border);
}
.hp-ltv-seg { display: block; min-width: 0; transition: width .2s ease; }
.hp-ltv-seg-eq {
  background: color-mix(in srgb, #22c55e 65%, var(--brand));
}
.hp-ltv-seg-loan {
  background: color-mix(in srgb, var(--brand) 55%, #64748b);
}
.hp-ltv-legend {
  list-style: none;
  margin: .4rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .45rem 1rem;
  font-size: .82rem;
}
.hp-ltv-dot {
  display: inline-block;
  width: .65rem;
  height: .65rem;
  border-radius: 3px;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-ltv-common-box,
.hp-ltv-gap,
.hp-ltv-reverse,
.hp-ltv-tips,
.hp-ltv-commit {
  margin: .7rem 0;
  padding: .55rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev));
}
.hp-ltv-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .82rem;
}
.hp-ltv-table th,
.hp-ltv-table td {
  text-align: left;
  padding: .3rem .25rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  font-variant-numeric: tabular-nums;
}
.hp-ltv-table thead th {
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: color-mix(in srgb, var(--text) 70%, transparent);
}
.hp-ltv-row-focus {
  background: color-mix(in srgb, var(--brand) 10%, transparent);
  font-weight: 650;
}
.hp-ltv-gap-need {
  color: color-mix(in srgb, #dc2626 85%, var(--text));
  font-weight: 650;
}
.hp-ltv-gap-ok {
  color: color-mix(in srgb, #15803d 85%, var(--text));
  font-weight: 600;
}
.hp-ltv-rev-num {
  font-size: 1.35rem;
  margin: .15rem 0;
}
.hp-ltv-tip-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  line-height: 1.4;
}
.hp-ltv-tip-list li { margin: .25rem 0; }
.hp-ltv-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .76rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .5rem .6rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-ltv-privacy {
  margin-top: .85rem;
  font-size: .84rem;
}
.hp-ltv-privacy summary { cursor: pointer; font-weight: 600; }
.hp-ltv-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-ltv-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-ltv-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 900px) {
  .hp-ltv-layout {
    grid-template-columns: 1fr;
  }
  .hp-ltv-panel {
    position: static;
    order: 0;
  }
  .hp-ltv-main { order: 1; }
  .hp-ltv-hero {
    grid-template-columns: 1fr auto;
  }
  .hp-ltv-hero-copy { grid-column: 1; }
  .hp-ltv-hero-mascot {
    grid-column: 2;
    width: 56px;
    height: 56px;
  }
  .hp-ltv-how { order: 3; grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .hp-ltv-gauges { grid-template-columns: 1fr; }
  .hp-ltv-hero-mascot { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-ltv-fill,
  .hp-ltv-seg { transition: none; }
}

/* —— Leiebudsjett (rent_in-leiebudsjett · rent_budget) —— */
.hp-rb { margin: 0; }
.hp-rb-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-rb-hero-copy { min-width: 0; grid-column: 1; }
.hp-rb-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  justify-self: end;
  border-radius: 14px;
  object-fit: cover;
}
.hp-rb-how { grid-column: 1 / -1; }
.hp-rb-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  line-height: 1.45;
}
.hp-rb-lead-bullets li { margin: .2rem 0; }
.hp-rb-how {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .65rem;
  background: color-mix(in srgb, var(--bg-elev) 80%, transparent);
}
.hp-rb-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-rb-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.2rem;
  font-size: .84rem;
  line-height: 1.45;
}
.hp-rb-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg-elev));
  color: color-mix(in srgb, #b45309 80%, var(--text));
  border: 1px solid color-mix(in srgb, #f59e0b 40%, var(--border));
  vertical-align: middle;
}
.hp-rb-demo-note,
.hp-rb-profile-note {
  margin: .35rem 0 .65rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
  border: 1px dashed color-mix(in srgb, #f59e0b 45%, var(--border));
}
.hp-rb-profile-note {
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-rb-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  margin: .35rem 0 .5rem;
}
.hp-rb-demos .chip { font-size: .8rem; }
.hp-rb-demos .chip.active,
.hp-rb-demos .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  outline-offset: 1px;
}
.hp-rb-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-rb-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
  gap: 1rem;
  align-items: start;
}
.hp-rb-main { order: 1; min-width: 0; }
.hp-rb-panel {
  order: 2;
  position: sticky;
  top: .75rem;
  padding: .85rem .9rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--text) 4%, transparent);
}
.hp-rb-section {
  font-size: .95rem;
  font-weight: 700;
  margin: 1rem 0 .5rem;
  letter-spacing: -0.01em;
}
.hp-rb-section:first-child { margin-top: 0; }
.hp-rb-quick-row {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-top: .25rem;
}
.hp-rb-quick .chip-sm.active,
.hp-rb-quick .chip-sm[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  outline-offset: 1px;
  font-weight: 700;
}
.hp-rb-check {
  display: flex;
  align-items: flex-start;
  gap: .45rem;
  font-size: .88rem;
  margin-top: .35rem;
  cursor: pointer;
}
.hp-rb-check input { margin-top: .2rem; }
.hp-rb-src {
  display: inline-block;
  margin-top: .2rem;
  font-size: .75rem;
  color: color-mix(in srgb, var(--brand) 80%, var(--text));
}
.hp-rb-live { text-align: center; margin-bottom: .65rem; }
.hp-rb-live .hp-bid-num { margin: .15rem 0; }
.hp-rb-nonadvice-fixed {
  font-size: .72rem;
  opacity: .85;
  margin: .2rem 0 0;
}
.hp-rb-temp {
  display: inline-block;
  margin: .35rem 0 .15rem;
  padding: .2rem .55rem;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 700;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
}
.hp-rb-temp.is-komfort {
  background: color-mix(in srgb, #22c55e 18%, var(--bg-elev));
  border-color: color-mix(in srgb, #22c55e 45%, var(--border));
  color: color-mix(in srgb, #15803d 85%, var(--text));
}
.hp-rb-temp.is-plan {
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
}
.hp-rb-temp.is-strekk {
  background: color-mix(in srgb, #f59e0b 18%, var(--bg-elev));
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  color: color-mix(in srgb, #b45309 85%, var(--text));
}
.hp-rb-temp.is-hoy,
.hp-rb-temp.is-over {
  background: color-mix(in srgb, #ef4444 16%, var(--bg-elev));
  border-color: color-mix(in srgb, #ef4444 45%, var(--border));
  color: color-mix(in srgb, #b91c1c 85%, var(--text));
}
.hp-rb-bind {
  margin: .55rem 0;
  padding: .55rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev));
}
.hp-rb-bind-grid {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: .4rem;
  align-items: stretch;
}
.hp-rb-bind-card {
  padding: .45rem .5rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  display: flex;
  flex-direction: column;
  gap: .15rem;
  font-size: .82rem;
}
.hp-rb-bind-card strong {
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
}
.hp-rb-bind-card.is-binding {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand) 35%, transparent);
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
  font-weight: 650;
}
.hp-rb-bind-vs {
  align-self: center;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: color-mix(in srgb, var(--text) 55%, transparent);
}
.hp-rb-cash-gap {
  margin-top: .35rem;
  padding-top: .2rem;
  border-top: 1px dashed color-mix(in srgb, var(--border) 90%, transparent);
}
.hp-rb-gauges {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .4rem;
  margin: .55rem 0;
}
.hp-rb-gauges .hp-gauge {
  padding: .5rem .55rem;
  font-size: .82rem;
}
.hp-rb-gauges .hp-gauge strong { font-size: .95rem; }
.hp-rb-objb {
  margin-top: .55rem;
  border-top: 1px dashed color-mix(in srgb, var(--border) 80%, transparent);
  padding-top: .45rem;
}
.hp-rb-ab {
  margin: .55rem 0 .35rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
  border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--border));
}
.hp-rb-ab [data-out="ab_summary"] {
  line-height: 1.4;
  font-size: .84rem;
}
.hp-rb-cur {
  margin: .55rem 0 .35rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: color-mix(in srgb, #0ea5e9 8%, var(--bg-elev));
  border: 1px solid color-mix(in srgb, #0ea5e9 30%, var(--border));
}
.hp-rb-quick-row [data-rb-zero].active,
.hp-rb-quick-row [data-rb-zero][aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 50%, transparent);
  outline-offset: 1px;
  font-weight: 650;
}
.hp-rb-bar-wrap { margin: .65rem 0; }
.hp-rb-bar {
  position: relative;
  height: 12px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  border: 1px solid var(--border);
  overflow: visible;
}
.hp-rb-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 70%, #22c55e);
  transition: width .2s ease;
  max-width: 100%;
}
.hp-rb-fill.is-ok {
  background: color-mix(in srgb, var(--brand) 70%, #22c55e);
}
.hp-rb-fill.is-plan {
  background: color-mix(in srgb, #f59e0b 55%, var(--brand));
}
.hp-rb-fill.is-stretch {
  background: color-mix(in srgb, #f59e0b 80%, #ef4444);
}
.hp-rb-fill.is-high {
  background: color-mix(in srgb, #ef4444 75%, var(--brand));
}
.hp-rb-mark {
  position: absolute;
  top: -3px;
  bottom: -3px;
  width: 2px;
  background: color-mix(in srgb, var(--text) 40%, transparent);
  transform: translateX(-1px);
}
.hp-rb-mark-mid {
  background: color-mix(in srgb, #b45309 70%, transparent);
}
.hp-rb-mark-warn {
  background: color-mix(in srgb, #dc2626 75%, transparent);
}
.hp-rb-bar-labels {
  display: flex;
  justify-content: space-between;
  font-size: .68rem;
  color: color-mix(in srgb, var(--text) 65%, transparent);
  margin-top: .2rem;
  padding: 0 .1rem;
}
.hp-rb-stack { margin: .7rem 0; }
.hp-rb-stack-bar {
  display: flex;
  height: 14px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--border);
}
.hp-rb-seg { display: block; min-width: 0; transition: width .2s ease; }
.hp-rb-seg-housing {
  background: color-mix(in srgb, var(--brand) 70%, #38bdf8);
}
.hp-rb-seg-fixed {
  background: color-mix(in srgb, #64748b 70%, var(--brand));
}
.hp-rb-seg-save {
  background: color-mix(in srgb, #22c55e 65%, var(--brand));
}
.hp-rb-seg-free {
  background: color-mix(in srgb, var(--border) 90%, #e2e8f0);
}
.hp-rb-legend {
  list-style: none;
  margin: .4rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .45rem 1rem;
  font-size: .82rem;
}
.hp-rb-dot {
  display: inline-block;
  width: .65rem;
  height: .65rem;
  border-radius: 3px;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-rb-scen,
.hp-rb-cash,
.hp-rb-objcheck,
.hp-rb-tips,
.hp-rb-commit {
  margin: .7rem 0;
  padding: .55rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev));
}
.hp-rb-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .82rem;
}
.hp-rb-table th,
.hp-rb-table td {
  text-align: left;
  padding: .3rem .25rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  font-variant-numeric: tabular-nums;
}
.hp-rb-table thead th {
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: color-mix(in srgb, var(--text) 70%, transparent);
}
.hp-rb-tr-strong {
  font-weight: 700;
  background: color-mix(in srgb, var(--brand) 8%, transparent);
}
.hp-rb-cash-num {
  font-size: 1.25rem;
  margin: .1rem 0 .35rem;
}
.hp-rb-tip-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  line-height: 1.4;
}
.hp-rb-tip-list li { margin: .25rem 0; }
.hp-rb-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .76rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 7.5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .5rem .6rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-rb-privacy {
  margin-top: .85rem;
  font-size: .84rem;
}
.hp-rb-privacy summary { cursor: pointer; font-weight: 600; }
.hp-rb-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-rb-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rb-faq details p { margin: .35rem 0 .15rem; }
.hp-rb-formula {
  margin: .55rem 0;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
}
.hp-rb-formula-line {
  margin: 0;
  font-size: .82rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.4;
  word-break: break-word;
}
.hp-rb-stress-panel {
  margin: .55rem 0;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev));
}
.hp-rb-stress-field .chip-sm.active,
.hp-rb-stress-field .chip-sm[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, #f59e0b 60%, transparent);
  outline-offset: 1px;
  font-weight: 700;
}
.hp-rb-probe-inline {
  margin: .55rem 0 .25rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
}
.hp-rb-probe-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  line-height: 1.4;
}
.hp-rb-probe-list li { margin: .2rem 0; }
.hp-rb-scen-row {
  cursor: pointer;
  transition: background .12s ease;
}
.hp-rb-scen-row:hover,
.hp-rb-scen-row:focus-visible {
  background: color-mix(in srgb, var(--brand) 12%, transparent);
  outline: none;
}
.hp-rb-scen-row.is-selected,
.hp-rb-scen-row.is-active-plan.is-selected {
  background: color-mix(in srgb, var(--brand) 14%, transparent);
  font-weight: 650;
}
.hp-rb-scen-row:focus-visible {
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--brand) 55%, transparent);
}
@media (max-width: 900px) {
  .hp-rb-layout { grid-template-columns: 1fr; }
  .hp-rb-panel {
    position: static;
    order: 0;
  }
  .hp-rb-main { order: 1; }
  .hp-rb-hero { grid-template-columns: 1fr auto; }
  .hp-rb-hero-copy { grid-column: 1; }
  .hp-rb-hero-mascot {
    grid-column: 2;
    width: 56px;
    height: 56px;
  }
  .hp-rb-how { order: 3; grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .hp-rb-gauges { grid-template-columns: 1fr; }
  .hp-rb-hero-mascot { display: none; }
  .hp-rb-bind-grid { grid-template-columns: 1fr; }
  .hp-rb-bind-vs { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-rb-fill,
  .hp-rb-seg,
  .hp-rb-scen-row { transition: none; }
}

.hp-rb-bench {
  margin: 0 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 6%, var(--bg-elev));
}
.hp-rb-persons-panel,
.hp-rb-raise-panel,
.hp-rb-cur,
.hp-rb-ab {
  margin: .55rem 0;
  padding: .55rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 30%, var(--bg-elev));
}
.hp-rb-objb {
  border-style: dashed;
}
.hp-rb-ab .small { line-height: 1.4; }
.hp-rb [data-rb-persons].active,
.hp-rb [data-rb-persons][aria-pressed="true"],
.hp-rb [data-rb-raise].active,
.hp-rb [data-rb-raise][aria-pressed="true"],
.hp-rb [data-rb-zero].active,
.hp-rb [data-rb-zero][aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  outline-offset: 1px;
  font-weight: 700;
}
.hp-rb [data-rb-bench]:focus-visible {
  outline: 2px solid color-mix(in srgb, #f59e0b 60%, transparent);
}

/* —— Overtakelse selger (sell_handover) —— */
.hp-ot-date-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-ot-date-chips .chip {
  font-size: .78rem;
  padding: .2rem .45rem;
}
.hp-ot-main .form.grid-2 .hp-ot-span-2 {
  grid-column: 1 / -1;
}
.hp-ot-seeds {
  margin: .75rem 0;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-ot-seed-row {
  flex-wrap: wrap;
  gap: .35rem;
}
.hp-ot-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-ot-hero-mascot {
  border-radius: 16px;
  grid-row: 1 / span 2;
}
.hp-ot-hero-copy { min-width: 0; grid-column: 2; }
.hp-ot-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-ot-lead-bullets li { margin: .15rem 0; }
.hp-ot-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  padding: .65rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 70%, var(--brand, #0f766e) 6%);
}
.hp-ot-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-ot-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-ot-how-list li { margin: .2rem 0; }
.hp-ot-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .75rem;
}
.hp-ot-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: color-mix(in srgb, #f59e0b 22%, transparent);
  color: #92400e;
}
.hp-ot-demo-note {
  margin: -.35rem 0 .85rem;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: color-mix(in srgb, #f59e0b 12%, transparent);
}
.hp-ot-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.9fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-ot-layout { grid-template-columns: 1fr; }
  .hp-ot-hero { grid-template-columns: auto 1fr; }
}
.hp-ot-section {
  margin: 1.1rem 0 .55rem;
  font-size: 1.05rem;
}
.hp-ot-main .hp-ot-section:first-child { margin-top: 0; }
.hp-ot-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .65rem;
}
.hp-ot-tab.is-on,
.hp-ot-tab[aria-selected="true"] {
  background: color-mix(in srgb, var(--brand, #0f766e) 18%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  font-weight: 700;
}
.hp-ot-tab-pct {
  margin-left: .25rem;
  font-size: .78rem;
  opacity: .85;
  font-weight: 650;
}
.hp-ot-phase { margin-bottom: .5rem; }
.hp-ot-phase-help { margin: 0 0 .55rem; }
.hp-ot-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .45rem;
}
.hp-ot-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: var(--bg-elev, #fff);
  transition: border-color .15s, background .15s;
}
.hp-ot-row.is-critical {
  border-left: 3px solid color-mix(in srgb, #dc2626 70%, var(--border));
}
.hp-ot-row.is-gap {
  background: color-mix(in srgb, #fef2f2 80%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #dc2626 35%, var(--border));
}
.hp-ot-row.is-ok {
  background: color-mix(in srgb, #ecfdf5 75%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #059669 30%, var(--border));
}
.hp-ot-row.is-doing {
  background: color-mix(in srgb, #fffbeb 70%, var(--bg-elev, #fff));
}
.hp-ot-row.is-na {
  opacity: .72;
}
.hp-ot-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-ot-label {
  flex: 1 1 12rem;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  align-items: center;
}
.hp-ot-crit-badge {
  display: inline-block;
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .12rem .35rem;
  border-radius: 5px;
  background: color-mix(in srgb, #dc2626 16%, transparent);
  color: #991b1b;
}
.hp-ot-status-wrap { flex: 0 0 auto; }
.hp-ot-status {
  min-width: 8.5rem;
  font-size: .88rem;
}
.hp-ot-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
}
.hp-ot-due {
  display: block;
  width: 100%;
  margin-top: .15rem;
  font-size: .78rem;
}
.hp-ot-due.is-soon {
  color: #b45309;
  font-weight: 650;
}
.hp-ot-due.is-overdue {
  color: #b91c1c;
  font-weight: 700;
}
.hp-ot-row.is-due-soon {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
}
.hp-ot-row.is-overdue {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #dc2626 18%, transparent);
}
.hp-ot-row.is-home-hidden {
  display: none !important;
}
.hp-ot-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .5rem;
}
.hp-ot-filter.is-on {
  background: color-mix(in srgb, var(--brand, #0f766e) 16%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  font-weight: 700;
}
.hp-ot-filter-n {
  font-size: .75rem;
  font-weight: 650;
  opacity: .85;
  margin-left: .15rem;
}
.hp-ot-filter-count {
  margin: 0 0 .35rem;
}
.hp-ot-filter-empty {
  margin: 0 0 .55rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px dashed var(--border);
  background: color-mix(in srgb, var(--bg) 50%, transparent);
}
.hp-ot-meter-hint {
  margin: .15rem 0 .65rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, transparent);
}
.hp-ot-pack {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
  gap: .35rem .65rem;
}
.hp-ot-pack.is-flash,
.hp-ot-row.is-flash {
  animation: hp-ot-flash 1.1s ease;
}
@keyframes hp-ot-flash {
  0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--brand, #0f766e) 45%, transparent); }
  35% { box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand, #0f766e) 35%, transparent); }
  100% { box-shadow: 0 0 0 0 transparent; }
}
.hp-ot-pack-item {
  margin: 0;
}
.hp-ot-pack-label {
  display: flex;
  gap: .45rem;
  align-items: flex-start;
  font-size: .88rem;
  cursor: pointer;
  padding: .35rem .45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-ot-pack-label:has(input:checked) {
  border-color: color-mix(in srgb, #059669 40%, var(--border));
  background: color-mix(in srgb, #ecfdf5 70%, var(--bg-elev, #fff));
}
.hp-ot-pack-label input {
  margin-top: .15rem;
  flex: 0 0 auto;
}
.hp-ot-phase-suggest {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: center;
  margin: 0 0 .65rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #fffbeb 80%, transparent);
  font-size: .86rem;
}
.hp-ot-phase-suggest [data-ot-phase-suggest-text] {
  flex: 1 1 12rem;
  min-width: 0;
}
.hp-ot-next {
  margin-bottom: .75rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-ot-next-ol {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-ot-next-ol li { margin: .2rem 0; }
.hp-ot-jump {
  display: inline;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--brand, #0f766e) 45%, transparent);
  text-underline-offset: 2px;
}
.hp-ot-jump:hover,
.hp-ot-jump:focus-visible {
  color: var(--brand, #0f766e);
  outline: none;
}
.hp-ot-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .9rem 1rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--brand, #0f766e) 4%);
}
.hp-ot-countdown {
  display: grid;
  gap: .1rem;
  margin-bottom: .75rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-ot-countdown strong {
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.hp-ot-countdown.is-ok {
  border-color: color-mix(in srgb, #059669 35%, var(--border));
  background: color-mix(in srgb, #ecfdf5 70%, transparent);
}
.hp-ot-countdown.is-soon {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #fffbeb 75%, transparent);
}
.hp-ot-countdown.is-today {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #fef2f2 80%, transparent);
}
.hp-ot-countdown.is-past {
  border-color: color-mix(in srgb, #6366f1 35%, var(--border));
  background: color-mix(in srgb, #eef2ff 75%, transparent);
}
.hp-ot-timeline {
  margin-bottom: .75rem;
  padding: .5rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-ot-timeline-track {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem .15rem;
  align-items: stretch;
}
.hp-ot-tl-node {
  flex: 1 1 4.2rem;
  min-width: 3.6rem;
  max-width: 5.5rem;
  display: grid;
  gap: .05rem;
  padding: .3rem .28rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 90%, transparent);
  cursor: pointer;
  font: inherit;
  color: inherit;
  text-align: center;
}
.hp-ot-tl-node:hover,
.hp-ot-tl-node:focus-visible {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  outline: none;
}
.hp-ot-tl-lab {
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .02em;
}
.hp-ot-tl-date {
  font-size: .65rem;
  opacity: .8;
}
.hp-ot-tl-open {
  font-size: .65rem;
  font-weight: 750;
  color: #b45309;
}
.hp-ot-tl-node.is-today {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #fef2f2 85%, transparent);
}
.hp-ot-tl-node.is-soon {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #fffbeb 85%, transparent);
}
.hp-ot-tl-node.is-past {
  opacity: .78;
}
.hp-ot-tl-node.has-open {
  box-shadow: inset 0 -2px 0 color-mix(in srgb, #f59e0b 70%, transparent);
}
.hp-ot-tl-line {
  display: none;
}
.hp-ot-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .75rem;
}
.hp-ot-gauge {
  display: grid;
  gap: .1rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-ot-gauge strong {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.hp-ot-bars { display: grid; gap: .4rem; margin-bottom: .85rem; }
.hp-ot-bar-row {
  display: grid;
  grid-template-columns: 7.5rem 1fr;
  gap: .45rem;
  align-items: center;
}
.hp-ot-bar {
  height: .55rem;
  border-radius: 99px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  overflow: hidden;
}
.hp-ot-bar-fill {
  display: block;
  height: 100%;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--brand, #0f766e), color-mix(in srgb, var(--brand, #0f766e) 60%, #34d399));
  transition: width .2s ease;
}
.hp-ot-readiness {
  margin-bottom: .75rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}
.hp-ot-readiness.is-ok {
  border-color: color-mix(in srgb, #059669 40%, var(--border));
  background: color-mix(in srgb, #ecfdf5 75%, transparent);
}
.hp-ot-readiness.is-mid {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #fffbeb 75%, transparent);
}
.hp-ot-readiness.is-tight {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #fef2f2 80%, transparent);
}
.hp-ot-ready-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .95rem;
}
.hp-ot-critical-box {
  margin-bottom: .75rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #dc2626 35%, var(--border));
  background: color-mix(in srgb, #fef2f2 70%, transparent);
}
.hp-ot-critical-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-ot-critical-ul li { margin: .15rem 0; }
.hp-ot-snapshot {
  margin-bottom: .75rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px dashed var(--border);
}
.hp-ot-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 10rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-ot-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-ot-temp {
  display: grid;
  gap: .1rem;
  margin-bottom: .65rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-ot-temp strong {
  font-size: 1.2rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.hp-ot-temp.is-ok {
  border-color: color-mix(in srgb, #059669 40%, var(--border));
  background: color-mix(in srgb, #ecfdf5 75%, transparent);
}
.hp-ot-temp.is-mid {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #fffbeb 75%, transparent);
}
.hp-ot-temp.is-tight {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #fef2f2 80%, transparent);
}
.hp-ot-key-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-top: .35rem;
}
.hp-ot-key-chip {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  cursor: pointer;
  user-select: none;
  font-size: .78rem;
  margin: 0;
}
.hp-ot-key-chip input {
  margin: 0;
}
.hp-ot-key-chip:has(input:checked) {
  background: color-mix(in srgb, var(--brand, #0f766e) 16%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  font-weight: 700;
}
.hp-ot-main-actions {
  margin-top: .85rem;
}
.hp-ot-privacy {
  padding: .55rem .7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, transparent);
  font-size: .86rem;
}
.hp-ot-privacy summary {
  cursor: pointer;
  font-weight: 650;
}
.hp-ot-privacy p { margin: .35rem 0 0; }
.hp-ot-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-ot-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-ot-faq details p { margin: .35rem 0 .15rem; }
.hp-ot-panel {
  max-height: calc(100vh - 1.5rem);
  overflow: auto;
}
.hp-ot-global-hull {
  margin: .65rem 0;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-ot-global-ul {
  list-style: none;
  margin: .35rem 0 0;
  padding: 0;
  display: grid;
  gap: .25rem;
}
.hp-ot-global-ul li { margin: 0; }
.hp-ot-dagd-card {
  margin: .65rem 0;
  padding: .6rem .7rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 7%, var(--bg, #fff));
}
.hp-ot-dagd-card-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .35rem;
  margin-bottom: .4rem;
}
.hp-ot-dagd-card-body {
  display: grid;
  gap: .2rem;
}
.hp-ot-dagd-line {
  margin: 0;
  font-size: .86rem;
  line-height: 1.35;
}
.hp-ot-avvik {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .65rem;
  background: var(--bg-elev, #fff);
}
.hp-ot-avvik-head {
  display: none;
  grid-template-columns: minmax(5rem, 0.35fr) minmax(0, 1fr) 2rem;
  gap: .35rem;
  font-size: .75rem;
  font-weight: 700;
  opacity: .75;
  margin-bottom: .25rem;
}
@media (min-width: 640px) {
  .hp-ot-avvik-head { display: grid; }
}
.hp-ot-avvik-rows {
  display: grid;
  gap: .4rem;
}
.hp-ot-avvik-row {
  display: grid;
  grid-template-columns: minmax(5rem, 0.35fr) minmax(0, 1fr) 2rem;
  gap: .35rem;
  align-items: center;
}
@media (max-width: 560px) {
  .hp-ot-avvik-row {
    grid-template-columns: 1fr 2rem;
    grid-template-rows: auto auto;
  }
  .hp-ot-avvik-row .hp-ot-avvik-room { grid-column: 1 / -1; }
  .hp-ot-avvik-row .hp-ot-avvik-desc { grid-column: 1; }
  .hp-ot-avvik-row .hp-ot-avvik-del { grid-column: 2; grid-row: 2; }
}
.hp-ot-avvik-room,
.hp-ot-avvik-desc {
  width: 100%;
  font-size: .86rem;
  min-width: 0;
}
.hp-ot-avvik-del {
  min-width: 2rem;
  padding: .15rem .35rem;
  line-height: 1;
  font-size: 1.1rem;
}
.hp-ot-sticky {
  display: none;
}
@media (max-width: 900px) {
  .hp-ot {
    padding-bottom: 4.25rem;
  }
  .hp-ot-sticky:not([hidden]) {
    display: flex;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    gap: .55rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: .55rem .75rem calc(.55rem + env(safe-area-inset-bottom, 0));
    border-top: 1px solid var(--border);
    background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--brand, #0f766e) 6%);
    box-shadow: 0 -6px 20px color-mix(in srgb, #0f172a 12%, transparent);
  }
  .hp-ot-sticky-main {
    display: grid;
    gap: .05rem;
    min-width: 0;
  }
  .hp-ot-sticky-main strong {
    font-size: .95rem;
    font-weight: 800;
  }
  .hp-ot-sticky-main strong.is-ok { color: #065f46; }
  .hp-ot-sticky-main strong.is-mid { color: #92400e; }
  .hp-ot-sticky-main strong.is-tight { color: #991b1b; }
  .hp-ot-sticky-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .3rem;
  }
}
@media (max-width: 560px) {
  .hp-ot-panel { position: static; max-height: none; }
  .hp-ot-bar-row { grid-template-columns: 1fr; gap: .2rem; }
  .hp-ot-gauges { grid-template-columns: 1fr; }
  .hp-ot-status { min-width: 100%; width: 100%; }
  .hp-ot-row-top { flex-direction: column; }
  .hp-ot-pack { grid-template-columns: 1fr; }
  .hp-ot-tl-node { max-width: none; }
  .hp-ot-key-chips { gap: .3rem; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-ot-pack.is-flash,
  .hp-ot-row.is-flash {
    animation: none;
  }
}


/* —— Risiko-flagg bolig (buy-risiko-flagg) —— */
.hp-rf { display: grid; gap: 1rem; }
.hp-rf-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  padding: .85rem 1rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--card, #fff) 88%, #fee2e2);
}
.hp-rf-hero-mascot {
  border-radius: 14px;
  object-fit: cover;
}
.hp-rf-hero-copy { min-width: 0; grid-column: 2; }
.hp-rf-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-rf-lead-bullets li { margin: .15rem 0; }
.hp-rf-how {
  grid-column: 1 / -1;
  border-top: 1px dashed var(--border);
  padding-top: .5rem;
  margin-top: .15rem;
}
.hp-rf-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rf-how-list {
  margin: .35rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-rf-how-list li { margin: .2rem 0; }
.hp-rf-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
}
.hp-rf-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  padding: .1rem .4rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
  border: 1px solid #fcd34d;
}
.hp-rf-demo-note {
  margin: 0;
  padding: .4rem .65rem;
  border-radius: 10px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-rf-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .9fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-rf-layout { grid-template-columns: 1fr; }
  .hp-rf-hero { grid-template-columns: auto 1fr; }
}
.hp-rf-section {
  margin: 1rem 0 .45rem;
  font-size: 1.02rem;
  font-weight: 750;
}
.hp-rf-main .hp-rf-section:first-child { margin-top: 0; }
.hp-rf-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .65rem 0 .35rem;
}
.hp-rf-filter-bar .chip.is-on,
.hp-rf-filter-bar .chip[aria-pressed="true"] {
  background: color-mix(in srgb, var(--accent, #2563eb) 18%, var(--card, #fff));
  border-color: color-mix(in srgb, var(--accent, #2563eb) 45%, var(--border));
  font-weight: 650;
}
.hp-rf-cat {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .65rem .75rem .5rem;
  margin-bottom: .75rem;
  background: var(--card, #fff);
}
.hp-rf-cat-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .35rem;
  align-items: baseline;
}
.hp-rf-cat-title {
  margin: 0;
  font-size: .95rem;
  font-weight: 750;
}
.hp-rf-cat-help { margin: .2rem 0 .5rem; }
.hp-rf-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .45rem;
}
.hp-rf-row {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .6rem;
  background: color-mix(in srgb, var(--bg) 55%, var(--card, #fff));
  transition: border-color .15s, background .15s;
}
.hp-rf-row.is-ok { border-color: #86efac; background: #f0fdf4; }
.hp-rf-row.is-note { border-color: #fde68a; background: #fffbeb; }
.hp-rf-row.is-red { border-color: #fca5a5; background: #fef2f2; }
.hp-rf-row.is-deal { border-color: #f87171; background: #fee2e2; box-shadow: inset 3px 0 0 #dc2626; }
.hp-rf-row.is-na { opacity: .55; }
.hp-rf-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .65rem;
  justify-content: space-between;
  align-items: flex-start;
}
.hp-rf-row-label {
  flex: 1 1 12rem;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  align-items: center;
}
.hp-rf-weight-badge {
  font-size: .68rem;
  font-weight: 700;
  padding: .08rem .35rem;
  border-radius: 999px;
  background: #fee2e2;
  color: #991b1b;
  border: 1px solid #fecaca;
}
.hp-rf-status-wrap { flex: 0 0 auto; }
.hp-rf-status {
  font-size: .84rem;
  min-width: 9.5rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .28rem .4rem;
  background: var(--card, #fff);
}
.hp-rf-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .84rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .35rem .5rem;
  background: var(--card, #fff);
}
.hp-rf-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: var(--card, #fff);
  box-shadow: 0 1px 2px color-mix(in srgb, #000 6%, transparent);
}
.hp-rf-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .65rem;
}
.hp-rf-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  display: flex;
  flex-direction: column;
  gap: .08rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--card, #fff));
}
.hp-rf-gauge-wide { grid-column: 1 / -1; }
.hp-rf-gauge strong {
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.hp-rf-tempbar {
  height: 10px;
  border-radius: 999px;
  background: #e5e7eb;
  overflow: hidden;
  margin: 0 0 .75rem;
  border: 1px solid var(--border);
}
.hp-rf-tempfill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #86efac, #fde68a, #fca5a5, #ef4444);
  transition: width .25s ease;
}
.hp-rf-tempbar.is-ok .hp-rf-tempfill { background: #4ade80; }
.hp-rf-tempbar.is-mid .hp-rf-tempfill { background: #fbbf24; }
.hp-rf-tempbar.is-warm .hp-rf-tempfill { background: #fb923c; }
.hp-rf-tempbar.is-hot .hp-rf-tempfill { background: #f87171; }
.hp-rf-tempbar.is-deal .hp-rf-tempfill { background: #dc2626; }
.hp-rf-tempbar.is-unknown .hp-rf-tempfill { background: #94a3b8; }
.hp-rf-readiness {
  border-radius: 12px;
  padding: .65rem .75rem;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-rf-readiness.is-ok { border-color: #86efac; background: #f0fdf4; }
.hp-rf-readiness.is-mid { border-color: #fde68a; background: #fffbeb; }
.hp-rf-readiness.is-warm { border-color: #fdba74; background: #fff7ed; }
.hp-rf-readiness.is-hot,
.hp-rf-readiness.is-deal { border-color: #fca5a5; background: #fef2f2; }
.hp-rf-readiness.is-unknown { border-color: #cbd5e1; background: #f8fafc; }
.hp-rf-ready-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-rf-counts {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-bottom: .75rem;
}
.hp-rf-pill {
  font-size: .75rem;
  font-weight: 650;
  padding: .2rem .45rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg, #f8fafc);
}
.hp-rf-pill-ok { background: #f0fdf4; border-color: #86efac; color: #166534; }
.hp-rf-pill-note { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.hp-rf-pill-red { background: #fef2f2; border-color: #fca5a5; color: #991b1b; }
.hp-rf-pill-deal { background: #fee2e2; border-color: #f87171; color: #7f1d1d; }
.hp-rf-pill-open { background: #f1f5f9; border-color: #cbd5e1; color: #334155; }
.hp-rf-warn {
  border: 1px solid #fecaca;
  background: #fff1f2;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-rf-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-rf-warn-ul li { margin: .15rem 0; }
.hp-rf-subh {
  margin: .85rem 0 .35rem;
  font-size: .9rem;
  font-weight: 750;
}
.hp-rf-qlist {
  margin: 0 0 .5rem;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-rf-qlist li { margin: .25rem 0; }
.hp-rf-summary {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 11rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-rf-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-rf-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-rf-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rf-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-rf-panel { position: static; }
  .hp-rf-gauges { grid-template-columns: 1fr; }
  .hp-rf-status { min-width: 100%; }
}


/* —— Boliginfo-pakke (sell-boliginfo-pakke / engine boliginfo) —— */
.hp-bi-deadline-field {
  display: flex;
  flex-direction: column;
  gap: .3rem;
  min-width: 0;
}
.hp-bi-dl-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .15rem;
}
.hp-bi-presets {
  margin: .75rem 0 .85rem;
  padding: .55rem .7rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--bg-elev, #fff) 75%, var(--bg));
}
.hp-bi-preset-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem .4rem;
  margin: .3rem 0;
}
.hp-bi-preset-row .chip {
  cursor: pointer;
}
.hp-bi-seed-actions {
  gap: .35rem;
}
.hp-bi-global-gaps {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .65rem;
  margin-bottom: .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
  max-height: 14rem;
  overflow: auto;
}
.hp-bi-global-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-bi-global-ul li {
  margin: .18rem 0;
}
.hp-bi-global-ul li.is-crit {
  font-weight: 600;
}
.hp-bi-ready-text {
  width: 100%;
  margin-top: .4rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .74rem;
  line-height: 1.35;
  resize: vertical;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .4rem .5rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-bi-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-bi-hero-mascot {
  border-radius: 14px;
  background: color-mix(in srgb, var(--accent, #0d9488) 12%, transparent);
}
.hp-bi-hero-copy { min-width: 0; grid-column: 2; }
.hp-bi-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-bi-lead-bullets li { margin: .15rem 0; }
.hp-bi-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 80%, var(--bg));
}
.hp-bi-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-bi-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-bi-how-list li { margin: .2rem 0; }
.hp-bi-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: .35rem 0 .75rem;
}
.hp-bi-demo-badge {
  display: inline-block;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: color-mix(in srgb, #f59e0b 22%, transparent);
  color: color-mix(in srgb, #b45309 80%, var(--text));
}
.hp-bi-demo-note {
  margin: 0 0 .75rem;
  padding: .4rem .6rem;
  border-radius: 8px;
  border-left: 3px solid #f59e0b;
  background: color-mix(in srgb, #f59e0b 10%, transparent);
}
.hp-bi-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .9fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-bi-layout { grid-template-columns: 1fr; }
  .hp-bi-hero { grid-template-columns: auto 1fr; }
}
.hp-bi-section {
  font-size: 1rem;
  font-weight: 750;
  margin: 1rem 0 .45rem;
}
.hp-bi-main .hp-bi-section:first-child { margin-top: 0; }
.hp-bi-cat-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: .35rem 0 .65rem;
}
.hp-bi-tab.is-on,
.hp-bi-tab[aria-selected="true"] {
  background: color-mix(in srgb, var(--accent, #0d9488) 18%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--accent, #0d9488) 45%, var(--border));
  font-weight: 700;
}
.hp-bi-tab-pct {
  margin-left: .25rem;
  font-size: .75rem;
  opacity: .85;
  font-weight: 650;
}
.hp-bi-tab-gaps {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.15rem;
  height: 1.15rem;
  margin-left: .2rem;
  padding: 0 .28rem;
  border-radius: 999px;
  font-size: .68rem;
  font-weight: 800;
  line-height: 1;
  background: color-mix(in srgb, #ef4444 22%, transparent);
  color: color-mix(in srgb, #b91c1c 85%, var(--text));
}
.hp-bi-buyer-q {
  margin: .75rem 0 .85rem;
  padding: .55rem .7rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--bg-elev, #fff) 75%, var(--bg));
}
.hp-bi-buyer-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
}
.hp-bi-buyer-chip.is-filled {
  border-color: color-mix(in srgb, #22c55e 45%, var(--border));
  background: color-mix(in srgb, #22c55e 12%, var(--bg-elev, #fff));
}
.hp-bi-buyer-chip.is-gap {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev, #fff));
}
.hp-bi-buyer-chip.is-hidden-type {
  display: none !important;
}
.hp-bi-temp {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 85%, transparent);
  overflow: hidden;
  margin-bottom: .15rem;
}
.hp-bi-temp-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #ef4444, #f59e0b, #22c55e);
  transition: width .25s ease;
}
.hp-bi-temp.is-tight .hp-bi-temp-fill {
  background: linear-gradient(90deg, #ef4444, #f97316);
}
.hp-bi-temp.is-mid .hp-bi-temp-fill {
  background: linear-gradient(90deg, #f59e0b, #eab308);
}
.hp-bi-temp.is-ok .hp-bi-temp-fill {
  background: linear-gradient(90deg, #22c55e, #16a34a);
}
.hp-bi-temp-label {
  font-size: .78rem;
}
.hp-bi-empty-klar-warn {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .65rem;
  margin: 0 0 .65rem;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, transparent);
}
.hp-bi-hop-row {
  gap: .35rem;
}
.hp-bi-row.is-empty-klar {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev, #fff));
  box-shadow: inset 3px 0 0 color-mix(in srgb, #f59e0b 70%, transparent);
}
.hp-bi-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .35rem;
}
.hp-bi-filter.is-on,
.hp-bi-filter[aria-pressed="true"] {
  background: color-mix(in srgb, var(--accent, #0d9488) 18%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--accent, #0d9488) 45%, var(--border));
  font-weight: 700;
}
.hp-bi-filter-count {
  margin: 0 0 .55rem;
  min-height: 1.1em;
}
.hp-bi-cat { margin-bottom: .5rem; }
.hp-bi-cat-help { margin: 0 0 .55rem; }
.hp-bi-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-bi-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 70%, var(--bg));
  transition: box-shadow .2s ease, border-color .2s ease, background .15s ease;
}
.hp-bi-row.is-critical {
  border-color: color-mix(in srgb, #f59e0b 35%, var(--border));
}
.hp-bi-row.is-gap {
  border-color: color-mix(in srgb, #ef4444 45%, var(--border));
  background: color-mix(in srgb, #ef4444 6%, var(--bg-elev, #fff));
}
.hp-bi-row.is-ok {
  border-color: color-mix(in srgb, #22c55e 35%, var(--border));
}
.hp-bi-row.is-na {
  opacity: .72;
}
.hp-bi-row.is-home-hidden {
  display: none !important;
}
.hp-bi-row.is-flash {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent, #0d9488) 45%, transparent);
  border-color: color-mix(in srgb, var(--accent, #0d9488) 55%, var(--border));
}
.hp-bi-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: center;
  justify-content: space-between;
  margin-bottom: .35rem;
}
.hp-bi-label {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem;
  min-width: 0;
  flex: 1 1 12rem;
}
.hp-bi-crit-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .35rem;
  border-radius: 6px;
  background: color-mix(in srgb, #f59e0b 20%, transparent);
  color: color-mix(in srgb, #b45309 85%, var(--text));
}
.hp-bi-status-cluster {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .5rem;
  flex: 0 1 auto;
  justify-content: flex-end;
}
.hp-bi-quick {
  display: inline-flex;
  gap: .2rem;
}
.hp-bi-qbtn {
  appearance: none;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
  color: inherit;
  font: inherit;
  font-size: .72rem;
  font-weight: 700;
  padding: .15rem .4rem;
  border-radius: 6px;
  cursor: pointer;
  line-height: 1.2;
}
.hp-bi-qbtn:hover,
.hp-bi-qbtn:focus-visible {
  border-color: color-mix(in srgb, var(--accent, #0d9488) 50%, var(--border));
  outline: none;
}
.hp-bi-qbtn.is-on {
  background: color-mix(in srgb, var(--accent, #0d9488) 22%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--accent, #0d9488) 50%, var(--border));
  color: color-mix(in srgb, var(--accent, #0d9488) 80%, var(--text));
}
.hp-bi-status-wrap { flex: 0 0 auto; }
.hp-bi-status {
  min-width: 8.5rem;
  font-size: .88rem;
}
.hp-bi-val,
.hp-bi-note {
  width: 100%;
  margin-top: .25rem;
  font-size: .88rem;
}
.hp-bi-note {
  opacity: .92;
  border-style: dashed;
}
.hp-bi-row.is-work {
  border-color: color-mix(in srgb, #f59e0b 30%, var(--border));
}
.hp-bi-cat-suggest {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .65rem;
  margin: 0 0 .55rem;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--accent, #0d9488) 35%, var(--border));
  background: color-mix(in srgb, var(--accent, #0d9488) 8%, transparent);
  font-size: .86rem;
}
.hp-bi-filter-n {
  display: inline-block;
  min-width: 1.1em;
  margin-left: .15rem;
  font-size: .72rem;
  font-weight: 800;
  opacity: .9;
}
.hp-bi-seeds {
  margin-top: 1rem;
  padding: .65rem .75rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--bg-elev, #fff) 70%, var(--bg));
}
.hp-bi-seed-links {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
}
.hp-bi-seed-links .chip {
  text-decoration: none;
}
.hp-bi-seed-hint {
  margin: .45rem 0 0;
  padding: .35rem .5rem;
  border-radius: 8px;
  border-left: 3px solid var(--accent, #0d9488);
  background: color-mix(in srgb, var(--accent, #0d9488) 8%, transparent);
}
.hp-bi-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--bg));
}
.hp-bi-deadline-pill {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .25rem .5rem;
  margin-bottom: .65rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-bi-deadline-pill.is-soon {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, transparent);
}
.hp-bi-deadline-pill.is-past {
  border-color: color-mix(in srgb, #ef4444 40%, var(--border));
  background: color-mix(in srgb, #ef4444 8%, transparent);
}
.hp-bi-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .75rem;
}
.hp-bi-gauge {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .55rem;
  display: grid;
  gap: .1rem;
}
.hp-bi-gauge strong {
  font-size: 1.25rem;
  font-weight: 800;
}
.hp-bi-gauge-crit.is-ok {
  border-color: color-mix(in srgb, #22c55e 40%, var(--border));
  background: color-mix(in srgb, #22c55e 8%, transparent);
}
.hp-bi-gauge-crit.is-tight {
  border-color: color-mix(in srgb, #ef4444 40%, var(--border));
  background: color-mix(in srgb, #ef4444 7%, transparent);
}
.hp-bi-bars { display: grid; gap: .4rem; margin-bottom: .85rem; }
.hp-bi-bar-row {
  display: grid;
  grid-template-columns: minmax(0, 7.5rem) 1fr;
  gap: .4rem;
  align-items: center;
}
.hp-bi-bar-label {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  padding: 0;
  margin: 0;
  cursor: pointer;
  text-align: left;
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: 2px;
}
.hp-bi-bar-label:hover,
.hp-bi-bar-label:focus-visible {
  text-decoration-color: color-mix(in srgb, var(--accent, #0d9488) 55%, transparent);
  color: var(--accent, #0d9488);
  outline: none;
}
.hp-bi-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  overflow: hidden;
}
.hp-bi-bar-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, color-mix(in srgb, var(--accent, #0d9488) 70%, #22c55e), var(--accent, #0d9488));
  transition: width .2s ease;
}
.hp-bi-readiness {
  border-radius: 10px;
  padding: .55rem .65rem;
  margin-bottom: .65rem;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-bi-readiness.is-ok {
  border-color: color-mix(in srgb, #22c55e 40%, var(--border));
  background: color-mix(in srgb, #22c55e 10%, var(--bg-elev, #fff));
}
.hp-bi-readiness.is-mid {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev, #fff));
}
.hp-bi-readiness.is-tight {
  border-color: color-mix(in srgb, #ef4444 40%, var(--border));
  background: color-mix(in srgb, #ef4444 8%, var(--bg-elev, #fff));
}
.hp-bi-ready-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .95rem;
}
.hp-bi-next-box {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .65rem;
  margin-bottom: .65rem;
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev, #fff));
}
.hp-bi-next-list {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-bi-next-list li { margin: .2rem 0; }
.hp-bi-critical-box {
  border: 1px solid color-mix(in srgb, #ef4444 35%, var(--border));
  border-radius: 10px;
  padding: .5rem .65rem;
  margin-bottom: .65rem;
  background: color-mix(in srgb, #ef4444 6%, transparent);
}
.hp-bi-critical-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-bi-critical-ul li { margin: .15rem 0; }
.hp-bi-jump {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  padding: 0;
  margin: 0;
  cursor: pointer;
  text-align: left;
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--accent, #0d9488) 50%, transparent);
  text-underline-offset: 2px;
}
.hp-bi-jump:hover,
.hp-bi-jump:focus-visible {
  color: var(--accent, #0d9488);
  outline: none;
}
.hp-bi-request-box {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .65rem;
  margin-bottom: .65rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 70%, var(--bg));
}
.hp-bi-request {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .74rem;
  line-height: 1.35;
  resize: vertical;
  min-height: 5.5rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .45rem .55rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-bi-sheet {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .76rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 12rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-bi-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-bi-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-bi-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-bi-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-bi-panel { position: static; }
  .hp-bi-bar-row { grid-template-columns: 1fr; gap: .2rem; }
  .hp-bi-gauges { grid-template-columns: 1fr; }
  .hp-bi-status { min-width: 100%; width: 100%; }
  .hp-bi-row-top { flex-direction: column; align-items: stretch; }
  .hp-bi-hop-row .btn { flex: 1 1 auto; }
}

/* Boliginfo-pakke upgrades: phase, talk, SMS, vdag, search, mobile bar, print */
.hp-bi-search-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  margin: .35rem 0 .55rem;
}
.hp-bi-search {
  flex: 1 1 12rem;
  min-width: 0;
  padding: .45rem .6rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-elev, #fff);
  font: inherit;
}
.hp-bi-gauge-phase.is-ok {
  border-color: color-mix(in srgb, #22c55e 45%, var(--border));
  background: color-mix(in srgb, #22c55e 8%, transparent);
}
.hp-bi-gauge-phase.is-tight {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, transparent);
}
.hp-bi-phase-box {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .65rem;
  margin-bottom: .65rem;
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev, #fff));
  max-height: 12rem;
  overflow: auto;
}
.hp-bi-phase-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-bi-phase-ul li { margin: .15rem 0; }
.hp-bi-phase-ul li.is-crit { font-weight: 600; }
.hp-bi-sms-box,
.hp-bi-talk {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .65rem;
  margin-bottom: .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-bi-sms,
.hp-bi-talk-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.35;
  resize: vertical;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .4rem .5rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-bi-vdag {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .65rem;
  margin-bottom: .65rem;
  background: color-mix(in srgb, var(--accent, #0d9488) 5%, var(--bg-elev, #fff));
  max-height: 16rem;
  overflow: auto;
}
.hp-bi-vdag-ul {
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: .84rem;
}
.hp-bi-vdag-ul li {
  margin: 0;
  padding: .28rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-bi-vdag-ul li:last-child { border-bottom: 0; }
.hp-bi-vdag-ul li.is-ok { opacity: .92; }
.hp-bi-vdag-ul li.is-gap {
  background: color-mix(in srgb, #f59e0b 8%, transparent);
  margin: 0 -.35rem;
  padding-left: .35rem;
  padding-right: .35rem;
  border-radius: 6px;
}
.hp-bi-vdag-mark {
  display: inline-block;
  min-width: 1.1rem;
  width: 1.1rem;
  font-weight: 800;
  color: color-mix(in srgb, #16a34a 80%, var(--text));
}
.hp-bi-vdag-ul li.is-gap .hp-bi-vdag-mark {
  color: color-mix(in srgb, #d97706 85%, var(--text));
}
.hp-bi-mobile-bar {
  display: none;
}
@media (max-width: 900px) {
  .hp-bi-mobile-bar {
    display: block;
    position: sticky;
    bottom: 0;
    z-index: 40;
    margin: 0 -0.25rem;
    padding: .45rem .55rem calc(.45rem + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--border);
    background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--bg));
    box-shadow: 0 -6px 18px color-mix(in srgb, #000 8%, transparent);
  }
  .hp-bi-mobile-bar[hidden] { display: none !important; }
  .hp-bi-mobile-bar-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .4rem .55rem;
  }
  .hp-bi-mobile-bar-nums {
    display: flex;
    flex-direction: column;
    min-width: 4.5rem;
    flex: 1 1 auto;
  }
  .hp-bi-mobile-bar-num {
    font-weight: 800;
    font-size: 1.05rem;
    line-height: 1.1;
  }
  .hp-bi {
    padding-bottom: 4.5rem;
  }
}
@media print {
  .hp-bi-mobile-bar,
  .hp-bi-demos,
  .hp-bi-filters,
  .hp-bi-presets,
  .hp-bi-buyer-q,
  .hp-bi-how,
  .hp-bi-faq,
  .hp-bi-seed-actions,
  .hp-bi-hop-row { display: none !important; }
  .hp-bi-panel { position: static; box-shadow: none; }
  .hp-bi-sheet { border: 0; }
}

/* —— Kjøpstidslinje (buy_timeline) —— */
.hp-bt { display: grid; gap: 1rem; }
.hp-bt-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
}
.hp-bt-hero-mascot {
  border-radius: 14px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
.hp-bt-hero-copy { min-width: 0; grid-column: 2; }
.hp-bt-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-bt-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .75rem;
  background: var(--bg-elev);
}
.hp-bt-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-bt-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-bt-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
}
.hp-bt-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #e0e7ff;
  color: #3730a3;
  vertical-align: middle;
}
.hp-bt-demo-note {
  margin: .15rem 0 0;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
}
.hp-bt-layout {
  display: grid;
  grid-template-columns: 1fr minmax(240px, 320px);
  gap: 1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-bt-layout { grid-template-columns: 1fr; }
  .hp-bt-panel { position: static; }
}
.hp-bt-section {
  font-size: 1.02rem;
  margin: 1rem 0 .55rem;
  font-weight: 700;
}
.hp-bt-section:first-child { margin-top: 0; }
.hp-bt-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: .35rem 0 .75rem;
}
.hp-bt-tab {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}
.hp-bt-tab.is-on,
.hp-bt-tab[aria-selected="true"] {
  background: color-mix(in srgb, var(--brand) 18%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  font-weight: 700;
}
.hp-bt-tab-pct {
  font-size: .72rem;
  font-variant-numeric: tabular-nums;
  opacity: .8;
  font-weight: 700;
}
.hp-bt-phase-head {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1rem;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: .55rem;
}
.hp-bt-phase-help { margin: 0; flex: 1 1 12rem; }
.hp-bt-phase-date-lab {
  display: grid;
  gap: .2rem;
  font-size: .86rem;
}
.hp-bt-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-bt-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: var(--card, #fff);
  transition: border-color .15s, background .15s;
}
.hp-bt-row.is-critical { border-left: 3px solid #d97706; }
.hp-bt-row.is-gap {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-bt-row.is-ok {
  border-color: #86efac;
  background: #f7fdf9;
}
.hp-bt-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
}
.hp-bt-on {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  flex: 1 1 12rem;
  min-width: 0;
  cursor: pointer;
}
.hp-bt-on input { margin-top: .2rem; flex: 0 0 auto; }
.hp-bt-label {
  font-size: .92rem;
  font-weight: 600;
  line-height: 1.35;
  min-width: 0;
}
.hp-bt-crit-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #ffedd5;
  color: #9a3412;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-bt-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
  min-height: 36px;
}
.hp-bt-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .95rem;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-bt-gauges {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .55rem;
  margin-bottom: .75rem;
}
.hp-bt-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  background: var(--card, #fff);
  display: grid;
  gap: .15rem;
}
.hp-bt-gauge strong {
  font-size: 1.25rem;
  font-variant-numeric: tabular-nums;
}
.hp-bt-bars { display: grid; gap: .4rem; margin-bottom: .85rem; }
.hp-bt-bar-row {
  display: grid;
  grid-template-columns: 8.5rem 1fr;
  gap: .45rem;
  align-items: center;
}
.hp-bt-bar {
  height: 8px;
  border-radius: 99px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-bt-bar-fill {
  display: block;
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--brand), color-mix(in srgb, var(--brand) 55%, #3aa6a0));
  border-radius: 99px;
  transition: width .2s ease;
}
.hp-bt-next {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
  background: color-mix(in srgb, var(--brand) 6%, var(--card, #fff));
}
.hp-bt-next-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-bt-warn {
  border: 1px solid #fca5a5;
  background: #fff7f7;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-bt-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-bt-schedule { margin-bottom: .75rem; }
.hp-bt-schedule-ol {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  line-height: 1.45;
}
.hp-bt-commit-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  min-height: 10rem;
}
.hp-bt-nonadvice {
  margin-top: .65rem;
  font-size: .78rem !important;
}
.hp-bt-faq details {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .7rem;
  margin: .4rem 0;
  background: var(--bg-elev);
}
.hp-bt-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-bt-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-bt-hero {
    grid-template-columns: 1fr;
  }
  .hp-bt-hero-mascot { width: 56px; height: 56px; }
  .hp-bt-hero-copy { grid-column: 1; }
  .hp-bt-gauges { grid-template-columns: 1fr; }
  .hp-bt-bar-row { grid-template-columns: 1fr; gap: .2rem; }
}
@media (min-width: 901px) {
  .hp-bt-hero {
    grid-template-columns: 72px 1fr;
  }
}
.hp-bt-links { margin: .85rem 0; }
.hp-bt-link-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .5rem;
}
.hp-bt-link-grid a {
  font-size: .8rem;
  font-weight: 650;
  padding: .25rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  text-decoration: none;
  color: inherit;
}
.hp-bt-link-grid a:hover {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}


/* —— Megler-spørsmål (megler_q / sell-megler-spoersmaal) —— */
.hp-mq { max-width: 1100px; }
.hp-mq-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-mq-hero-mascot {
  border-radius: 14px;
  object-fit: cover;
}
.hp-mq-hero-copy { min-width: 0; grid-column: 2; }
.hp-mq-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .9rem;
}
.hp-mq-lead-bullets li { margin: .15rem 0; }
.hp-mq-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 80%, var(--accent) 6%);
}
.hp-mq-how summary { cursor: pointer; font-weight: 650; font-size: .92rem; }
.hp-mq-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .88rem;
}
.hp-mq-how-list li { margin: .2rem 0; }
.hp-mq-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  margin: 0 0 .65rem;
}
.hp-mq-demo-badge {
  display: inline-block;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: #fef3c7;
  color: #92400e;
  vertical-align: middle;
}
.hp-mq-demo-note {
  margin: 0 0 .85rem;
  padding: .45rem .65rem;
  border-radius: 10px;
  border: 1px dashed #f59e0b;
  background: #fffbeb;
}
.hp-mq-layout {
  display: grid;
  grid-template-columns: 1.35fr minmax(260px, .9fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-mq-layout { grid-template-columns: 1fr; }
  .hp-mq-hero { grid-template-columns: auto 1fr; }
}
.hp-mq-section {
  margin: 1.1rem 0 .45rem;
  font-size: 1.05rem;
  font-weight: 750;
  letter-spacing: -0.01em;
}
.hp-mq-main .hp-mq-section:first-child { margin-top: 0; }
.hp-mq-brokers {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .65rem;
}
@media (max-width: 720px) {
  .hp-mq-brokers { grid-template-columns: 1fr; }
}
.hp-mq-broker {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .65rem .7rem;
  background: var(--card, #fff);
  display: flex;
  flex-direction: column;
  gap: .4rem;
}
.hp-mq-broker.is-off { opacity: .55; }
.hp-mq-broker-on {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-weight: 650;
  font-size: .9rem;
  cursor: pointer;
}
.hp-mq-fee-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: .35rem;
}
@media (max-width: 520px) {
  .hp-mq-fee-row { grid-template-columns: 1fr; }
}
.hp-mq-fee-row .hp-field input { width: 100%; font-size: .85rem; }
.hp-mq-dims {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .3rem .45rem;
  margin: .15rem 0;
}
.hp-mq-dim {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0 .35rem;
  align-items: center;
  font-size: .78rem;
}
.hp-mq-dim span { grid-column: 1 / -1; }
.hp-mq-dim input[type="range"] { width: 100%; }
.hp-mq-dim strong { font-size: .9rem; font-weight: 800; min-width: 1rem; text-align: right; }
.hp-mq-fee-live {
  margin: .15rem 0 0;
  padding: .3rem .4rem;
  border-radius: 8px;
  background: color-mix(in srgb, var(--accent) 8%, transparent);
  font-size: .78rem;
  line-height: 1.35;
}
.hp-mq-score-field {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .25rem .5rem;
  align-items: center;
}
.hp-mq-score-label { grid-column: 1 / -1; font-size: .85rem; }
.hp-mq-score-field input[type="range"] { width: 100%; }
.hp-mq-score-val {
  font-size: 1.1rem;
  font-weight: 800;
  min-width: 1.2rem;
  text-align: right;
}
.hp-mq-prep {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
  display: grid;
  gap: .35rem;
}
.hp-mq-prep li label {
  display: flex;
  align-items: flex-start;
  gap: .45rem;
  font-size: .9rem;
  cursor: pointer;
  padding: .35rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-mq-prep li input { margin-top: .2rem; }
.hp-mq-status-block {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: .25rem;
}
.hp-mq-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .2rem;
  justify-content: flex-end;
}
.hp-mq-qchip {
  font-size: .68rem;
  font-weight: 700;
  padding: .12rem .32rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
  line-height: 1.2;
  color: inherit;
}
.hp-mq-qchip.is-on {
  background: color-mix(in srgb, var(--accent) 22%, transparent);
  border-color: color-mix(in srgb, var(--accent) 50%, var(--border));
}
.hp-mq-cat-prog { font-weight: 600; }
.hp-mq-fee-box {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-mq-matrix-scroll {
  overflow-x: auto;
  max-width: 100%;
}
.hp-mq-mtx-st {
  display: inline-block;
  font-size: .65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .02em;
  padding: .05rem .28rem;
  border-radius: 4px;
  background: color-mix(in srgb, var(--border) 60%, transparent);
  margin-right: .2rem;
  vertical-align: middle;
}
.hp-mq-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .65rem;
}
.hp-mq-filters .chip.is-on,
.hp-mq-filters .chip[aria-pressed="true"] {
  background: color-mix(in srgb, var(--accent) 22%, transparent);
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  font-weight: 700;
}
.hp-mq-cat { margin-bottom: 1rem; }
.hp-mq-cat-title {
  margin: 0 0 .4rem;
  font-size: .95rem;
  font-weight: 750;
}
.hp-mq-qlist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-mq-q {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev, #fff));
}
.hp-mq-q.is-must {
  border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
}
.hp-mq-q-top {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-mq-q-label { flex: 1 1 12rem; font-size: .9rem; font-weight: 600; }
.hp-mq-must-badge {
  display: inline-block;
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: color-mix(in srgb, var(--accent) 18%, transparent);
  color: var(--accent-ink, var(--accent));
  margin-right: .25rem;
  vertical-align: middle;
}
.hp-mq-status-wrap select {
  font-size: .85rem;
  max-width: 10rem;
}
.hp-mq-q-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .35rem .5rem;
}
.hp-mq-perb {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .35rem;
  margin-top: .4rem;
}
@media (max-width: 640px) {
  .hp-mq-perb { grid-template-columns: 1fr; }
}
.hp-mq-perb-field {
  display: flex;
  flex-direction: column;
  gap: .15rem;
  font-size: .78rem;
}
.hp-mq-perb-field input {
  font-size: .82rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .3rem .4rem;
}
.hp-mq-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: var(--card, #fff);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--fg) 6%, transparent);
}
.hp-mq-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .75rem;
}
.hp-mq-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-mq-gauge strong { font-size: 1.25rem; font-weight: 800; letter-spacing: -0.02em; }
.hp-mq-bar-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: .4rem .55rem;
  align-items: center;
  margin-bottom: .75rem;
  font-size: .86rem;
}
.hp-mq-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-mq-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 75%, #22c55e), var(--accent));
  transition: width .25s ease;
}
.hp-mq-readiness {
  border-radius: 12px;
  padding: .65rem .75rem;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-mq-readiness.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-mq-readiness.is-mid {
  border-color: #fde68a;
  background: #fffbeb;
}
.hp-mq-readiness.is-tight {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-mq-ready-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-mq-gaps {
  border: 1px solid #fecaca;
  background: #fff1f2;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-mq-gaps-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-mq-gaps-ul li { margin: .15rem 0; }
.hp-mq-subh {
  margin: .85rem 0 .35rem;
  font-size: .9rem;
  font-weight: 750;
}
.hp-mq-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .82rem;
}
.hp-mq-table th,
.hp-mq-table td {
  border-bottom: 1px solid var(--border);
  padding: .35rem .3rem;
  text-align: left;
  vertical-align: top;
}
.hp-mq-table th { font-weight: 700; font-size: .78rem; color: var(--muted, #64748b); }
.hp-mq-cmp-meta {
  margin: .4rem 0 0;
  padding-left: 1.1rem;
}
.hp-mq-agenda {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 10rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-mq-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-mq-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-mq-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-mq-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-mq-panel { position: static; }
  .hp-mq-gauges { grid-template-columns: 1fr; }
}

/* —— Håndverker-spørsmål (handverker_q / remodel-handverker-spoersmaal) —— */
.hp-hv { max-width: 1100px; }
.hp-hv-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-hv-hero-mascot {
  border-radius: 14px;
  object-fit: cover;
}
.hp-hv-hero-copy { min-width: 0; grid-column: 2; }
.hp-hv-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .9rem;
}
.hp-hv-lead-bullets li { margin: .15rem 0; }
.hp-hv-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 80%, var(--accent) 6%);
}
.hp-hv-how summary { cursor: pointer; font-weight: 650; font-size: .92rem; }
.hp-hv-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .88rem;
}
.hp-hv-how-list li { margin: .2rem 0; }
.hp-hv-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  margin: 0 0 .65rem;
}
.hp-hv-demo-badge {
  display: inline-block;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: #fef3c7;
  color: #92400e;
  vertical-align: middle;
}
.hp-hv-demo-note {
  margin: 0 0 .85rem;
  padding: .45rem .65rem;
  border-radius: 10px;
  border: 1px dashed #f59e0b;
  background: #fffbeb;
}
.hp-hv-layout {
  display: grid;
  grid-template-columns: 1.35fr minmax(260px, .9fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-hv-layout { grid-template-columns: 1fr; }
  .hp-hv-hero { grid-template-columns: auto 1fr; }
}
.hp-hv-section {
  margin: 1.1rem 0 .45rem;
  font-size: 1.05rem;
  font-weight: 750;
  letter-spacing: -0.01em;
}
.hp-hv-main .hp-hv-section:first-child { margin-top: 0; }
.hp-hv-brokers {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .65rem;
}
@media (max-width: 720px) {
  .hp-hv-brokers { grid-template-columns: 1fr; }
}
.hp-hv-broker {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .65rem .7rem;
  background: var(--card, #fff);
  display: flex;
  flex-direction: column;
  gap: .4rem;
}
.hp-hv-broker.is-off { opacity: .55; }
.hp-hv-broker-on {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-weight: 650;
  font-size: .9rem;
  cursor: pointer;
}
.hp-hv-fee-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: .35rem;
}
@media (max-width: 520px) {
  .hp-hv-fee-row { grid-template-columns: 1fr; }
}
.hp-hv-fee-row .hp-field input,
.hp-hv-fee-row .hp-field select { width: 100%; font-size: .85rem; }
.hp-hv-dims {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .3rem .45rem;
  margin: .15rem 0;
}
.hp-hv-dim {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0 .35rem;
  align-items: center;
  font-size: .78rem;
}
.hp-hv-dim span { grid-column: 1 / -1; }
.hp-hv-dim input[type="range"] { width: 100%; }
.hp-hv-dim strong { font-size: .9rem; font-weight: 800; min-width: 1rem; text-align: right; }
.hp-hv-fee-live {
  margin: .15rem 0 0;
  padding: .3rem .4rem;
  border-radius: 8px;
  background: color-mix(in srgb, var(--accent) 8%, transparent);
  font-size: .78rem;
  line-height: 1.35;
}
.hp-hv-score-field {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .25rem .5rem;
  align-items: center;
}
.hp-hv-score-label { grid-column: 1 / -1; font-size: .85rem; }
.hp-hv-score-field input[type="range"] { width: 100%; }
.hp-hv-score-val {
  font-size: 1.1rem;
  font-weight: 800;
  min-width: 1.2rem;
  text-align: right;
}
.hp-hv-prep {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
  display: grid;
  gap: .35rem;
}
.hp-hv-prep li label {
  display: flex;
  align-items: flex-start;
  gap: .45rem;
  font-size: .9rem;
  cursor: pointer;
  padding: .35rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-hv-prep li input { margin-top: .2rem; }
.hp-hv-status-block {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: .25rem;
}
.hp-hv-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .2rem;
  justify-content: flex-end;
}
.hp-hv-qchip {
  font-size: .68rem;
  font-weight: 700;
  padding: .12rem .32rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
  line-height: 1.2;
  color: inherit;
}
.hp-hv-qchip.is-on {
  background: color-mix(in srgb, var(--accent) 22%, transparent);
  border-color: color-mix(in srgb, var(--accent) 50%, var(--border));
}
.hp-hv-cat-prog { font-weight: 600; }
.hp-hv-fee-box {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-hv-matrix-scroll {
  overflow-x: auto;
  max-width: 100%;
}
.hp-hv-mtx-st {
  display: inline-block;
  font-size: .65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .02em;
  padding: .05rem .28rem;
  border-radius: 4px;
  background: color-mix(in srgb, var(--border) 60%, transparent);
  margin-right: .2rem;
  vertical-align: middle;
}
.hp-hv-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .65rem;
}
.hp-hv-filters .chip.is-on,
.hp-hv-filters .chip[aria-pressed="true"] {
  background: color-mix(in srgb, var(--accent) 22%, transparent);
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  font-weight: 700;
}
.hp-hv-cat { margin-bottom: 1rem; }
.hp-hv-cat-title {
  margin: 0 0 .4rem;
  font-size: .95rem;
  font-weight: 750;
}
.hp-hv-qlist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-hv-q {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev, #fff));
}
.hp-hv-q.is-must {
  border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
}
.hp-hv-q-top {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-hv-q-label { flex: 1 1 12rem; font-size: .9rem; font-weight: 600; }
.hp-hv-must-badge {
  display: inline-block;
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: color-mix(in srgb, var(--accent) 18%, transparent);
  color: var(--accent-ink, var(--accent));
  margin-right: .25rem;
  vertical-align: middle;
}
.hp-hv-status-wrap select {
  font-size: .85rem;
  max-width: 10rem;
}
.hp-hv-q-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .35rem .5rem;
}
.hp-hv-perb {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .35rem;
  margin-top: .4rem;
}
@media (max-width: 640px) {
  .hp-hv-perb { grid-template-columns: 1fr; }
}
.hp-hv-perb-field {
  display: flex;
  flex-direction: column;
  gap: .15rem;
  font-size: .78rem;
}
.hp-hv-perb-field input {
  font-size: .82rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .3rem .4rem;
}
.hp-hv-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: var(--card, #fff);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--fg) 6%, transparent);
}
.hp-hv-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .75rem;
}
.hp-hv-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-hv-gauge strong { font-size: 1.25rem; font-weight: 800; letter-spacing: -0.02em; }
.hp-hv-bar-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: .4rem .55rem;
  align-items: center;
  margin-bottom: .75rem;
  font-size: .86rem;
}
.hp-hv-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-hv-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 75%, #22c55e), var(--accent));
  transition: width .25s ease;
}
.hp-hv-readiness {
  border-radius: 12px;
  padding: .65rem .75rem;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-hv-readiness.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-hv-readiness.is-mid {
  border-color: #fde68a;
  background: #fffbeb;
}
.hp-hv-readiness.is-tight {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-hv-ready-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-hv-gaps {
  border: 1px solid #fecaca;
  background: #fff1f2;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-hv-gaps-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-hv-gaps-ul li { margin: .15rem 0; }
.hp-hv-subh {
  margin: .85rem 0 .35rem;
  font-size: .9rem;
  font-weight: 750;
}
.hp-hv-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .82rem;
}
.hp-hv-table th,
.hp-hv-table td {
  border-bottom: 1px solid var(--border);
  padding: .35rem .3rem;
  text-align: left;
  vertical-align: top;
}
.hp-hv-table th { font-weight: 700; font-size: .78rem; color: var(--muted, #64748b); }
.hp-hv-cmp-meta {
  margin: .4rem 0 0;
  padding-left: 1.1rem;
}
.hp-hv-agenda {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 10rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-hv-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-hv-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-hv-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-hv-faq details p { margin: .35rem 0 .15rem; }
.hp-hv-fav-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
}
.hp-hv-fav-btn.is-on {
  background: color-mix(in srgb, #f59e0b 22%, transparent);
  border-color: color-mix(in srgb, #f59e0b 55%, var(--border));
  font-weight: 700;
}
.hp-hv-fav-pill {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .1rem .4rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
}
.hp-hv-fav-box {
  border: 1px solid #fde68a;
  background: #fffbeb;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-hv-fav-line {
  margin: 0;
  font-size: .9rem;
  font-weight: 650;
}
.hp-hv-eff-live {
  margin: .05rem 0 0;
  padding: .25rem .4rem;
  border-radius: 8px;
  background: color-mix(in srgb, #22c55e 8%, transparent);
  font-size: .76rem;
  line-height: 1.35;
}
.hp-hv-fc {
  font-weight: 700;
  opacity: .85;
  margin-left: .15rem;
}
.hp-hv-filter-count {
  margin: -.35rem 0 .55rem;
  font-size: .82rem;
}
.hp-hv-gap-btn,
.hp-hv-mtx-jump {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  padding: 0;
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--accent) 45%, transparent);
  text-underline-offset: 2px;
}
.hp-hv-gap-btn:hover,
.hp-hv-mtx-jump:hover {
  color: var(--accent);
}
.hp-hv-q-flash {
  outline: 2px solid color-mix(in srgb, var(--accent) 70%, transparent);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 18%, transparent);
  transition: box-shadow .3s ease, outline-color .3s ease;
}
.hp-hv-rank-ol {
  margin: 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-hv-rank-ol li { margin: .25rem 0; }
.hp-hv-rank-ol li.is-fav {
  font-weight: 650;
  color: color-mix(in srgb, #b45309 70%, var(--fg));
}
.hp-hv-tr-fav td {
  background: color-mix(in srgb, #fef3c7 55%, transparent);
}
.hp-hv-gauges {
  grid-template-columns: 1fr 1fr;
}
@media (max-width: 560px) {
  .hp-hv-panel { position: static; }
  .hp-hv-gauges { grid-template-columns: 1fr; }
}
.hp-hv-date-chips {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  margin: -.25rem 0 .35rem;
}
.hp-hv-request {
  width: 100%;
  font-size: .8rem;
  line-height: 1.4;
  font-family: inherit;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .5rem .6rem;
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev, #fff));
  resize: vertical;
  min-height: 7rem;
}
.hp-hv-gap-bars {
  margin-top: .55rem;
  display: grid;
  gap: .4rem;
}
.hp-hv-gap-bar-row {
  display: grid;
  grid-template-columns: minmax(4.5rem, 7rem) 1fr auto;
  gap: .35rem .5rem;
  align-items: center;
  font-size: .78rem;
}
.hp-hv-gap-bar-name {
  font-weight: 650;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.hp-hv-gap-bar-track {
  position: relative;
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 75%, transparent);
  overflow: hidden;
  display: flex;
}
.hp-hv-gap-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px 0 0 999px;
  background: color-mix(in srgb, var(--accent) 55%, #22c55e 30%);
  min-width: 2px;
}
.hp-hv-gap-bar-fill.is-over {
  background: color-mix(in srgb, #f59e0b 55%, var(--accent) 20%);
  border-radius: 0;
}
.hp-hv-gap-bar-fill.is-under {
  border-radius: 999px;
}
.hp-hv-gap-bar-overflow {
  display: block;
  height: 100%;
  background: color-mix(in srgb, #ef4444 65%, transparent);
}
.hp-hv-gap-bar-meta {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  white-space: nowrap;
  color: var(--muted, #64748b);
}
.hp-hv-gap-bar-meta.is-over {
  color: #b45309;
}
@media (max-width: 420px) {
  .hp-hv-gap-bar-row {
    grid-template-columns: 1fr;
    gap: .15rem;
  }
}
.hp-hv-sign-badge {
  display: inline-block;
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .35rem;
  border-radius: 999px;
  background: #fee2e2;
  color: #991b1b;
  margin-right: .25rem;
  vertical-align: middle;
}
.hp-hv-job-badge {
  display: inline-block;
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .35rem;
  border-radius: 999px;
  background: #dbeafe;
  color: #1e40af;
  margin-right: .25rem;
  vertical-align: middle;
}
.hp-hv-q.is-sign {
  border-left: 3px solid color-mix(in srgb, #ef4444 55%, var(--border));
}
.hp-hv-q.is-job-hit {
  background: color-mix(in srgb, #dbeafe 28%, transparent);
}
.hp-hv-search-row {
  margin: 0 0 .55rem;
}
.hp-hv-search-field { margin: 0; }
.hp-hv-search-field input[type="search"] {
  width: 100%;
  font-size: .9rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .45rem .65rem;
}
.hp-hv-quote-warn {
  border: 1px solid #fcd34d;
  background: #fffbeb;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-hv-quote-warn-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .9rem;
  color: #92400e;
}
.hp-hv-sign-gate {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .6rem .75rem;
  margin-bottom: .75rem;
  background: var(--card, #fff);
}
.hp-hv-sign-gate.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-hv-sign-gate.is-mid {
  border-color: #fde68a;
  background: #fffbeb;
}
.hp-hv-sign-gate.is-tight {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-hv-sign-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .92rem;
}
.hp-hv-sign-ul {
  margin: .35rem 0 .45rem;
  padding-left: 1.05rem;
  font-size: .84rem;
}
.hp-hv-sign-ul li { margin: .12rem 0; }
.hp-hv-sign-bar {
  height: .5rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-hv-sign-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #f59e0b, #22c55e);
  transition: width .25s ease;
}
.hp-hv-dim-grid {
  display: grid;
  gap: .55rem;
}
.hp-hv-dim-block {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .5rem;
}
.hp-hv-dim-block-lab {
  display: block;
  font-size: .75rem;
  font-weight: 750;
  color: var(--muted, #64748b);
  margin-bottom: .25rem;
}
.hp-hv-dim-row {
  display: grid;
  grid-template-columns: minmax(3.5rem, 5.5rem) 1fr auto;
  gap: .3rem .4rem;
  align-items: center;
  font-size: .76rem;
  margin: .15rem 0;
}
.hp-hv-dim-who {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
}
.hp-hv-dim-track {
  height: .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 75%, transparent);
  overflow: hidden;
}
.hp-hv-dim-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent) 70%, #6366f1 20%);
  min-width: 2px;
}
.hp-hv-dim-n {
  font-variant-numeric: tabular-nums;
  min-width: 1rem;
  text-align: right;
}

/* —— Prisjustering-logg (price_adj / sell-prisjustering) —— */
.hp-pa-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .85rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-pa-hero-mascot {
  width: 72px; height: 72px; object-fit: contain;
  border-radius: 50%;
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  border: 2px solid color-mix(in srgb, var(--brand) 30%, var(--border));
}
.hp-pa-hero-copy { min-width: 0; grid-column: 2; }
.hp-pa-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
  color: var(--muted, #64748b);
}
.hp-pa-lead-bullets li { margin: .15rem 0; }
.hp-pa-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  padding: .55rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 5%, var(--bg));
}
.hp-pa-how summary { cursor: pointer; font-weight: 700; font-size: .92rem; }
.hp-pa-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
  color: var(--muted, #64748b);
}
.hp-pa-how-list li { margin: .2rem 0; }
.hp-pa-demos {
  display: flex; flex-wrap: wrap; align-items: center; gap: .4rem;
  margin: 0 0 .85rem;
}
.hp-pa-demo-badge {
  display: inline-block;
  font-size: .68rem; font-weight: 700;
  padding: .08rem .35rem; border-radius: 999px;
  border: 1px solid color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 14%, var(--bg-elev));
  vertical-align: middle;
}
.hp-pa-demo-note {
  margin: -.35rem 0 .85rem;
  padding: .4rem .6rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg));
}
.hp-pa-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .9fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-pa-layout { grid-template-columns: 1fr; }
  .hp-pa-hero { grid-template-columns: auto 1fr; }
}
.hp-pa-section {
  margin: 1.15rem 0 .55rem;
  font-size: 1.05rem;
  font-weight: 750;
  letter-spacing: -0.02em;
}
.hp-pa-main .hp-pa-section:first-child { margin-top: 0; }
.hp-pa-subh {
  margin: .75rem 0 .35rem;
  font-size: .92rem;
  font-weight: 700;
}
.hp-pa-dim-val {
  display: inline-block;
  margin-left: .35rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--brand);
}
.hp-pa-delta-preview {
  display: flex; flex-direction: column; gap: .15rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg));
}
.hp-pa-delta-preview strong {
  font-size: 1.05rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--brand);
}
.hp-pa-reasons {
  display: flex; flex-wrap: wrap; gap: .4rem;
}
.hp-pa-reason {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .35rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  font-size: .82rem;
  cursor: pointer;
  user-select: none;
}
.hp-pa-reason:has(input:checked) {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  font-weight: 650;
}
.hp-pa-reason input { margin: 0; accent-color: var(--brand); }
.hp-pa-filters {
  display: flex; flex-wrap: wrap; gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-pa-list { display: grid; gap: .65rem; margin-bottom: .5rem; }
.hp-pa-card {
  padding: .75rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 4%, var(--bg));
}
.hp-pa-card.is-down {
  border-color: color-mix(in srgb, #dc2626 35%, var(--border));
  box-shadow: inset 3px 0 0 color-mix(in srgb, #dc2626 65%, transparent);
}
.hp-pa-card.is-up {
  border-color: color-mix(in srgb, #16a34a 35%, var(--border));
  box-shadow: inset 3px 0 0 color-mix(in srgb, #16a34a 65%, transparent);
}
.hp-pa-card.is-same {
  border-color: color-mix(in srgb, #94a3b8 40%, var(--border));
}
.hp-pa-card-top {
  display: flex; justify-content: space-between; gap: .65rem;
  align-items: flex-start;
}
.hp-pa-card-delta {
  display: flex; flex-direction: column; align-items: flex-end;
  flex-shrink: 0; gap: .1rem;
}
.hp-pa-card-amt {
  font-size: 1.1rem; font-weight: 800; color: var(--brand);
  font-variant-numeric: tabular-nums; letter-spacing: -0.02em;
  line-height: 1.15;
}
.hp-pa-card-tags {
  display: flex; flex-wrap: wrap; gap: .25rem;
  margin: .4rem 0 .15rem;
}
.hp-pa-tag {
  font-size: .72rem; font-weight: 650;
  padding: .12rem .4rem; border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-pa-review-badge {
  display: inline-block;
  font-size: .68rem; font-weight: 700;
  padding: .08rem .35rem; border-radius: 999px;
  border: 1px solid color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 14%, var(--bg-elev));
  vertical-align: middle;
}
.hp-pa-card-ev { margin: .3rem 0 0; }
.hp-pa-card-next { margin: .25rem 0 0; }
.hp-pa-card-actions { margin-top: .45rem; gap: .35rem; flex-wrap: wrap; }
.hp-pa-panel {
  padding: 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  box-shadow: var(--shadow);
  position: sticky;
  top: 0.75rem;
  max-height: calc(100vh - 1.5rem);
  overflow: auto;
}
.hp-pa-panel-head {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .5rem;
  margin-bottom: .45rem;
}
.hp-pa-band {
  display: inline-block;
  font-size: .75rem; font-weight: 700;
  padding: .2rem .5rem; border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 8%, var(--bg));
}
.hp-pa-band.is-down {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 10%, var(--bg));
}
.hp-pa-band.is-up {
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
  background: color-mix(in srgb, #16a34a 10%, var(--bg));
}
.hp-pa-band.is-mid {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg));
}
.hp-pa-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .85rem;
}
.hp-pa-gauge {
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 5%, var(--bg));
  display: flex; flex-direction: column; gap: .15rem;
}
.hp-pa-gauge strong {
  font-size: 1.05rem; font-weight: 800; color: var(--brand);
  font-variant-numeric: tabular-nums; letter-spacing: -0.02em;
  line-height: 1.2;
}
.hp-pa-spark-wrap {
  margin: 0 0 .85rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 4%, var(--bg));
}
.hp-pa-spark {
  display: flex; align-items: flex-end; gap: .35rem;
  min-height: 4.25rem;
  padding: .25rem 0;
}
.hp-pa-spark-col {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column;
  align-items: center; justify-content: flex-end;
  gap: .2rem; height: 4rem;
}
.hp-pa-spark-bar {
  width: 100%; max-width: 1.75rem;
  border-radius: 6px 6px 2px 2px;
  background: color-mix(in srgb, var(--brand) 55%, #94a3b8);
  min-height: 4px;
}
.hp-pa-spark-bar.is-start {
  background: color-mix(in srgb, var(--brand) 70%, #64748b);
}
.hp-pa-spark-bar.is-down {
  background: color-mix(in srgb, #dc2626 65%, #94a3b8);
}
.hp-pa-spark-bar.is-up {
  background: color-mix(in srgb, #16a34a 70%, var(--brand));
}
.hp-pa-spark-n {
  font-size: .68rem; font-weight: 700;
  font-variant-numeric: tabular-nums; color: var(--muted);
}
.hp-pa-reasons-sum { margin-bottom: .75rem; }
.hp-pa-reason-bars { display: grid; gap: .35rem; }
.hp-pa-bar-row {
  display: grid;
  grid-template-columns: minmax(0, 6.5rem) 1fr auto;
  gap: .4rem; align-items: center;
  font-size: .82rem;
}
.hp-pa-bar-lab { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hp-pa-bar-track {
  height: .55rem; border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg));
  border: 1px solid var(--border); overflow: hidden;
}
.hp-pa-bar-fill {
  display: block; height: 100%;
  background: color-mix(in srgb, var(--brand) 70%, #22c55e);
  border-radius: 999px; min-width: 2px;
}
.hp-pa-bar-n { font-weight: 700; font-variant-numeric: tabular-nums; min-width: 1.25rem; text-align: right; }
.hp-pa-review-box {
  margin: 0 0 .85rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, #2563eb 35%, var(--border));
  background: color-mix(in srgb, #2563eb 7%, var(--bg));
  font-weight: 650;
}
.hp-pa-hints {
  margin: .5rem 0 .85rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg));
}
.hp-pa-hint-list {
  margin: 0; padding-left: 1.1rem;
  font-size: .84rem; color: var(--muted);
}
.hp-pa-hint-list li { margin: .25rem 0; }
.hp-pa-summary {
  width: 100%; font-family: inherit; font-size: .85rem;
  resize: vertical; min-height: 8rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-pa-privacy {
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 3%, var(--bg));
}
.hp-pa-privacy summary { cursor: pointer; font-weight: 650; font-size: .9rem; }
.hp-pa-nonadvice {
  margin: .65rem 0 0;
  font-size: .78rem;
  opacity: .9;
}
.hp-pa-faq details { margin: .35rem 0; }
.hp-pa-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-pa-faq details p { margin: .35rem 0 .15rem; }
.hp-pa-delta-chips,
.hp-pa-conf-chips,
.hp-pa-review-presets,
.hp-pa-outcome-presets {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
  align-items: center;
}
.hp-pa-outcome-presets { margin: .35rem 0 .15rem; }
.hp-pa-card-outcome {
  margin: .35rem 0 0;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, #16a34a 30%, var(--border));
  background: color-mix(in srgb, #16a34a 8%, var(--bg));
  font-size: .84rem;
}
.hp-pa-card-outcome.is-missing {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg));
}
.hp-pa-conf-chips .chip.is-on,
.hp-pa-delta-chips .chip:active {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  font-weight: 650;
}
.hp-pa-prep {
  margin: 0 0 .85rem;
  padding: .65rem .75rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg));
}
.hp-pa-prep-list {
  display: flex; flex-wrap: wrap; gap: .4rem .65rem;
}
.hp-pa-prep-item {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .84rem;
  cursor: pointer;
  user-select: none;
}
.hp-pa-prep-item input { margin: 0; accent-color: var(--brand); }
.hp-pa-round-chips,
.hp-pa-next-presets {
  display: flex; flex-wrap: wrap; gap: .3rem;
  margin-top: .25rem; align-items: center;
}
.hp-pa-hist-toolbar {
  display: flex; flex-wrap: wrap; gap: .55rem .75rem;
  align-items: center; justify-content: space-between;
  margin: 0 0 .55rem;
}
.hp-pa-sort { display: flex; flex-wrap: wrap; gap: .3rem; }
.hp-pa-fcnt {
  font-weight: 700; font-variant-numeric: tabular-nums;
  opacity: .85; margin-left: .15rem;
}
.hp-pa-floor-badge {
  display: inline-block;
  font-size: .68rem; font-weight: 700;
  padding: .08rem .35rem; border-radius: 999px;
  border: 1px solid color-mix(in srgb, #dc2626 50%, var(--border));
  background: color-mix(in srgb, #dc2626 12%, var(--bg-elev));
  vertical-align: middle; margin-left: .25rem;
}
.hp-pa-card.is-under-floor {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
}
.hp-pa-floor-note.is-under,
[data-pa-floor-note].is-under {
  color: color-mix(in srgb, #b91c1c 80%, var(--text));
  font-weight: 650;
}
.hp-pa-talk {
  margin: 0 0 .85rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, #6366f1 30%, var(--border));
  background: color-mix(in srgb, #6366f1 6%, var(--bg));
}
.hp-pa-talk-ta {
  width: 100%; font-family: inherit; font-size: .82rem;
  resize: vertical; min-height: 5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .45rem .55rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-pa-delta-preview [data-out="live_total"],
.hp-pa-delta-preview [data-out="live_floor"] {
  display: block;
}
@media (max-width: 560px) {
  .hp-pa-panel { position: static; max-height: none; }
  .hp-pa-gauges { grid-template-columns: 1fr; }
  .hp-pa-hero { grid-template-columns: 1fr; }
  .hp-pa-hero-copy { grid-column: 1; }
  .hp-pa-hist-toolbar { flex-direction: column; align-items: stretch; }
}

/* —— Nabolags-observasjon (sell-konkurrenter · nabolag) —— */
.hp-nb-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-nb-hero-mascot {
  border-radius: 14px;
  object-fit: cover;
}
.hp-nb-hero-copy { min-width: 0; grid-column: 2; }
.hp-nb-lead-bullets {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .9rem;
}
.hp-nb-lead-bullets li { margin: .15rem 0; }
.hp-nb-how {
  grid-column: 1 / -1;
  margin-top: .25rem;
  padding: .55rem .75rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: color-mix(in srgb, var(--card, #fff) 92%, var(--brand) 8%);
}
.hp-nb-how summary { cursor: pointer; font-weight: 700; font-size: .92rem; }
.hp-nb-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .88rem;
}
.hp-nb-how-list li { margin: .2rem 0; }
.hp-nb-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .75rem;
}
.hp-nb-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: color-mix(in srgb, var(--brand) 18%, transparent);
  color: var(--brand);
}
.hp-nb-demo-note {
  margin: 0 0 .85rem;
  padding: .45rem .65rem;
  border-radius: 8px;
  border-left: 3px solid var(--brand);
  background: color-mix(in srgb, var(--brand) 8%, transparent);
}
.hp-nb-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, .9fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-nb-layout { grid-template-columns: 1fr; }
  .hp-nb-hero { grid-template-columns: auto 1fr; }
}
.hp-nb-section {
  margin: 1.1rem 0 .55rem;
  font-size: 1.05rem;
}
.hp-nb-main .hp-nb-section:first-child { margin-top: 0; }
.hp-nb-subh {
  margin: .75rem 0 .4rem;
  font-size: .95rem;
}
.hp-nb-dim-val {
  font-weight: 700;
  margin-left: .35rem;
  font-variant-numeric: tabular-nums;
}
.hp-nb-live-mine {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .75rem;
  align-items: baseline;
  margin: .65rem 0 0;
  padding: .55rem .7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--card, #fff) 90%, var(--brand) 10%);
}
.hp-nb-live-mine strong {
  font-size: 1.15rem;
  font-variant-numeric: tabular-nums;
}
.hp-nb-delta-preview {
  display: flex;
  flex-direction: column;
  gap: .15rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px dashed var(--border);
  background: color-mix(in srgb, var(--card, #fff) 94%, #888 6%);
  justify-content: center;
}
.hp-nb-delta-preview strong {
  font-variant-numeric: tabular-nums;
  font-size: 1.05rem;
}
.hp-nb-tags {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}
.hp-nb-tag {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .3rem .55rem;
  border: 1px solid var(--border);
  border-radius: 999px;
  font-size: .85rem;
  cursor: pointer;
  user-select: none;
}
.hp-nb-tag:has(input:checked) {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, transparent);
}
.hp-nb-tag input { margin: 0; accent-color: var(--brand); }
.hp-nb-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .5rem;
}
.hp-nb-list {
  display: grid;
  gap: .65rem;
}
.hp-nb-card {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .65rem .75rem;
  background: var(--card, #fff);
  border-left-width: 4px;
}
.hp-nb-card.is-til_salgs { border-left-color: color-mix(in srgb, var(--brand) 70%, #3b82f6); }
.hp-nb-card.is-solgt { border-left-color: #16a34a; }
.hp-nb-card.is-under_bud { border-left-color: #d97706; }
.hp-nb-card.is-trukket { border-left-color: #94a3b8; }
.hp-nb-card-top {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  align-items: flex-start;
}
.hp-nb-card-ppk {
  text-align: right;
  flex-shrink: 0;
}
.hp-nb-card-amt {
  display: block;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
}
.hp-nb-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-nb-ctag {
  font-size: .75rem;
  padding: .1rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--brand) 22%, var(--border));
}
.hp-nb-card-note { margin: .35rem 0 0; }
.hp-nb-card-actions { margin-top: .45rem; }
.hp-nb-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: color-mix(in srgb, var(--card, #fff) 96%, var(--brand) 4%);
  max-height: calc(100vh - 2rem);
  overflow: auto;
}
.hp-nb-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  margin-bottom: .35rem;
}
.hp-nb-band {
  font-size: .78rem;
  font-weight: 750;
  padding: .2rem .5rem;
  border-radius: 999px;
  background: color-mix(in srgb, #888 14%, transparent);
}
.hp-nb-band.is-high {
  background: color-mix(in srgb, #d97706 22%, transparent);
  color: color-mix(in srgb, #92400e 80%, #000);
}
.hp-nb-band.is-low {
  background: color-mix(in srgb, #3b82f6 18%, transparent);
}
.hp-nb-band.is-mid {
  background: color-mix(in srgb, #16a34a 14%, transparent);
}
.hp-nb-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin-bottom: .85rem;
}
.hp-nb-gauge {
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-nb-gauge strong {
  display: block;
  font-size: 1rem;
  font-variant-numeric: tabular-nums;
  margin-top: .1rem;
}
.hp-nb-compare { margin-bottom: .85rem; }
.hp-nb-bars { display: grid; gap: .35rem; }
.hp-nb-bar-row,
.hp-nb-tbar-row {
  display: grid;
  grid-template-columns: minmax(0, 5.5rem) 1fr auto;
  gap: .4rem;
  align-items: center;
  font-size: .82rem;
}
.hp-nb-bar-lab,
.hp-nb-tbar-lab {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.hp-nb-bar-track,
.hp-nb-tbar-track {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, #888 12%, transparent);
  overflow: hidden;
}
.hp-nb-bar-fill,
.hp-nb-tbar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--brand);
  min-width: 2px;
}
.hp-nb-bar-fill.is-mine {
  background: color-mix(in srgb, var(--brand) 55%, #111);
}
.hp-nb-bar-fill.is-sold { background: #16a34a; }
.hp-nb-bar-fill.is-active { background: color-mix(in srgb, var(--brand) 75%, #3b82f6); }
.hp-nb-bar-fill.is-bid { background: #d97706; }
.hp-nb-bar-fill.is-out { background: #94a3b8; }
.hp-nb-bar-n,
.hp-nb-tbar-n {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  min-width: 3.5rem;
  text-align: right;
}
.hp-nb-bar-row.is-mine .hp-nb-bar-lab { font-weight: 750; }
.hp-nb-tag-sum { margin-bottom: .75rem; }
.hp-nb-hints {
  margin-bottom: .75rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--card, #fff) 92%, #f59e0b 8%);
}
.hp-nb-hint-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .85rem;
}
.hp-nb-hint-list li { margin: .25rem 0; }
.hp-nb-summary {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.35;
  resize: vertical;
  min-height: 10rem;
}
.hp-nb-privacy {
  padding: .5rem .65rem;
  border: 1px solid var(--border);
  border-radius: 10px;
}
.hp-nb-privacy summary { cursor: pointer; font-weight: 650; font-size: .9rem; }
.hp-nb-nonadvice {
  margin: .65rem 0 0;
  font-size: .78rem;
  opacity: .9;
}
.hp-nb-faq details { margin: .35rem 0; }
.hp-nb-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-nb-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-nb-panel { position: static; max-height: none; }
  .hp-nb-gauges { grid-template-columns: 1fr; }
  .hp-nb-hero { grid-template-columns: 1fr; }
  .hp-nb-hero-copy { grid-column: 1; }
  .hp-nb-bar-row,
  .hp-nb-tbar-row {
    grid-template-columns: minmax(0, 4.5rem) 1fr auto;
  }
}

/* —— Energi før salg (sell_energi / sell-energi-salg) —— */
.hp-seng-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-seng-hero-mascot {
  border-radius: 14px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, #fff);
}
.hp-seng-hero-copy { min-width: 0; grid-column: 2; }
.hp-seng-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-seng-lead-bullets li { margin: .15rem 0; }
.hp-seng-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-seng-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-seng-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-seng-how-list li { margin: .2rem 0; }
.hp-seng-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .5rem;
  margin: .35rem 0 .55rem;
}
.hp-seng-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: #fef3c7;
  color: #92400e;
  vertical-align: middle;
}
.hp-seng-demo-note {
  margin: 0 0 .65rem;
  padding: .4rem .6rem;
  border-radius: 10px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-seng-demos .chip,
.hp-seng-packs .chip,
.hp-seng-filters .chip {
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  border-radius: 999px;
  padding: .35rem .7rem;
  font-size: .86rem;
  cursor: pointer;
}
.hp-seng-filters .chip-sm {
  padding: .22rem .55rem;
  font-size: .8rem;
}
.hp-seng-demos .chip:hover,
.hp-seng-demos .chip[aria-pressed="true"],
.hp-seng-filters .chip[aria-pressed="true"],
.hp-seng-packs .chip:hover {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, #fff);
}
.hp-seng-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-seng-packs,
.hp-seng-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .45rem;
  margin: 0 0 .55rem;
}
.hp-seng-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-seng-layout { grid-template-columns: 1fr; }
  .hp-seng-hero { grid-template-columns: auto 1fr; }
}
.hp-seng-section {
  margin: 1rem 0 .45rem;
  font-size: 1.02rem;
  font-weight: 750;
  letter-spacing: -0.02em;
}
.hp-seng-main .hp-seng-section:first-child { margin-top: 0; }
.hp-seng-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  margin-bottom: .5rem;
}
.hp-seng-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .86rem;
}
.hp-seng-table th,
.hp-seng-table td {
  padding: .45rem .5rem;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
  text-align: left;
}
.hp-seng-table thead th {
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--muted);
  background: color-mix(in srgb, var(--bg) 60%, var(--bg-elev, #fff));
  white-space: nowrap;
}
.hp-seng-row.is-on {
  background: color-mix(in srgb, var(--brand, #0f766e) 5%, transparent);
}
.hp-seng-row.is-pack td:first-child {
  box-shadow: inset 3px 0 0 color-mix(in srgb, #16a34a 80%, var(--brand, #0f766e));
}
.hp-seng-row.is-over {
  background: color-mix(in srgb, #f59e0b 8%, transparent);
}
.hp-seng-row.is-over td:first-child {
  box-shadow: inset 3px 0 0 #f59e0b;
}
.hp-seng-name {
  display: block;
  font-weight: 650;
  line-height: 1.25;
}
.hp-seng-hint {
  display: block;
  margin-top: .15rem;
  line-height: 1.3;
  max-width: 22rem;
}
.hp-seng-check { display: inline-flex; align-items: center; }
.hp-seng-cost {
  min-width: 5.5rem;
  max-width: 7rem;
  font-variant-numeric: tabular-nums;
}
.hp-seng-lift-in,
.hp-seng-weeks-in {
  width: 3.2rem;
  font-variant-numeric: tabular-nums;
}
.hp-seng-appeal-cell {
  white-space: nowrap;
  min-width: 6.5rem;
}
.hp-seng-appeal {
  width: 4.5rem;
  vertical-align: middle;
}
.hp-seng-appeal-val {
  display: inline-block;
  min-width: 1rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  margin-left: .2rem;
}
.hp-seng-kind {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  padding: .12rem .4rem;
  border-radius: 999px;
  white-space: nowrap;
  background: color-mix(in srgb, var(--border) 50%, #fff);
}
.hp-seng-kind-cert { background: #dbeafe; color: #1e40af; }
.hp-seng-kind-quick { background: #d1fae5; color: #065f46; }
.hp-seng-kind-mid { background: #e0e7ff; color: #3730a3; }
.hp-seng-kind-major { background: #fee2e2; color: #991b1b; }
.hp-seng-kind-disclose { background: #f3f4f6; color: #374151; }
.hp-seng-dec {
  display: inline-block;
  font-size: .78rem;
  font-weight: 700;
  padding: .15rem .4rem;
  border-radius: 8px;
  white-space: nowrap;
}
.hp-seng-dec.is-do { background: #dcfce7; color: #166534; }
.hp-seng-dec.is-cert { background: #dbeafe; color: #1e40af; }
.hp-seng-dec.is-skip { background: #ffedd5; color: #9a3412; }
.hp-seng-dec.is-disclose { background: #f3f4f6; color: #374151; }
.hp-seng-enova {
  display: grid;
  gap: .35rem;
  padding: .65rem .75rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, #2563eb 5%, var(--bg));
  margin-bottom: .35rem;
}
.hp-seng-enova-item {
  display: flex;
  gap: .45rem;
  align-items: flex-start;
  font-size: .88rem;
  cursor: pointer;
}
.hp-seng-enova-item input { margin-top: .2rem; }
.hp-seng-enova-links { margin: .35rem 0 0; }
.hp-seng-faq { margin-top: .85rem; }
.hp-seng-faq > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .95rem;
}
.hp-seng-faq details { margin: .35rem 0; }
.hp-seng-faq details summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-seng-faq details p { margin: .35rem 0 .15rem; }
.hp-seng-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 4%);
  max-height: min(92vh, 920px);
  overflow: auto;
}
.hp-seng-empty {
  padding: .5rem 0;
}
.hp-seng-letter-row {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: .35rem;
}
.hp-seng-letter-card {
  flex: 1;
  text-align: center;
  padding: .45rem .5rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-seng-letter-card.is-after {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 8%, var(--bg));
}
.hp-seng-letter-big {
  display: block;
  font-size: 1.75rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.1;
  margin-top: .1rem;
}
.hp-seng-letter-arrow {
  font-weight: 700;
  opacity: .55;
  font-size: 1.1rem;
}
.hp-seng-triad {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin: .55rem 0;
}
.hp-seng-triad-card {
  text-align: center;
  padding: .4rem .3rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-seng-triad-card strong {
  display: block;
  font-size: 1.25rem;
  font-variant-numeric: tabular-nums;
}
.hp-seng-triad-card.is-do { border-color: color-mix(in srgb, #16a34a 40%, var(--border)); }
.hp-seng-triad-card.is-skip { border-color: color-mix(in srgb, #f59e0b 40%, var(--border)); }
.hp-seng-triad-card.is-disclose { border-color: color-mix(in srgb, #6b7280 40%, var(--border)); }
.hp-seng-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
  margin: .45rem 0 .55rem;
}
.hp-seng-gauge {
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-seng-gauge strong {
  display: block;
  font-size: 1rem;
  font-variant-numeric: tabular-nums;
}
.hp-seng-bar-wrap { margin: .35rem 0 .55rem; }
.hp-seng-bar-label {
  display: flex;
  justify-content: space-between;
  margin-bottom: .2rem;
}
.hp-seng-bar {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, #fff);
  overflow: hidden;
}
.hp-seng-bar-fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand, #0f766e) 70%, #22c55e);
  transition: width .2s ease;
}
.hp-seng-bar-fill.is-over {
  background: color-mix(in srgb, #dc2626 75%, #f59e0b);
}
.hp-seng-status {
  margin: .45rem 0;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 30%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, var(--bg));
}
.hp-seng-status-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .95rem;
}
.hp-seng-subh {
  margin: .7rem 0 .3rem;
  font-size: .9rem;
  font-weight: 700;
}
.hp-seng-rank,
.hp-seng-actions,
.hp-seng-over-ul,
.hp-seng-tips-ul {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-seng-rank li,
.hp-seng-actions li,
.hp-seng-over-ul li,
.hp-seng-tips-ul li { margin: .2rem 0; }
.hp-seng-over {
  margin: .45rem 0;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid #fde68a;
  background: #fffbeb;
}
.hp-seng-tips {
  margin: .45rem 0;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg));
}
.hp-seng-plan {
  width: 100%;
  font-family: inherit;
  font-size: .82rem;
  resize: vertical;
  min-height: 8rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-seng-plan-label { display: block; margin-top: .35rem; }
.hp-seng-seed-hint {
  margin: .25rem 0;
  padding: .35rem .5rem;
  border-radius: 8px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
}
.hp-seng-nonadvice {
  margin: .65rem 0 0;
  font-size: .78rem;
  opacity: .9;
}
.hp-seng-week-chips,
.hp-seng-budget-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-seng-week-chips .chip,
.hp-seng-budget-chips .chip {
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  border-radius: 999px;
  padding: .2rem .5rem;
  font-size: .78rem;
  cursor: pointer;
}
.hp-seng-week-chips .chip[aria-pressed="true"],
.hp-seng-budget-chips .chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, #fff);
}
.hp-seng-score {
  display: inline-block;
  min-width: 2.2rem;
  font-size: .78rem;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  padding: .12rem .35rem;
  border-radius: 8px;
  background: #f1f5f9;
  color: #475569;
  text-align: center;
}
.hp-seng-score.is-hi { background: #dcfce7; color: #166534; }
.hp-seng-score.is-mid { background: #e0f2fe; color: #075985; }
.hp-seng-score.is-lo { background: #ffedd5; color: #9a3412; }
.hp-seng-score.is-disclose { background: #f3e8ff; color: #6b21a8; font-size: .7rem; }
.hp-seng-score.is-cert { background: #dbeafe; color: #1e40af; font-size: .7rem; }
.hp-seng-scenarios {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin: 0 0 .35rem;
}
.hp-seng-scen {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .5rem;
  display: flex;
  flex-direction: column;
  gap: .12rem;
  background: color-mix(in srgb, var(--bg) 40%, #fff);
}
.hp-seng-scen strong {
  font-size: 1.05rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.hp-seng-scen-tag {
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--muted, #64748b);
}
.hp-seng-scen.is-a { border-color: #86efac; background: #f0fdf4; }
.hp-seng-scen.is-b {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, #fff);
}
.hp-seng-scen.is-c { border-color: #fde68a; background: #fffbeb; }
.hp-seng-scen-note { margin: 0 0 .55rem; line-height: 1.4; }
.hp-seng-hope-box {
  border: 1px solid #a5f3fc;
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: .55rem 0 .65rem;
  background: #ecfeff;
}
.hp-seng-hope-box.is-pos {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-seng-hope-box.is-neg {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-seng-hope-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
}
.hp-seng-hope-grid > div {
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-seng-hope-grid strong {
  font-size: 1rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.hp-seng-hope-grid strong.is-pos,
.hp-seng-hope-box .is-pos[data-out="hope_net"] { color: #166534; }
.hp-seng-hope-grid strong.is-neg,
.hp-seng-hope-box .is-neg[data-out="hope_net"] { color: #b91c1c; }
.hp-seng-timeline {
  display: flex;
  flex-direction: column;
  gap: .35rem;
  margin: 0 0 .15rem;
}
.hp-seng-tl-row {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr) auto;
  gap: .35rem .45rem;
  align-items: center;
  font-size: .78rem;
}
.hp-seng-tl-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
}
.hp-seng-tl-track {
  height: .45rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, #fff);
  overflow: hidden;
}
.hp-seng-tl-fill {
  height: 100%;
  border-radius: 999px;
  background: #0f766e;
  min-width: 4px;
}
.hp-seng-tl-fill.is-late { background: #d97706; }
.hp-seng-tl-w {
  font-variant-numeric: tabular-nums;
  color: var(--muted, #64748b);
  font-weight: 650;
}
.hp-seng-privacy {
  margin-top: .65rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .65rem;
  background: color-mix(in srgb, var(--bg) 50%, #fff);
}
.hp-seng-privacy summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-seng-privacy p { margin: .35rem 0 .1rem; }
.hp-seng-mobile-jump { display: none; }
.hp-seng-status.is-ok {
  border-color: color-mix(in srgb, #16a34a 35%, var(--border));
  background: color-mix(in srgb, #16a34a 6%, var(--bg));
}
.hp-seng-status.is-mid {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg));
}
.hp-seng-status.is-tight {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 7%, var(--bg));
}
@media (max-width: 900px) {
  .hp-seng-mobile-jump { display: inline-flex; }
  .hp-seng-scenarios { grid-template-columns: 1fr; }
  .hp-seng-hope-grid { grid-template-columns: 1fr; }
  .hp-seng-tl-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .hp-seng-tl-track { grid-column: 1 / -1; order: 3; }
}
@media (max-width: 560px) {
  .hp-seng-panel { position: static; max-height: none; }
  .hp-seng-gauges { grid-template-columns: 1fr; }
  .hp-seng-hero { grid-template-columns: 1fr; }
  .hp-seng-hero-copy { grid-column: 1; }
  .hp-seng-triad { grid-template-columns: 1fr; }
  .hp-seng-table { min-width: 900px; }
}

/* Letter A–G scale (hurtigvalg merke) */
.hp-seng-letter-scale {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .45rem;
}
.hp-seng-ls-btn {
  min-width: 2.15rem;
  height: 2.15rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  font-weight: 800;
  font-size: .95rem;
  cursor: pointer;
  background: #f8fafc;
  color: #0f172a;
  line-height: 1;
}
.hp-seng-ls-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 1px 4px rgba(15, 23, 42, .08);
}
.hp-seng-ls-btn[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand, #0f766e) 70%, #0f172a);
  outline-offset: 1px;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand, #0f766e) 18%, transparent);
}
.hp-seng-ls-a { background: #166534; color: #fff; border-color: #14532d; }
.hp-seng-ls-b { background: #22c55e; color: #052e16; border-color: #16a34a; }
.hp-seng-ls-c { background: #86efac; color: #14532d; border-color: #4ade80; }
.hp-seng-ls-d { background: #fde047; color: #713f12; border-color: #facc15; }
.hp-seng-ls-e { background: #fdba74; color: #7c2d12; border-color: #fb923c; }
.hp-seng-ls-f { background: #fb7185; color: #4c0519; border-color: #f43f5e; }
.hp-seng-ls-g { background: #b91c1c; color: #fff; border-color: #991b1b; }
.hp-seng-ls-unk { background: #e2e8f0; color: #334155; }

.hp-seng-scen-apply {
  margin-top: .3rem;
  align-self: stretch;
  font-size: .78rem !important;
  padding: .2rem .4rem !important;
}
.hp-seng-scen {
  position: relative;
}
.hp-seng-scen-letter {
  display: block;
  font-size: .75rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #0f766e;
  margin: .05rem 0 .1rem;
}

.hp-seng-enova-prog {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .25rem .55rem;
  margin: .45rem 0;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #2563eb 25%, var(--border));
  background: color-mix(in srgb, #2563eb 6%, var(--bg));
  font-size: .86rem;
}

/* Letter card A–G color wash */
.hp-seng-letter-card.hp-seng-lc-a { background: #166534; color: #fff; border-color: #14532d; }
.hp-seng-letter-card.hp-seng-lc-a .muted { color: #bbf7d0; }
.hp-seng-letter-card.hp-seng-lc-b { background: #22c55e; color: #052e16; border-color: #16a34a; }
.hp-seng-letter-card.hp-seng-lc-c { background: #86efac; color: #14532d; border-color: #4ade80; }
.hp-seng-letter-card.hp-seng-lc-d { background: #fde047; color: #713f12; border-color: #facc15; }
.hp-seng-letter-card.hp-seng-lc-e { background: #fdba74; color: #7c2d12; border-color: #fb923c; }
.hp-seng-letter-card.hp-seng-lc-f { background: #fb7185; color: #4c0519; border-color: #f43f5e; }
.hp-seng-letter-card.hp-seng-lc-g { background: #b91c1c; color: #fff; border-color: #991b1b; }
.hp-seng-letter-card.hp-seng-lc-g .muted { color: #fecaca; }
.hp-seng-letter-card.hp-seng-lc-unk { background: #e2e8f0; color: #334155; border-color: #cbd5e1; }
.hp-seng-letter-card.hp-seng-lc-a .hp-seng-letter-big,
.hp-seng-letter-card.hp-seng-lc-b .hp-seng-letter-big,
.hp-seng-letter-card.hp-seng-lc-c .hp-seng-letter-big,
.hp-seng-letter-card.hp-seng-lc-d .hp-seng-letter-big,
.hp-seng-letter-card.hp-seng-lc-e .hp-seng-letter-big,
.hp-seng-letter-card.hp-seng-lc-f .hp-seng-letter-big,
.hp-seng-letter-card.hp-seng-lc-g .hp-seng-letter-big,
.hp-seng-letter-card.hp-seng-lc-unk .hp-seng-letter-big { color: inherit; }

.hp-seng-ls-btn.is-after-target {
  box-shadow: 0 0 0 3px color-mix(in srgb, #16a34a 55%, transparent);
  outline: 2px dashed #16a34a;
  outline-offset: 1px;
}

.hp-seng-urgency {
  margin: 0 0 .55rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  font-size: .86rem;
  font-weight: 650;
  line-height: 1.35;
  border: 1px solid #fde68a;
  background: #fffbeb;
  color: #92400e;
}
.hp-seng-urgency.is-warn {
  border-color: #fbbf24;
  background: #fffbeb;
  color: #92400e;
}
.hp-seng-urgency.is-crit {
  border-color: #fca5a5;
  background: #fef2f2;
  color: #991b1b;
}

.hp-seng-formula {
  margin: .35rem 0 .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 5%, var(--bg));
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.hp-seng-formula-code {
  font-size: .78rem;
  font-weight: 650;
  word-break: break-word;
  color: #0f172a;
}

.hp-seng-countdown-box {
  margin: .35rem 0 .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #0ea5e9 30%, var(--border));
  background: color-mix(in srgb, #0ea5e9 7%, var(--bg));
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-seng-countdown-box strong {
  font-size: .95rem;
  font-variant-numeric: tabular-nums;
}

.hp-seng-rank-item {
  cursor: pointer;
  border-radius: 6px;
  padding: .1rem .2rem;
  margin-left: -.2rem;
}
.hp-seng-rank-item:hover,
.hp-seng-rank-item:focus {
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, transparent);
  outline: none;
}
.hp-seng-row.is-flash {
  animation: hp-seng-flash .9s ease;
}
@keyframes hp-seng-flash {
  0% { background: color-mix(in srgb, #fde047 55%, transparent); }
  100% { background: transparent; }
}
.hp-seng-filters [data-seng-sort-score][aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, #fff);
  font-weight: 700;
}
.hp-seng-enova-prog strong {
  font-variant-numeric: tabular-nums;
  font-size: 1.05rem;
}

.hp-seng-adline {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .25rem .5rem;
  align-items: start;
  margin: .45rem 0 .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 4%, var(--bg));
}
.hp-seng-adline > .muted { grid-column: 1 / -1; }
.hp-seng-adline-text {
  display: block;
  grid-column: 1;
  font-size: .8rem;
  line-height: 1.4;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  background: transparent;
  color: inherit;
}
.hp-seng-adline .btn { grid-column: 2; grid-row: 2; }

/* —— Energi-tiltak rehab (remodel_energi) —— */
.hp-reng-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-reng-hero-mascot {
  border-radius: 16px;
  grid-row: 1 / span 2;
}
.hp-reng-hero-copy { min-width: 0; grid-column: 2; }
.hp-reng-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-reng-lead-bullets li { margin: .15rem 0; }
.hp-reng-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  padding: .65rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 70%, var(--brand, #0f766e) 6%);
}
.hp-reng-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-reng-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-reng-how-list li { margin: .2rem 0; }
.hp-reng-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: .5rem 0 .75rem;
}
.hp-reng-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: #fef3c7;
  color: #92400e;
  margin-left: .15rem;
}
.hp-reng-demo-note {
  margin: -.35rem 0 .65rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-reng-demos .chip,
.hp-reng-packs .chip,
.hp-reng-filters .chip {
  cursor: pointer;
  font-size: .82rem;
}
.hp-reng-filters .chip-sm {
  font-size: .78rem;
  padding: .2rem .45rem;
}
.hp-reng-demos .chip:hover,
.hp-reng-demos .chip[aria-pressed="true"],
.hp-reng-filters .chip[aria-pressed="true"],
.hp-reng-packs .chip:hover {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
}
.hp-reng-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-reng-packs,
.hp-reng-filters,
.hp-reng-tools {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .35rem 0 .55rem;
}
.hp-reng-tools .chip-sm {
  font-size: .78rem;
  padding: .2rem .45rem;
  cursor: pointer;
}
.hp-reng-tools .chip-sm:hover {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
}
.hp-reng-empty-ctas { margin-top: .5rem; }
.hp-reng-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .9fr);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
@media (max-width: 920px) {
  .hp-reng-layout { grid-template-columns: 1fr; }
  .hp-reng-hero { grid-template-columns: auto 1fr; }
}
.hp-reng-section {
  margin: 1rem 0 .45rem;
  font-size: 1.05rem;
  font-weight: 750;
}
.hp-reng-main .hp-reng-section:first-child { margin-top: 0; }
.hp-reng-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  margin-bottom: .5rem;
}
.hp-reng-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .84rem;
}
.hp-reng-table th,
.hp-reng-table td {
  padding: .45rem .5rem;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
  text-align: left;
}
.hp-reng-table thead th {
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  background: color-mix(in srgb, var(--bg) 70%, var(--brand, #0f766e) 8%);
  white-space: nowrap;
}
.hp-reng-row.is-on {
  background: color-mix(in srgb, var(--brand, #0f766e) 5%, var(--bg));
}
.hp-reng-row.is-pack td:first-child {
  box-shadow: inset 3px 0 0 #16a34a;
}
.hp-reng-row.is-over {
  background: color-mix(in srgb, #f59e0b 8%, var(--bg));
}
.hp-reng-row.is-over td:first-child {
  box-shadow: inset 3px 0 0 #f59e0b;
}
.hp-reng-name {
  display: block;
  font-weight: 650;
  margin-bottom: .1rem;
}
.hp-reng-hint {
  display: block;
  line-height: 1.3;
  max-width: 22rem;
}
.hp-reng-check { display: inline-flex; align-items: center; }
.hp-reng-cost {
  width: 6.5rem;
  min-width: 5.5rem;
}
.hp-reng-weeks-in {
  width: 3.5rem;
}
.hp-reng-range-cell {
  white-space: nowrap;
  min-width: 5.5rem;
}
.hp-reng-range {
  width: 4.5rem;
  vertical-align: middle;
}
.hp-reng-range-val {
  display: inline-block;
  min-width: 1.1rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  margin-left: .15rem;
}
.hp-reng-kind {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  padding: .12rem .35rem;
  border-radius: 6px;
  white-space: nowrap;
}
.hp-reng-kind-quick { background: #d1fae5; color: #065f46; }
.hp-reng-kind-mid { background: #e0e7ff; color: #3730a3; }
.hp-reng-kind-major { background: #fee2e2; color: #991b1b; }
.hp-reng-kind-doc { background: #dbeafe; color: #1e40af; }
.hp-reng-kind-later { background: #f3f4f6; color: #374151; }
.hp-reng-dec {
  display: inline-block;
  font-size: .78rem;
  font-weight: 700;
  padding: .15rem .4rem;
  border-radius: 8px;
  white-space: nowrap;
}
.hp-reng-dec.is-do { background: #dcfce7; color: #166534; }
.hp-reng-dec.is-doc { background: #dbeafe; color: #1e40af; }
.hp-reng-dec.is-skip { background: #ffedd5; color: #9a3412; }
.hp-reng-dec.is-later { background: #f3f4f6; color: #374151; }
.hp-reng-enova {
  display: grid;
  gap: .35rem;
  padding: .65rem .75rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, #0f766e 6%, var(--bg));
  margin-bottom: .35rem;
}
.hp-reng-enova-item {
  display: flex;
  gap: .45rem;
  align-items: flex-start;
  font-size: .88rem;
  cursor: pointer;
}
.hp-reng-enova-item input { margin-top: .2rem; }
.hp-reng-enova-links { margin: .35rem 0 0; }
.hp-reng-faq { margin-top: .85rem; }
.hp-reng-faq > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .95rem;
}
.hp-reng-faq details { margin: .35rem 0; }
.hp-reng-faq details summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-reng-faq details p { margin: .35rem 0 .15rem; }
.hp-reng-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 4%);
  max-height: min(92vh, 920px);
  overflow: auto;
}
.hp-reng-empty { padding: .5rem 0; }
.hp-reng-letter-row {
  display: flex;
  align-items: stretch;
  gap: .5rem;
  margin-bottom: .35rem;
}
.hp-reng-letter-card {
  flex: 1;
  text-align: center;
  padding: .45rem .5rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-reng-letter-card.is-after {
  border-color: color-mix(in srgb, #0f766e 45%, var(--border));
  background: color-mix(in srgb, #0f766e 8%, var(--bg));
}
.hp-reng-letter-card.is-rest {
  border-color: color-mix(in srgb, #2563eb 40%, var(--border));
  background: color-mix(in srgb, #2563eb 7%, var(--bg));
}
.hp-reng-letter-big {
  display: block;
  font-size: 1.75rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.1;
  margin-top: .1rem;
}
.hp-reng-heat-label,
.hp-reng-rest-label {
  display: block;
  font-size: .95rem;
  font-weight: 700;
  margin-top: .25rem;
  line-height: 1.25;
  font-variant-numeric: tabular-nums;
}
.hp-reng-workorder {
  margin: 0 0 .45rem;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-reng-workorder li { margin: .2rem 0; }
.hp-reng-overinvest {
  margin: .45rem 0;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid #fdba74;
  background: #fff7ed;
}
.hp-reng-triad {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin: .55rem 0;
}
.hp-reng-triad-card {
  text-align: center;
  padding: .4rem .3rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-reng-triad-card strong {
  display: block;
  font-size: 1.25rem;
  font-variant-numeric: tabular-nums;
}
.hp-reng-triad-card.is-do { border-color: color-mix(in srgb, #16a34a 40%, var(--border)); }
.hp-reng-triad-card.is-skip { border-color: color-mix(in srgb, #f59e0b 40%, var(--border)); }
.hp-reng-triad-card.is-later { border-color: color-mix(in srgb, #6b7280 40%, var(--border)); }
.hp-reng-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
  margin: .45rem 0;
}
.hp-reng-gauge {
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-reng-gauge strong {
  display: block;
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
  margin: .1rem 0;
}
.hp-reng-bar-wrap { margin: .45rem 0; }
.hp-reng-bar-label {
  display: flex;
  justify-content: space-between;
  margin-bottom: .2rem;
}
.hp-reng-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, var(--bg));
  overflow: hidden;
}
.hp-reng-bar-fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand, #0f766e) 70%, #22c55e);
  transition: width .2s ease;
}
.hp-reng-bar-fill.is-over {
  background: color-mix(in srgb, #dc2626 75%, #f59e0b);
}
.hp-reng-status {
  margin: .45rem 0;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 30%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, var(--bg));
}
.hp-reng-status-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .95rem;
}
.hp-reng-subh {
  margin: .7rem 0 .3rem;
  font-size: .9rem;
  font-weight: 700;
}
.hp-reng-rank,
.hp-reng-actions,
.hp-reng-over-ul,
.hp-reng-tips-ul {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-reng-rank li,
.hp-reng-actions li,
.hp-reng-over-ul li,
.hp-reng-tips-ul li { margin: .2rem 0; }
.hp-reng-act-do { color: #166534; }
.hp-reng-act-doc { color: #1e40af; }
.hp-reng-act-skip { color: #92400e; }
.hp-reng-act-later { color: #4b5563; }
.hp-reng-over {
  margin: .45rem 0;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid #fde68a;
  background: #fffbeb;
}
.hp-reng-tips {
  margin: .45rem 0;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg));
}
.hp-reng-plan {
  width: 100%;
  font-family: inherit;
  font-size: .82rem;
  resize: vertical;
  min-height: 8rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-reng-plan-label { display: block; margin-top: .35rem; }
.hp-reng-seed-hint {
  margin: .25rem 0;
  padding: .35rem .5rem;
  border-radius: 8px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
}
.hp-reng-nonadvice {
  margin: .65rem 0 0;
  font-size: .78rem;
  opacity: .9;
}
.hp-reng-panel-actions { margin-top: .35rem; }
.hp-reng-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-reng-chip-row .chip {
  cursor: pointer;
  font-size: .78rem;
}
.hp-reng-chip-row .chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 55%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, var(--bg));
}
.hp-reng-letter-scale {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .45rem;
}
.hp-reng-ls-btn {
  min-width: 2.15rem;
  height: 2.15rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  font-weight: 800;
  font-size: .95rem;
  cursor: pointer;
  background: #f8fafc;
  color: #0f172a;
  line-height: 1;
}
.hp-reng-ls-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 1px 4px rgba(15, 23, 42, .08);
}
.hp-reng-ls-btn[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand, #0f766e) 70%, #0f172a);
  outline-offset: 1px;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand, #0f766e) 18%, transparent);
}
.hp-reng-ls-a { background: #166534; color: #fff; border-color: #14532d; }
.hp-reng-ls-b { background: #22c55e; color: #052e16; border-color: #16a34a; }
.hp-reng-ls-c { background: #86efac; color: #14532d; border-color: #4ade80; }
.hp-reng-ls-d { background: #fde047; color: #713f12; border-color: #facc15; }
.hp-reng-ls-e { background: #fdba74; color: #7c2d12; border-color: #fb923c; }
.hp-reng-ls-f { background: #fb7185; color: #4c0519; border-color: #f43f5e; }
.hp-reng-ls-g { background: #b91c1c; color: #fff; border-color: #991b1b; }
.hp-reng-ls-unk { background: #e2e8f0; color: #334155; }
.hp-reng-score {
  display: inline-block;
  min-width: 2.2rem;
  font-size: .78rem;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  padding: .12rem .35rem;
  border-radius: 8px;
  background: #f1f5f9;
  color: #475569;
  text-align: center;
}
.hp-reng-score.is-hi { background: #dcfce7; color: #166534; }
.hp-reng-score.is-mid { background: #e0f2fe; color: #075985; }
.hp-reng-score.is-lo { background: #ffedd5; color: #9a3412; }
.hp-reng-score.is-doc { background: #dbeafe; color: #1e40af; font-size: .7rem; }
.hp-reng-score.is-later { background: #f3f4f6; color: #6b7280; }
.hp-reng-formel {
  margin: .45rem 0 .55rem;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 5%, var(--bg));
}
.hp-reng-formel code {
  display: block;
  margin-top: .2rem;
  font-size: .82rem;
  white-space: normal;
  word-break: break-word;
  color: #0f172a;
}
.hp-reng-scenarios {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin: 0 0 .35rem;
}
.hp-reng-scen {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .5rem;
  display: flex;
  flex-direction: column;
  gap: .12rem;
  background: color-mix(in srgb, var(--bg) 40%, #fff);
}
.hp-reng-scen strong {
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
}
.hp-reng-scen-tag {
  font-size: .72rem;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: .03em;
  opacity: .9;
}
.hp-reng-scen.is-a { border-color: #86efac; background: #f0fdf4; }
.hp-reng-scen.is-b { border-color: #93c5fd; background: #eff6ff; }
.hp-reng-scen.is-c { border-color: #fde68a; background: #fffbeb; }
.hp-reng-scen .btn { margin-top: .25rem; align-self: flex-start; }
.hp-reng-scen-note { margin: 0 0 .55rem; line-height: 1.35; }
.hp-reng-whatif {
  margin: .45rem 0;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid #e0e7ff;
  background: #eef2ff;
}
.hp-reng-whatif-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .35rem;
}
.hp-reng-whatif-grid strong {
  display: block;
  font-variant-numeric: tabular-nums;
  margin-top: .1rem;
}
.hp-reng-timeline {
  display: grid;
  gap: .3rem;
  margin: .2rem 0;
}
.hp-reng-tl-row {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr) auto;
  gap: .35rem;
  align-items: center;
  font-size: .8rem;
}
.hp-reng-tl-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.hp-reng-tl-track {
  height: .45rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 85%, var(--bg));
  overflow: hidden;
}
.hp-reng-tl-bar {
  height: 100%;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand, #0f766e) 65%, #38bdf8);
  min-width: 2px;
}
.hp-reng-tl-bar.is-quick { background: #16a34a; }
.hp-reng-tl-bar.is-major { background: #dc2626; }
.hp-reng-tl-w {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  color: #475569;
  min-width: 2.2rem;
  text-align: right;
}
.hp-reng-status.is-ok {
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
  background: color-mix(in srgb, #16a34a 7%, var(--bg));
}
.hp-reng-status.is-mid {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg));
}
.hp-reng-status.is-tight {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 7%, var(--bg));
}
.hp-reng-temp {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .25rem .55rem;
  margin: 0 0 .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-reng-temp-label {
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.hp-reng-temp.is-klar {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 8%, var(--bg));
}
.hp-reng-temp.is-klar .hp-reng-temp-label { color: #166534; }
.hp-reng-temp.is-sjekk {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 9%, var(--bg));
}
.hp-reng-temp.is-sjekk .hp-reng-temp-label { color: #9a3412; }
.hp-reng-temp.is-mangler {
  border-color: color-mix(in srgb, #94a3b8 50%, var(--border));
  background: color-mix(in srgb, #e2e8f0 55%, var(--bg));
}
.hp-reng-temp.is-mangler .hp-reng-temp-label { color: #475569; }
.hp-reng-horizon-badge {
  margin: .45rem 0;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-reng-horizon-badge.is-ok {
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
  background: color-mix(in srgb, #16a34a 7%, var(--bg));
}
.hp-reng-horizon-badge.is-mid {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg));
}
.hp-reng-horizon-badge.is-tight {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 7%, var(--bg));
}
.hp-reng-buf-whatif {
  margin: .45rem 0;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid #bbf7d0;
  background: #f0fdf4;
}
.hp-reng-buf-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .35rem;
}
.hp-reng-buf-grid strong {
  display: block;
  font-variant-numeric: tabular-nums;
  margin-top: .1rem;
  font-size: .95rem;
}
.hp-reng-privacy { margin-top: .55rem; }
.hp-reng-privacy > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-reng-mobile-jump { display: none; }
@media (max-width: 920px) {
  .hp-reng-mobile-jump { display: inline-flex; }
  .hp-reng-scenarios { grid-template-columns: 1fr; }
  .hp-reng-whatif-grid { grid-template-columns: 1fr; }
  .hp-reng-buf-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .hp-reng-panel { position: static; max-height: none; }
  .hp-reng-gauges { grid-template-columns: 1fr; }
  .hp-reng-hero { grid-template-columns: 1fr; }
  .hp-reng-hero-copy { grid-column: 1; }
  .hp-reng-triad { grid-template-columns: 1fr; }
  .hp-reng-tl-row {
    grid-template-columns: 1fr;
    gap: .15rem;
  }
}

/* —— Kontrakt-klar (sell_contract) —— */
.hp-kk-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-kk-hero-mascot {
  border-radius: 16px;
  grid-row: 1 / span 2;
}
.hp-kk-hero-copy { min-width: 0; grid-column: 2; }
.hp-kk-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-kk-lead-bullets li { margin: .15rem 0; }
.hp-kk-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  padding: .65rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 70%, var(--brand, #0f766e) 6%);
}
.hp-kk-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-kk-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-kk-how-list li { margin: .2rem 0; }
.hp-kk-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .75rem;
}
.hp-kk-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: color-mix(in srgb, #f59e0b 22%, transparent);
  color: #92400e;
}
.hp-kk-demo-note {
  margin: -.35rem 0 .85rem;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: color-mix(in srgb, #f59e0b 12%, transparent);
}
.hp-kk-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.9fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-kk-layout { grid-template-columns: 1fr; }
  .hp-kk-hero { grid-template-columns: auto 1fr; }
}
.hp-kk-section {
  margin: 1.1rem 0 .55rem;
  font-size: 1.05rem;
}
.hp-kk-main .hp-kk-section:first-child { margin-top: 0; }
.hp-kk-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .65rem;
}
.hp-kk-tab.is-on,
.hp-kk-tab[aria-selected="true"] {
  background: color-mix(in srgb, var(--brand, #0f766e) 18%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  font-weight: 700;
}
.hp-kk-tab-pct {
  margin-left: .25rem;
  font-size: .78rem;
  opacity: .85;
  font-weight: 650;
}
.hp-kk-phase { margin-bottom: .5rem; }
.hp-kk-phase-help { margin: 0 0 .55rem; }
.hp-kk-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .45rem;
}
.hp-kk-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: var(--bg-elev, #fff);
  transition: border-color .15s, background .15s;
}
.hp-kk-row.is-critical {
  border-left: 3px solid color-mix(in srgb, #dc2626 70%, var(--border));
}
.hp-kk-row.is-gap {
  background: color-mix(in srgb, #fef2f2 80%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #dc2626 35%, var(--border));
}
.hp-kk-row.is-ok {
  background: color-mix(in srgb, #ecfdf5 75%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #059669 30%, var(--border));
}
.hp-kk-row.is-doing {
  background: color-mix(in srgb, #fffbeb 70%, var(--bg-elev, #fff));
}
.hp-kk-row.is-na { opacity: .72; }
.hp-kk-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-kk-label {
  flex: 1 1 12rem;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  align-items: center;
}
.hp-kk-crit-badge {
  display: inline-block;
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .12rem .35rem;
  border-radius: 5px;
  background: color-mix(in srgb, #dc2626 16%, transparent);
  color: #991b1b;
}
.hp-kk-status-wrap { flex: 0 0 auto; }
.hp-kk-status {
  min-width: 8.5rem;
  font-size: .88rem;
}
.hp-kk-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
}
.hp-kk-due {
  display: block;
  width: 100%;
  margin-top: .15rem;
  font-size: .78rem;
}
.hp-kk-due.is-soon {
  color: #b45309;
  font-weight: 650;
}
.hp-kk-due.is-overdue {
  color: #b91c1c;
  font-weight: 700;
}
.hp-kk-row.is-due-soon {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
}
.hp-kk-row.is-overdue {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #dc2626 18%, transparent);
}
.hp-kk-row.is-home-hidden { display: none !important; }
.hp-kk-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .5rem;
}
.hp-kk-filter.is-on {
  background: color-mix(in srgb, var(--brand, #0f766e) 16%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  font-weight: 700;
}
.hp-kk-filter-count { margin: 0 0 .55rem; }
.hp-kk-next {
  margin-bottom: .75rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-kk-next-ol {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-kk-next-ol li { margin: .2rem 0; }
.hp-kk-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .9rem 1rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--brand, #0f766e) 4%);
}
.hp-kk-countdown {
  display: grid;
  gap: .1rem;
  margin-bottom: .75rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-kk-countdown strong {
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.hp-kk-countdown.is-ok {
  border-color: color-mix(in srgb, #059669 35%, var(--border));
  background: color-mix(in srgb, #ecfdf5 70%, transparent);
}
.hp-kk-countdown.is-soon {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #fffbeb 70%, transparent);
}
.hp-kk-countdown.is-today {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #fef2f2 75%, transparent);
}
.hp-kk-countdown.is-past {
  border-color: color-mix(in srgb, #64748b 40%, var(--border));
  background: color-mix(in srgb, #f1f5f9 80%, transparent);
}
.hp-kk-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .75rem;
}
.hp-kk-gauge {
  display: grid;
  gap: .1rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-kk-gauge strong {
  font-size: 1.15rem;
  font-weight: 800;
}
.hp-kk-gauge-crit strong {
  color: #b91c1c;
}
.hp-kk-bars {
  display: grid;
  gap: .35rem;
  margin-bottom: .75rem;
}
.hp-kk-bar-row {
  display: grid;
  grid-template-columns: minmax(5rem, 7.5rem) 1fr;
  gap: .4rem;
  align-items: center;
}
.hp-kk-bar {
  height: .55rem;
  border-radius: 99px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-kk-bar-fill {
  display: block;
  height: 100%;
  border-radius: 99px;
  background: color-mix(in srgb, var(--brand, #0f766e) 85%, #059669);
  transition: width .2s ease;
}
.hp-kk-timeline {
  margin-bottom: .75rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-kk-tl-track {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .35rem;
  position: relative;
}
.hp-kk-tl-node {
  display: grid;
  gap: .15rem;
  justify-items: center;
  text-align: center;
  font-size: .78rem;
}
.hp-kk-tl-dot {
  width: .7rem;
  height: .7rem;
  border-radius: 99px;
  background: color-mix(in srgb, var(--border) 80%, #94a3b8);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--border) 40%, transparent);
}
.hp-kk-tl-node.is-past .hp-kk-tl-dot {
  background: #059669;
  box-shadow: 0 0 0 3px color-mix(in srgb, #059669 25%, transparent);
}
.hp-kk-tl-node.is-soon .hp-kk-tl-dot {
  background: #f59e0b;
  box-shadow: 0 0 0 3px color-mix(in srgb, #f59e0b 28%, transparent);
}
.hp-kk-tl-node.is-today .hp-kk-tl-dot {
  background: #dc2626;
  box-shadow: 0 0 0 3px color-mix(in srgb, #dc2626 28%, transparent);
}
.hp-kk-tl-node.is-empty .hp-kk-tl-dot {
  background: transparent;
  border: 2px dashed color-mix(in srgb, var(--border) 90%, #94a3b8);
  box-shadow: none;
}
.hp-kk-tl-label { font-weight: 650; }
.hp-kk-tl-date { opacity: .9; }
.hp-kk-date-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-kk-fb-block,
.hp-kk-inv-block {
  margin: 0 0 .75rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 5%);
}
.hp-kk-fb-block.is-flash,
.hp-kk-row.is-flash {
  animation: hp-kk-flash 1.1s ease;
}
@keyframes hp-kk-flash {
  0%, 100% { box-shadow: none; }
  30% { box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand, #0f766e) 45%, transparent); }
}
.hp-kk-fb-chips {
  display: grid;
  gap: .4rem;
}
.hp-kk-fb-item {
  display: grid;
  grid-template-columns: minmax(7rem, 1.1fr) minmax(7rem, 0.9fr) auto;
  gap: .35rem .5rem;
  align-items: center;
}
.hp-kk-fb-label {
  font-size: .84rem;
  font-weight: 600;
}
.hp-kk-fb-st {
  font-size: .84rem;
  min-width: 0;
}
.hp-kk-fb-due {
  font-size: .82rem;
  max-width: 9.5rem;
}
.hp-kk-fb-summary { margin: .4rem 0 0; }
.hp-kk-inv-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
}
.hp-kk-phase-suggest {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: center;
  margin: 0 0 .55rem;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #fffbeb 75%, transparent);
  font-size: .86rem;
}
.hp-kk-filter-n {
  font-size: .75rem;
  font-weight: 700;
  opacity: .85;
  margin-left: .15rem;
}
.hp-kk-filter-empty {
  margin: 0 0 .5rem;
  color: #b45309;
}
.hp-kk-jump {
  appearance: none;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--brand, #0f766e) 45%, transparent);
  text-underline-offset: 2px;
}
.hp-kk-jump:hover,
.hp-kk-jump:focus-visible {
  color: var(--brand, #0f766e);
  outline: none;
}
.hp-kk-next-ol .hp-kk-jump,
.hp-kk-critical-ul .hp-kk-jump {
  width: 100%;
}
.hp-kk-seeds {
  margin-bottom: .75rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-kk-seed-row {
  flex-wrap: wrap;
  gap: .35rem;
}
.hp-kk-readiness {
  margin-bottom: .75rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-kk-ready-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .95rem;
}
.hp-kk-readiness.is-ok {
  border-color: color-mix(in srgb, #059669 40%, var(--border));
  background: color-mix(in srgb, #ecfdf5 75%, transparent);
}
.hp-kk-readiness.is-mid {
  border-color: color-mix(in srgb, #f59e0b 35%, var(--border));
  background: color-mix(in srgb, #fffbeb 70%, transparent);
}
.hp-kk-readiness.is-tight {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #fef2f2 75%, transparent);
}
.hp-kk-critical-box {
  margin-bottom: .75rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #dc2626 30%, var(--border));
  background: color-mix(in srgb, #fef2f2 70%, transparent);
}
.hp-kk-critical-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
  list-style: disc;
}
.hp-kk-critical-ul li { margin: .2rem 0; }
.hp-kk-snapshot {
  margin-bottom: .75rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 30%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 5%, transparent);
}
.hp-kk-snapshot p { margin: .15rem 0; }
.hp-kk-commit-text {
  width: 100%;
  font-size: .8rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  line-height: 1.35;
}
.hp-kk-nonadvice {
  margin: .65rem 0 0;
  font-size: .78rem;
  opacity: .9;
}
.hp-kk-faq details { margin: .35rem 0; }
.hp-kk-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-kk-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 700px) {
  .hp-kk-fb-item {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 560px) {
  .hp-kk-panel { position: static; max-height: none; }
  /* Gauges stay 2×2 (4 cells) — only timeline stacks on narrow screens */
  .hp-kk-gauges { grid-template-columns: 1fr 1fr; }
  .hp-kk-hero { grid-template-columns: 1fr; }
  .hp-kk-hero-copy { grid-column: 1; }
  .hp-kk-hero-mascot { grid-row: auto; }
  .hp-kk-bar-row { grid-template-columns: 1fr; }
  .hp-kk-tl-track { grid-template-columns: 1fr; gap: .5rem; }
}

/* —— Annonse A/B-utkast (sell-salgsannonse-a-b / ad_ab) —— */
.hp-ab { margin: 0 0 .5rem; }
.hp-ab-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-ab-hero-mascot {
  border-radius: 14px;
  background: color-mix(in srgb, var(--accent, #0d9488) 12%, transparent);
}
.hp-ab-hero-copy { min-width: 0; grid-column: 2; }
.hp-ab-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
  color: var(--muted, #64748b);
}
.hp-ab-lead-bullets li { margin: .15rem 0; }
.hp-ab-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 80%, var(--bg));
}
.hp-ab-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-ab-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
  color: var(--muted, #64748b);
}
.hp-ab-how-list li { margin: .2rem 0; }
.hp-ab-demos,
.hp-ab-presets,
.hp-ab-pick {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  margin: 0 0 .55rem;
}
.hp-ab-demo-badge {
  display: inline-block;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 22%, transparent);
  color: #92400e;
  vertical-align: middle;
}
.hp-ab-demo-note {
  margin: 0 0 .75rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: color-mix(in srgb, #f59e0b 12%, transparent);
}
.hp-ab-demos .chip.is-on,
.hp-ab-demos .chip[aria-pressed="true"],
.hp-ab-presets .chip.is-on,
.hp-ab-pick .chip.is-on,
.hp-ab-pick .chip[aria-pressed="true"] {
  background: color-mix(in srgb, var(--accent, #0d9488) 18%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--accent, #0d9488) 45%, var(--border));
  font-weight: 650;
}
.hp-ab-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(300px, 1.1fr);
  gap: 1rem 1.25rem;
  align-items: start;
}
@media (max-width: 920px) {
  .hp-ab-layout { grid-template-columns: 1fr; }
  .hp-ab-hero { grid-template-columns: auto 1fr; }
}
.hp-ab-section {
  font-size: 1rem;
  font-weight: 750;
  margin: 1rem 0 .45rem;
}
.hp-ab-main .hp-ab-section:first-child { margin-top: 0; }
.hp-ab-variant-cfg {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 70%, var(--bg));
  display: flex;
  flex-direction: column;
  gap: .35rem;
}
.hp-ab-variant-cfg.is-a {
  border-color: color-mix(in srgb, #0d9488 35%, var(--border));
  background: color-mix(in srgb, #0d9488 6%, var(--bg-elev, #fff));
}
.hp-ab-variant-cfg.is-b {
  border-color: color-mix(in srgb, #6366f1 35%, var(--border));
  background: color-mix(in srgb, #6366f1 6%, var(--bg-elev, #fff));
}
.hp-ab-cfg-label {
  font-weight: 750;
  font-size: .88rem;
  letter-spacing: .01em;
}
.hp-ab-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--bg));
  box-shadow: 0 1px 0 color-mix(in srgb, var(--fg, #0f172a) 4%, transparent);
  max-height: calc(100vh - 1.5rem);
  overflow: auto;
}
.hp-ab-empty { padding: .35rem 0; }
.hp-ab-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin: 0 0 .45rem;
}
.hp-ab-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .55rem;
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.hp-ab-gauge.is-a {
  border-color: color-mix(in srgb, #0d9488 30%, var(--border));
}
.hp-ab-gauge.is-b {
  border-color: color-mix(in srgb, #6366f1 30%, var(--border));
}
.hp-ab-gauge strong {
  font-size: 1.15rem;
  font-weight: 750;
  letter-spacing: -0.01em;
}
.hp-ab-scorebar {
  height: 7px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  overflow: hidden;
  margin-top: .2rem;
}
.hp-ab-scorebar-fill {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0d9488, #14b8a6);
  transition: width .25s ease;
}
.hp-ab-scorebar-fill.is-b {
  background: linear-gradient(90deg, #6366f1, #818cf8);
}
.hp-ab-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .65rem;
  align-items: start;
}
@media (max-width: 640px) {
  .hp-ab-cols { grid-template-columns: 1fr; }
  .hp-ab-gauges { grid-template-columns: 1fr; }
}
.hp-ab-col {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .6rem;
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev, #fff));
  min-width: 0;
}
.hp-ab-col.is-a {
  border-color: color-mix(in srgb, #0d9488 28%, var(--border));
}
.hp-ab-col.is-b {
  border-color: color-mix(in srgb, #6366f1 28%, var(--border));
}
.hp-ab-col.is-fav {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent, #0d9488) 35%, transparent);
}
.hp-ab-col-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .35rem .5rem;
  margin-bottom: .4rem;
}
.hp-ab-fav-pill {
  font-size: .68rem;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, #0d9488 18%, transparent);
  color: color-mix(in srgb, #0f766e 80%, var(--fg, #0f172a));
}
.hp-ab-title-out {
  width: 100%;
  font-weight: 650;
  font-size: .9rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .4rem .5rem;
  margin: .15rem 0 .4rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-ab-body-out {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .74rem;
  line-height: 1.45;
  resize: vertical;
  min-height: 10rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .5rem .55rem;
  margin: .15rem 0 .25rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-ab-checks {
  margin: .35rem 0 0;
  padding-left: 0;
  list-style: none;
  font-size: .78rem;
}
.hp-ab-checks li {
  margin: .2rem 0;
  padding: .15rem .3rem;
  border-radius: 7px;
}
.hp-ab-checks li.is-ok {
  background: color-mix(in srgb, #10b981 12%, transparent);
  color: color-mix(in srgb, #065f46 70%, var(--fg, #0f172a));
}
.hp-ab-checks li.is-miss {
  background: color-mix(in srgb, #f59e0b 10%, transparent);
  color: color-mix(in srgb, #92400e 65%, var(--fg, #0f172a));
}
.hp-ab-subh {
  font-size: .88rem;
  font-weight: 700;
  margin: .75rem 0 .3rem;
}
.hp-ab-summary {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .74rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .5rem .55rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-ab-tips-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  color: var(--muted, #64748b);
}
.hp-ab-tips-ul li { margin: .2rem 0; }
.hp-ab-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-ab-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-ab-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-ab-faq details p { margin: .35rem 0 .15rem; }
.hp-ab-winner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .55rem;
  margin: 0 0 .55rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  background: color-mix(in srgb, var(--accent, #0d9488) 8%, var(--bg-elev, #fff));
  border: 1px solid color-mix(in srgb, var(--accent, #0d9488) 22%, var(--border));
}
.hp-ab-winner-pill {
  display: inline-block;
  font-size: .72rem;
  font-weight: 750;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .12rem .45rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #0d9488) 18%, transparent);
  color: color-mix(in srgb, #0f766e 85%, var(--fg, #0f172a));
}
.hp-ab-dim {
  list-style: none;
  margin: 0 0 .75rem;
  padding: 0;
  font-size: .78rem;
}
.hp-ab-dim li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: .25rem .5rem;
  padding: .28rem .35rem;
  border-radius: 8px;
  margin: .15rem 0;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-ab-dim-lab { flex: 1 1 10rem; color: var(--muted, #64748b); }
.hp-ab-dim-ab {
  display: inline-flex;
  gap: .45rem;
  font-weight: 650;
}
.hp-ab-dim-ab .is-ok { color: color-mix(in srgb, #065f46 75%, var(--fg, #0f172a)); }
.hp-ab-dim-ab .is-miss { color: color-mix(in srgb, #92400e 70%, var(--fg, #0f172a)); }
.hp-ab-hi-chips,
.hp-ab-lo-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem;
  margin: .3rem 0 0;
}
.hp-ab-ready {
  margin: .65rem 0 .15rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 75%, var(--bg));
}
.hp-ab-ready.is-high {
  border-color: color-mix(in srgb, #10b981 35%, var(--border));
  background: color-mix(in srgb, #10b981 8%, var(--bg-elev, #fff));
}
.hp-ab-ready.is-mid {
  border-color: color-mix(in srgb, #f59e0b 30%, var(--border));
}
.hp-ab-ready.is-low {
  border-color: color-mix(in srgb, #94a3b8 35%, var(--border));
}
.hp-ab-ready-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: .35rem;
  margin-bottom: .3rem;
}
.hp-ab-ready-bar {
  height: 7px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  overflow: hidden;
  margin-bottom: .35rem;
}
.hp-ab-ready-fill {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0d9488, #14b8a6);
  transition: width .25s ease;
}
.hp-ab-ready-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .2rem .55rem;
  font-size: .8rem;
}
@media (max-width: 560px) {
  .hp-ab-ready-list { grid-template-columns: 1fr; }
}
.hp-ab-ready-list li.is-ok {
  color: color-mix(in srgb, #065f46 70%, var(--fg, #0f172a));
}
.hp-ab-ready-list li.is-miss {
  color: color-mix(in srgb, #92400e 65%, var(--fg, #0f172a));
}
.hp-ab-seeds {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  margin: .55rem 0 0;
}
.hp-ab-samewarn,
.hp-ab-hype {
  margin: 0 0 .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  font-size: .84rem;
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.hp-ab-samewarn {
  background: color-mix(in srgb, #f59e0b 12%, var(--bg-elev, #fff));
  border: 1px solid color-mix(in srgb, #f59e0b 35%, var(--border));
}
.hp-ab-hype {
  background: color-mix(in srgb, #f43f5e 10%, var(--bg-elev, #fff));
  border: 1px solid color-mix(in srgb, #f43f5e 28%, var(--border));
}
.hp-ab-col-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  margin: 0 0 .4rem;
}
.hp-ab-title-meta {
  font-weight: 500;
  opacity: .85;
}
.hp-ab-title-out.is-ok {
  border-color: color-mix(in srgb, #10b981 40%, var(--border));
}
.hp-ab-title-out.is-empty {
  border-color: color-mix(in srgb, #94a3b8 40%, var(--border));
}
.hp-ab-title-out.is-short,
.hp-ab-title-out.is-long {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
}
.hp-ab-title-out.is-toolong {
  border-color: color-mix(in srgb, #f43f5e 45%, var(--border));
}
.hp-ab-mobile-bar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .4rem .65rem;
  padding: .55rem .75rem calc(.55rem + env(safe-area-inset-bottom, 0px));
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--bg));
  border-top: 1px solid var(--border);
  box-shadow: 0 -4px 18px color-mix(in srgb, var(--fg, #0f172a) 8%, transparent);
}
.hp-ab-mobile-scores {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .45rem .75rem;
  font-size: .86rem;
}
.hp-ab-mobile-a strong { color: #0f766e; }
.hp-ab-mobile-b strong { color: #4f46e5; }
@media (min-width: 921px) {
  .hp-ab-mobile-bar { display: none !important; }
}
@media (max-width: 920px) {
  .hp-ab { padding-bottom: 4.5rem; }
}
@media (max-width: 560px) {
  .hp-ab-panel { position: static; max-height: none; }
  .hp-ab-hero { grid-template-columns: 1fr; }
  .hp-ab-hero-copy { grid-column: 1; }
  .hp-ab-hero-mascot { grid-row: auto; }
}

/* —— Fraflyttingsplan selger (sell-flytte-ut / sell_flytte) —— */
.hp-sfu { margin: 0 0 .5rem; }
.hp-sfu-hero {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-sfu-hero-mascot {
  border-radius: 16px;
  width: 72px;
  height: 72px;
  object-fit: cover;
}
.hp-sfu-hero-copy { min-width: 0; grid-column: 2; }
.hp-sfu-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-sfu-lead-bullets li { margin: .15rem 0; }
.hp-sfu-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem;
  background: color-mix(in srgb, var(--bg) 55%, var(--bg-elev, #fff));
}
.hp-sfu-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-sfu-how-list {
  margin: .35rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-sfu-how-list li { margin: .2rem 0; }
.hp-sfu-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .85rem;
}
.hp-sfu-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
  border: 1px solid #fcd34d;
}
.hp-sfu-demo-note {
  margin: -.35rem 0 .85rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-sfu-layout {
  display: grid;
  grid-template-columns: 1.35fr minmax(260px, .9fr);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-sfu-layout { grid-template-columns: 1fr; }
  .hp-sfu-hero { grid-template-columns: auto 1fr; }
}
.hp-sfu-section {
  margin: 1rem 0 .55rem;
  font-size: 1.02rem;
  font-weight: 750;
}
.hp-sfu-overlap-box {
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .7rem .8rem;
  margin: .55rem 0 .85rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-sfu-overlap-box.is-hot {
  border-color: #fbbf24;
  background: #fffbeb;
}
.hp-sfu-overlap-box.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-sfu-overlap-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
}
.hp-sfu-overlap-grid > div {
  display: flex;
  flex-direction: column;
  gap: .1rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .55rem;
  background: var(--card, #fff);
}
.hp-sfu-overlap-grid strong {
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.hp-sfu-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .65rem;
}
.hp-sfu-tab.is-on,
.hp-sfu-tab[aria-selected="true"] {
  background: color-mix(in srgb, var(--primary, #2563eb) 18%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--primary, #2563eb) 45%, var(--border));
  font-weight: 700;
}
.hp-sfu-tab.is-suggested:not(.is-on) {
  box-shadow: inset 0 0 0 1px #f59e0b;
}
.hp-sfu-tab-pct {
  margin-left: .25rem;
  font-size: .75rem;
  opacity: .85;
  font-weight: 650;
}
.hp-sfu-phase-help { margin: 0 0 .55rem; }
.hp-sfu-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-sfu-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .65rem;
  background: var(--card, #fff);
}
.hp-sfu-row.is-critical {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
}
.hp-sfu-row.is-done {
  opacity: .78;
  background: color-mix(in srgb, #ecfdf5 55%, var(--card, #fff));
}
.hp-sfu-row.is-doing {
  background: color-mix(in srgb, #eff6ff 60%, var(--card, #fff));
}
.hp-sfu-row.is-gap {
  border-color: #fbbf24;
}
.hp-sfu-row.is-overdue {
  border-color: #f87171;
  background: #fef2f2;
}
.hp-sfu-row-top {
  display: flex;
  gap: .55rem;
  justify-content: space-between;
  align-items: flex-start;
}
.hp-sfu-row-label { min-width: 0; flex: 1; }
.hp-sfu-crit-badge {
  display: inline-block;
  font-size: .7rem;
  font-weight: 750;
  padding: .05rem .35rem;
  border-radius: 999px;
  background: #fff7ed;
  color: #c2410c;
  border: 1px solid #fdba74;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-sfu-due { display: block; margin-top: .15rem; }
.hp-sfu-status-wrap { flex-shrink: 0; }
.hp-sfu-status {
  min-width: 8.5rem;
  font-size: .86rem;
}
.hp-sfu-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .35rem .5rem;
}
.hp-sfu-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: .85rem .9rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-sfu-countdown {
  display: flex;
  flex-direction: column;
  gap: .1rem;
  border-radius: 14px;
  padding: .7rem .8rem;
  margin-bottom: .55rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
  text-align: center;
}
.hp-sfu-countdown strong {
  font-size: 1.55rem;
  font-weight: 850;
  letter-spacing: -0.03em;
}
.hp-sfu-countdown-move strong { font-size: 1.15rem; }
.hp-sfu-countdown.is-soon {
  border-color: #fbbf24;
  background: #fffbeb;
}
.hp-sfu-countdown.is-today {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-sfu-countdown.is-past {
  border-color: #93c5fd;
  background: #eff6ff;
}
.hp-sfu-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin-bottom: .75rem;
}
.hp-sfu-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  background: var(--card, #fff);
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-sfu-gauge strong { font-size: 1.2rem; font-weight: 800; letter-spacing: -0.02em; }
.hp-sfu-bars { display: grid; gap: .4rem; margin-bottom: .75rem; }
.hp-sfu-bar-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(80px, 1.1fr);
  gap: .4rem;
  align-items: center;
}
.hp-sfu-bar {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-sfu-bar-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #f59e0b, #ea580c);
  transition: width .25s ease;
}
.hp-sfu-readiness {
  border-radius: 12px;
  padding: .65rem .75rem;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-sfu-readiness.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-sfu-readiness.is-mid {
  border-color: #fde68a;
  background: #fffbeb;
}
.hp-sfu-readiness.is-tight {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-sfu-ready-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-sfu-warn {
  border: 1px solid #fecaca;
  background: #fff1f2;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-sfu-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-sfu-warn-ul li { margin: .15rem 0; }
.hp-sfu-subh {
  margin: .85rem 0 .35rem;
  font-size: .9rem;
  font-weight: 750;
}
.hp-sfu-timeline {
  margin: 0 0 .5rem;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-sfu-timeline li { margin: .25rem 0; }
.hp-sfu-timeline li.is-overdue { color: #b91c1c; }
.hp-sfu-summary {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 10rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-sfu-nonadvice {
  margin: .75rem 0 0;
}
.hp-sfu-faq details { margin: .35rem 0; }
.hp-sfu-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-sfu-faq details p { margin: .35rem 0 .15rem; }
.hp-sfu-scenario-row {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .15rem 0 .55rem;
}
.hp-sfu-daycost {
  margin-top: .45rem;
  display: flex;
  flex-direction: column;
  gap: .05rem;
  padding: .35rem .5rem;
  border-radius: 10px;
  background: color-mix(in srgb, var(--bg) 55%, var(--bg-elev, #fff));
  border: 1px dashed var(--border);
}
.hp-sfu-daycost strong { font-size: .95rem; }
.hp-sfu-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-sfu-filter.is-on {
  background: color-mix(in srgb, var(--primary, #2563eb) 16%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--primary, #2563eb) 40%, var(--border));
  font-weight: 700;
}
.hp-sfu-filter-n {
  margin-left: .2rem;
  font-size: .75rem;
  opacity: .85;
  font-weight: 650;
}
.hp-sfu-filter-count { margin: -.15rem 0 .45rem; }
.hp-sfu-filter-empty {
  margin: 0 0 .55rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
}
.hp-sfu-datestrip {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: .4rem;
  margin: 0 0 .7rem;
}
.hp-sfu-datechip {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .4rem .45rem;
  background: var(--card, #fff);
  display: flex;
  flex-direction: column;
  gap: .05rem;
  text-align: center;
  opacity: .72;
}
.hp-sfu-datechip.is-set { opacity: 1; }
.hp-sfu-datechip.is-ot.is-set {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-sfu-datechip strong {
  font-size: .88rem;
  font-weight: 750;
  letter-spacing: -0.02em;
}
.hp-sfu-next {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .65rem;
  margin-bottom: .55rem;
  background: var(--card, #fff);
}
.hp-sfu-next .btn { margin-top: .35rem; }
.hp-sfu-seed { margin: 0 0 .55rem; flex-wrap: wrap; }
.hp-sfu-row.is-flash {
  outline: 2px solid #f59e0b;
  box-shadow: 0 0 0 4px color-mix(in srgb, #f59e0b 25%, transparent);
  transition: box-shadow .2s ease, outline-color .2s ease;
}
.hp-sfu-date-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .15rem 0 .55rem;
}
.hp-sfu-rail-wrap {
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .65rem .75rem .8rem;
  margin: .35rem 0 .85rem;
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev, #fff));
}
.hp-sfu-rail {
  position: relative;
  height: 4.2rem;
  margin: .55rem .35rem .15rem;
}
.hp-sfu-rail-line {
  position: absolute;
  left: 0;
  right: 0;
  top: 1.05rem;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, #fdba74, #86efac 55%, #93c5fd);
  opacity: .85;
}
.hp-sfu-rail-mark {
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  width: max-content;
  max-width: 5.5rem;
  z-index: 1;
}
.hp-sfu-rail-dot {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px var(--border);
  background: #f59e0b;
  margin-top: .75rem;
}
.hp-sfu-rail-mark.is-ot .hp-sfu-rail-dot { background: #16a34a; }
.hp-sfu-rail-mark.is-new .hp-sfu-rail-dot { background: #2563eb; }
.hp-sfu-rail-mark.is-move .hp-sfu-rail-dot { background: #ea580c; }
.hp-sfu-rail-mark.is-today .hp-sfu-rail-dot {
  background: #64748b;
  width: 9px;
  height: 9px;
  margin-top: .85rem;
}
.hp-sfu-rail-lab {
  margin-top: .35rem;
  font-size: .68rem;
  line-height: 1.2;
  text-align: center;
  font-weight: 650;
  color: var(--text, #0f172a);
}
.hp-sfu-rail-lab em {
  font-style: normal;
  font-weight: 500;
  opacity: .8;
}
.hp-sfu-mode-row {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-sfu-mode-badge {
  display: inline-block;
  font-size: .86rem;
  font-weight: 750;
  padding: .2rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-sfu-mode-badge.is-double {
  background: #fff7ed;
  border-color: #fdba74;
  color: #c2410c;
}
.hp-sfu-mode-badge.is-gap {
  background: #eff6ff;
  border-color: #93c5fd;
  color: #1d4ed8;
}
.hp-sfu-mode-badge.is-sync {
  background: #f0fdf4;
  border-color: #86efac;
  color: #15803d;
}
.hp-sfu-mode-badge.is-manual,
.hp-sfu-mode-badge.is-move {
  background: #f8fafc;
  border-color: #cbd5e1;
  color: #334155;
}
.hp-sfu-overlap-box.is-gap {
  border-color: #93c5fd;
  background: #eff6ff;
}
.hp-sfu-months {
  margin-top: .55rem;
  padding-top: .45rem;
  border-top: 1px dashed var(--border);
}
.hp-sfu-months-table-wrap { overflow-x: auto; }
.hp-sfu-months-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .82rem;
}
.hp-sfu-months-table th,
.hp-sfu-months-table td {
  text-align: left;
  padding: .28rem .4rem;
  border-bottom: 1px solid var(--border);
}
.hp-sfu-months-table th {
  font-weight: 700;
  font-size: .75rem;
  opacity: .85;
}
.hp-sfu-tl-item {
  cursor: pointer;
  border-radius: 8px;
  padding: .1rem .15rem;
}
.hp-sfu-tl-item:hover,
.hp-sfu-tl-item:focus {
  background: color-mix(in srgb, var(--primary, #2563eb) 10%, transparent);
  outline: none;
}
.hp-sfu-formula {
  margin-top: .55rem;
  padding: .5rem .6rem;
  border-radius: 12px;
  border: 1px dashed var(--border);
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.hp-sfu-formula code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.35;
  word-break: break-word;
  color: var(--text, #0f172a);
}
.hp-sfu-whatif {
  margin-top: .55rem;
  padding-top: .45rem;
  border-top: 1px dashed var(--border);
}
.hp-sfu-whatif-table-wrap { overflow-x: auto; }
.hp-sfu-whatif-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .82rem;
}
.hp-sfu-whatif-table th,
.hp-sfu-whatif-table td {
  text-align: left;
  padding: .28rem .4rem;
  border-bottom: 1px solid var(--border);
}
.hp-sfu-whatif-table th {
  font-weight: 700;
  font-size: .75rem;
  opacity: .85;
}
.hp-sfu-whatif-row {
  cursor: pointer;
  transition: background .15s ease;
}
.hp-sfu-whatif-row:hover,
.hp-sfu-whatif-row:focus {
  background: color-mix(in srgb, var(--primary, #2563eb) 10%, transparent);
  outline: none;
}
.hp-sfu-whatif-row.is-on {
  background: color-mix(in srgb, #fef3c7 70%, var(--card, #fff));
  font-weight: 650;
}
.hp-sfu-packlist {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .35rem .65rem;
  margin: 0 0 .25rem;
  padding: .55rem .65rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--card, #fff);
}
.hp-sfu-pack-item {
  display: flex;
  gap: .4rem;
  align-items: flex-start;
  font-size: .88rem;
  cursor: pointer;
  margin: 0;
}
.hp-sfu-pack-item input {
  margin-top: .2rem;
  flex-shrink: 0;
}
.hp-sfu-budget-hint { opacity: .9; }
.hp-sfu-gauge-crit.is-hot {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-sfu-gauge-crit.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-sfu-gauges {
  grid-template-columns: 1fr 1fr;
}
@media (max-width: 560px) {
  .hp-sfu-panel { position: static; }
  .hp-sfu-gauges { grid-template-columns: 1fr; }
  .hp-sfu-hero { grid-template-columns: 1fr; }
  .hp-sfu-hero-copy { grid-column: 1; }
  .hp-sfu-hero-mascot { grid-row: auto; }
  .hp-sfu-bar-row { grid-template-columns: 1fr; }
  .hp-sfu-overlap-grid { grid-template-columns: 1fr; }
  .hp-sfu-datestrip { grid-template-columns: 1fr; }
  .hp-sfu-rail { height: 5rem; }
  .hp-sfu-packlist { grid-template-columns: 1fr; }
}

/* —— Leie vs eie (rent_in-leie-vs-eie · rent_buy) —— */
.hp-lve { margin: 0; }
.hp-lve-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-lve-hero-copy { min-width: 0; grid-column: 1; }
.hp-lve-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  justify-self: end;
  border-radius: 14px;
  object-fit: cover;
}
.hp-lve-how { grid-column: 1 / -1; }
.hp-lve-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  line-height: 1.45;
}
.hp-lve-lead-bullets li { margin: .2rem 0; }
.hp-lve-how {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .65rem;
  background: color-mix(in srgb, var(--bg-elev) 80%, transparent);
}
.hp-lve-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-lve-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.2rem;
  font-size: .84rem;
  line-height: 1.45;
}
.hp-lve-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg-elev));
  color: color-mix(in srgb, #b45309 80%, var(--text));
  border: 1px solid color-mix(in srgb, #f59e0b 40%, var(--border));
  vertical-align: middle;
}
.hp-lve-demo-note,
.hp-lve-profile-note {
  margin: .35rem 0 .65rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
  border: 1px dashed color-mix(in srgb, #f59e0b 45%, var(--border));
}
.hp-lve-profile-note {
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-lve-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  margin: .35rem 0 .5rem;
}
.hp-lve-demos .chip { font-size: .8rem; }
.hp-lve-demos .chip.active,
.hp-lve-demos .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  outline-offset: 1px;
}
.hp-lve-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-lve-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
  gap: 1rem;
  align-items: start;
}
.hp-lve-main { order: 1; min-width: 0; }
.hp-lve-panel {
  order: 2;
  position: sticky;
  top: .75rem;
  padding: .85rem .9rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--text) 4%, transparent);
}
.hp-lve-section {
  font-size: .95rem;
  font-weight: 700;
  margin: 1rem 0 .5rem;
  letter-spacing: -0.01em;
}
.hp-lve-section:first-child { margin-top: 0; }
.hp-lve-quick-row {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-top: .25rem;
}
.hp-lve-quick .chip-sm.active,
.hp-lve-quick .chip-sm[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  outline-offset: 1px;
  font-weight: 700;
}
.hp-lve-check {
  display: flex;
  align-items: flex-start;
  gap: .45rem;
  font-size: .88rem;
  margin-top: .35rem;
  cursor: pointer;
}
.hp-lve-check input { margin-top: .2rem; }
.hp-lve-src {
  display: inline-block;
  margin-top: .2rem;
  font-size: .75rem;
  color: color-mix(in srgb, var(--brand) 80%, var(--text));
}
.hp-lve-live { text-align: center; margin-bottom: .65rem; }
.hp-lve-winner {
  font-size: 1.05rem;
  font-weight: 750;
  margin: .2rem 0 .45rem;
  letter-spacing: -0.01em;
}
.hp-lve-compare-nums {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .35rem 0;
  text-align: center;
}
.hp-lve-compare-nums strong {
  display: block;
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
  margin-top: .15rem;
}
.hp-lve-side {
  padding: .4rem .45rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
  transition: border-color .15s, background .15s;
}
.hp-lve-side.is-win {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 55%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, var(--bg-elev));
  font-weight: 650;
}
.hp-lve-nonadvice {
  font-size: .72rem;
  opacity: .85;
  margin: .2rem 0 0;
}
.hp-lve-formula {
  margin: .55rem 0;
  padding: .5rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, var(--bg-elev));
}
.hp-lve-formula-line {
  margin: .15rem 0;
  font-size: .78rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  line-height: 1.35;
  word-break: break-word;
}
.hp-lve-wealth-bar-wrap {
  margin: .55rem 0;
  padding: .5rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev));
}
.hp-lve-wbar-row {
  display: grid;
  grid-template-columns: 2.4rem 1fr;
  gap: .35rem;
  align-items: center;
  margin: .28rem 0;
}
.hp-lve-wbar-lab {
  font-size: .72rem;
  font-weight: 650;
  opacity: .85;
}
.hp-lve-wbar-track {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--text) 8%, var(--bg));
  overflow: hidden;
}
.hp-lve-wbar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  min-width: 2px;
  transition: width .2s ease;
}
.hp-lve-wbar-own {
  background: color-mix(in srgb, #b45309 70%, var(--brand, #0f766e));
}
.hp-lve-wbar-rent {
  background: color-mix(in srgb, #15803d 75%, var(--brand, #0f766e));
}
@media (prefers-reduced-motion: reduce) {
  .hp-lve-wbar-fill { transition: none; }
}
.hp-lve-horizon,
.hp-lve-scen {
  margin: .7rem 0;
  padding: .55rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev));
}
.hp-lve-hz-row,
.hp-lve-scen-row {
  cursor: pointer;
}
.hp-lve-hz-row:hover,
.hp-lve-scen-row:hover,
.hp-lve-hz-row:focus-visible,
.hp-lve-scen-row:focus-visible {
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, transparent);
  outline: none;
}
.hp-lve-quick .chip-sm.active,
.hp-lve-quick .chip-sm[aria-pressed="true"],
.hp-lve-quick-row .chip-sm.active,
.hp-lve-quick-row .chip-sm[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  outline-offset: 1px;
  font-weight: 700;
}
.hp-lve-gauges {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .4rem;
  margin: .55rem 0;
}
.hp-lve-gauges .hp-gauge {
  padding: .5rem .55rem;
  font-size: .82rem;
}
.hp-lve-gauges .hp-gauge strong { font-size: .92rem; }
.hp-lve-cash,
.hp-lve-equity,
.hp-lve-years-table-wrap,
.hp-lve-scen,
.hp-lve-tips,
.hp-lve-commit {
  margin: .7rem 0;
  padding: .55rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev));
}
.hp-lve-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .82rem;
}
.hp-lve-table th,
.hp-lve-table td {
  text-align: left;
  padding: .3rem .25rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  font-variant-numeric: tabular-nums;
}
.hp-lve-table thead th {
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: color-mix(in srgb, var(--text) 70%, transparent);
}
.hp-lve-tr-strong {
  font-weight: 700;
  background: color-mix(in srgb, var(--brand) 8%, transparent);
}
.hp-lve-table-scroll {
  max-height: 220px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.hp-lve-diff-own { color: color-mix(in srgb, #b45309 80%, var(--text)); }
.hp-lve-diff-rent { color: color-mix(in srgb, #15803d 75%, var(--text)); }
.hp-lve-tip-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  line-height: 1.4;
}
.hp-lve-tip-list li { margin: .25rem 0; }
.hp-lve-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .76rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 8rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .5rem .6rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-lve-privacy {
  margin-top: .85rem;
  font-size: .84rem;
}
.hp-lve-privacy summary { cursor: pointer; font-weight: 600; }
.hp-lve-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-lve-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-lve-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 900px) {
  .hp-lve-layout { grid-template-columns: 1fr; }
  .hp-lve-panel {
    position: static;
    order: 0;
  }
  .hp-lve-main { order: 1; }
  .hp-lve-hero { grid-template-columns: 1fr auto; }
  .hp-lve-hero-copy { grid-column: 1; }
  .hp-lve-hero-mascot {
    grid-column: 2;
    width: 56px;
    height: 56px;
  }
  .hp-lve-how { order: 3; grid-column: 1 / -1; }
  .hp-lve-gauges { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .hp-lve-gauges { grid-template-columns: 1fr; }
  .hp-lve-compare-nums { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-lve-panel { scroll-margin-top: 0; }
}

/* —— Kontrakt-leseguide (rent_in-kontrakt-les · rent_contract) —— */
.hp-kl-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-kl-hero-mascot {
  border-radius: 16px;
  grid-row: 1 / span 2;
}
.hp-kl-hero-copy { min-width: 0; grid-column: 2; }
.hp-kl-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-kl-lead-bullets li { margin: .15rem 0; }
.hp-kl-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  padding: .65rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 70%, var(--brand, #0f766e) 6%);
}
.hp-kl-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-kl-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-kl-how-list li { margin: .2rem 0; }
.hp-kl-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .75rem;
}
.hp-kl-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: color-mix(in srgb, #f59e0b 22%, transparent);
  color: #92400e;
}
.hp-kl-demo-note {
  margin: -.35rem 0 .85rem;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: color-mix(in srgb, #f59e0b 12%, transparent);
}
.hp-kl-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.9fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-kl-layout { grid-template-columns: 1fr; }
  .hp-kl-hero { grid-template-columns: auto 1fr; }
  .hp-kl-panel { position: static; }
}
.hp-kl-section {
  margin: 1.1rem 0 .55rem;
  font-size: 1.05rem;
}
.hp-kl-main .hp-kl-section:first-child { margin-top: 0; }
.hp-kl-cat-tabs,
.hp-kl-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-kl-tab.is-on,
.hp-kl-tab[aria-pressed="true"],
.hp-kl-filter.is-on,
.hp-kl-filter[aria-pressed="true"] {
  background: color-mix(in srgb, var(--brand, #0f766e) 18%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  font-weight: 700;
}
.hp-kl-tab-pct {
  margin-left: .2rem;
  font-size: .75rem;
  opacity: .85;
  font-weight: 650;
}
.hp-kl-filter-count { margin: -.25rem 0 .55rem; }
.hp-kl-filter-n {
  margin-left: .15rem;
  font-size: .72rem;
  opacity: .85;
  font-weight: 650;
}
.hp-kl-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  margin-top: .35rem;
}
.hp-kl-qchip {
  font-size: .72rem !important;
  padding: .12rem .4rem !important;
  min-height: 0;
  line-height: 1.2;
}
.hp-kl-qchip.is-on,
.hp-kl-qchip[aria-pressed="true"] {
  background: color-mix(in srgb, var(--brand, #0f766e) 20%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  font-weight: 700;
}
.hp-kl-row.is-flash {
  outline: 2px solid color-mix(in srgb, var(--brand, #0f766e) 70%, #38bdf8);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand, #0f766e) 18%, transparent);
  transition: outline .15s, box-shadow .15s;
}
.hp-kl-jump-li {
  cursor: pointer;
  border-radius: 6px;
  padding: .1rem .15rem;
}
.hp-kl-jump-li:hover,
.hp-kl-jump-li:focus {
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, transparent);
  outline: none;
}
.hp-kl-countdown {
  margin: 0 0 .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #0ea5e9 28%, var(--border));
  background: color-mix(in srgb, #e0f2fe 55%, var(--bg-elev, #fff));
}
.hp-kl-draft-block {
  padding: .75rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 5%);
}
.hp-kl-draft-text {
  width: 100%;
  font-size: .84rem;
  line-height: 1.45;
  font-family: inherit;
}
.hp-kl-facts-actions { margin-top: .25rem; }
.hp-kl-cat { margin-bottom: 1rem; }
.hp-kl-cat-title {
  margin: 0 0 .25rem;
  font-size: .98rem;
}
.hp-kl-cat-help { margin: 0 0 .5rem; }
.hp-kl-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .45rem;
}
.hp-kl-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: var(--bg-elev, #fff);
  transition: border-color .15s, background .15s;
}
.hp-kl-row.is-critical {
  border-left: 3px solid color-mix(in srgb, #dc2626 70%, var(--border));
}
.hp-kl-row.is-ok {
  background: color-mix(in srgb, #ecfdf5 75%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #10b981 30%, var(--border));
}
.hp-kl-row.is-unclear {
  background: color-mix(in srgb, #fffbeb 80%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #f59e0b 35%, var(--border));
}
.hp-kl-row.is-missing,
.hp-kl-row.is-gap {
  background: color-mix(in srgb, #fef2f2 70%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #f87171 30%, var(--border));
}
.hp-kl-row.is-red {
  background: color-mix(in srgb, #fee2e2 85%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
}
.hp-kl-row.is-na {
  opacity: .72;
  background: color-mix(in srgb, var(--bg, #f8fafc) 60%, var(--bg-elev, #fff));
}
.hp-kl-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .65rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-kl-label {
  flex: 1 1 12rem;
  min-width: 0;
  font-size: .92rem;
}
.hp-kl-crit-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .32rem;
  border-radius: 5px;
  margin-right: .3rem;
  vertical-align: middle;
  background: color-mix(in srgb, #dc2626 16%, transparent);
  color: #b91c1c;
}
.hp-kl-status-wrap { flex: 0 0 auto; }
.hp-kl-status {
  min-width: 9.5rem;
  font-size: .86rem;
}
.hp-kl-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
}
.hp-kl-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .9rem 1rem 1rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--brand, #0f766e) 4%);
}
.hp-kl-readiness {
  padding: .65rem .75rem;
  border-radius: 12px;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-kl-readiness.is-ok {
  border-color: color-mix(in srgb, #10b981 45%, var(--border));
  background: color-mix(in srgb, #ecfdf5 80%, var(--bg-elev, #fff));
}
.hp-kl-readiness.is-mid {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #fffbeb 80%, var(--bg-elev, #fff));
}
.hp-kl-readiness.is-warm,
.hp-kl-readiness.is-hot {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #fef2f2 85%, var(--bg-elev, #fff));
}
.hp-kl-readiness.is-unknown {
  border-color: color-mix(in srgb, #64748b 30%, var(--border));
}
.hp-kl-ready-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .98rem;
}
.hp-kl-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .55rem;
}
.hp-kl-gauge {
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-kl-gauge strong { font-size: 1.15rem; }
.hp-kl-counts {
  font-size: .82rem;
  color: var(--muted, #64748b);
  margin-bottom: .65rem;
}
.hp-kl-bars {
  display: grid;
  gap: .35rem;
  margin-bottom: .75rem;
}
.hp-kl-bar-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(70px, 0.9fr);
  gap: .4rem;
  align-items: center;
  font-size: .78rem;
}
.hp-kl-bar {
  height: 8px;
  border-radius: 99px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  overflow: hidden;
}
.hp-kl-bar-fill {
  display: block;
  height: 100%;
  border-radius: 99px;
  background: color-mix(in srgb, var(--brand, #0f766e) 75%, #34d399);
  transition: width .2s ease;
}
.hp-kl-dep-box,
.hp-kl-flag-box,
.hp-kl-next,
.hp-kl-questions,
.hp-kl-snapshot,
.hp-kl-commit {
  margin-top: .7rem;
  padding-top: .55rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
}
.hp-kl-flag-ul,
.hp-kl-q-ul,
.hp-kl-next-ol {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-kl-flag-ul li,
.hp-kl-q-ul li,
.hp-kl-next-ol li { margin: .2rem 0; }
.hp-kl-commit-text {
  width: 100%;
  font-size: .8rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.hp-kl-nonadvice {
  margin-top: .65rem;
  font-size: .78rem;
}
.hp-kl-faq details {
  margin: .4rem 0;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}
.hp-kl-faq summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
}
@media (max-width: 600px) {
  .hp-kl-hero { grid-template-columns: 1fr; }
  .hp-kl-hero-copy { grid-column: 1; }
  .hp-kl-hero-mascot { grid-row: auto; width: 64px; height: 64px; }
  .hp-kl-gauges { grid-template-columns: 1fr; }
  .hp-kl-bar-row { grid-template-columns: 1fr; }
  .hp-kl-row-top { flex-direction: column; }
  .hp-kl-status { width: 100%; min-width: 0; }
}

/* —— Depositum-sjekk (rent_in-depositum-sjekk · depositum) —— */
.hp-dep { margin: 0; }
.hp-dep-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-dep-hero-copy { min-width: 0; grid-column: 1; }
.hp-dep-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  width: 72px; height: 72px;
  object-fit: contain;
  border-radius: 50%;
  justify-self: end;
}
.hp-dep-how { grid-column: 1 / -1; }
.hp-dep-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-dep-lead-bullets li { margin: .2rem 0; }
.hp-dep-how {
  margin-top: .35rem;
  padding: .55rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-dep-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-dep-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-dep-how-list li { margin: .2rem 0; }
.hp-dep-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #f59e0b) 22%, transparent);
  color: color-mix(in srgb, var(--accent, #b45309) 80%, var(--text));
  vertical-align: middle;
}
.hp-dep-demo-note {
  margin: .35rem 0 .65rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--accent, #f59e0b) 45%, var(--border));
  background: color-mix(in srgb, var(--accent, #f59e0b) 8%, var(--bg));
}
.hp-dep-seed-hint {
  margin: 0 0 .75rem;
  padding: .45rem .7rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, var(--bg));
  font-size: .86rem;
}
.hp-dep-m-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-dep-m-chips .chip {
  font-size: .78rem;
  padding: .2rem .5rem;
}
.hp-dep-m-chips .chip.active,
.hp-dep-m-chips .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg));
  color: var(--brand);
  font-weight: 650;
}
.hp-dep-form-banner {
  margin: .55rem 0 .35rem;
  padding: .5rem .7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 30%, var(--bg-elev, #fff));
}
.hp-dep-form-banner.is-risk {
  border-color: #fca5a5;
  background: #fef2f2;
  color: #991b1b;
}
.hp-dep-form-banner.is-warn {
  border-color: #fde68a;
  background: #fffbeb;
  color: #92400e;
}
.hp-dep-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .4rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-dep-filter-row .chip.active,
.hp-dep-filter-row .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg));
  color: var(--brand);
  font-weight: 650;
}
.hp-dep-safe-row.is-ok {
  border-color: #86efac;
  background: color-mix(in srgb, #dcfce7 55%, var(--bg-elev, #fff));
}
.hp-dep-safe-row.is-warn {
  border-color: #fde68a;
  background: color-mix(in srgb, #fef9c3 50%, var(--bg-elev, #fff));
}
.hp-dep-safe-row.is-bad {
  border-color: #fca5a5;
  background: color-mix(in srgb, #fee2e2 55%, var(--bg-elev, #fff));
}
.hp-dep-safe-row.is-open {
  border-style: dashed;
}
.hp-dep-safe-row.is-na {
  opacity: .72;
}
.hp-dep-safe-row.is-flash {
  outline: 2px solid var(--brand, #0f766e);
  outline-offset: 2px;
  transition: outline-color .2s;
}
.hp-dep-draft {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .82rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
  color: var(--text);
}
.hp-dep-next {
  margin: .7rem 0;
  padding-top: .35rem;
  border-top: 1px solid var(--border);
}
.hp-dep-next-list {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-dep-next-list li { margin: .3rem 0; }
.hp-dep-next-btn {
  appearance: none;
  border: 0;
  background: none;
  color: var(--brand, #0f766e);
  font: inherit;
  font-weight: 600;
  text-align: left;
  padding: 0;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hp-dep-next-btn:hover { color: color-mix(in srgb, var(--brand, #0f766e) 80%, #000); }
.hp-dep-next-link {
  color: var(--brand, #0f766e);
  font-weight: 600;
}
.hp-dep-tr-gap th,
.hp-dep-tr-gap td {
  font-weight: 700;
  color: color-mix(in srgb, #b45309 70%, var(--text));
}
.hp-dep-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
  margin: 0 0 .75rem;
}
.hp-dep-demos .chip { font-size: .8rem; }
.hp-dep-demos .chip.active,
.hp-dep-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg));
  color: var(--brand);
}
.hp-dep-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-dep-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.85fr);
  gap: 1rem;
  align-items: start;
}
.hp-dep-main { order: 1; min-width: 0; }
.hp-dep-panel {
  order: 2;
  position: sticky;
  top: 4.5rem;
  padding: 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  box-shadow: var(--shadow, 0 2px 12px rgba(0,0,0,.06));
}
.hp-dep-section {
  margin: 1.1rem 0 .45rem;
  font-size: 1.02rem;
  font-weight: 750;
  letter-spacing: -0.02em;
}
.hp-dep-section:first-child { margin-top: 0; }
.hp-dep-check {
  display: flex;
  gap: .45rem;
  align-items: flex-start;
  font-size: .9rem;
  font-weight: 550;
}
.hp-dep-check input { margin-top: .2rem; accent-color: var(--brand, #0f766e); }
.hp-dep-safe-list,
.hp-dep-rf-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: .45rem;
}
.hp-dep-safe-row {
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev, #fff));
}
.hp-dep-safe-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .65rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-dep-safe-label { flex: 1; min-width: 160px; }
.hp-dep-st-wrap { flex-shrink: 0; }
.hp-dep-st {
  font: inherit;
  font-size: .86rem;
  padding: .4rem .5rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  min-width: 9.5rem;
}
.hp-dep-rf-item {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  font-size: .9rem;
  cursor: pointer;
}
.hp-dep-rf-item:has(input:checked) {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-dep-rf-item input { margin-top: .15rem; accent-color: #dc2626; }
.hp-dep-live { text-align: center; margin-bottom: .65rem; }
.hp-dep-live .hp-bid-num { margin: .15rem 0; }
.hp-dep-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .78rem;
}
.hp-dep-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin-bottom: .65rem;
}
.hp-dep-gauges .hp-gauge {
  padding: .45rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, transparent);
}
.hp-dep-gauges .hp-gauge strong { font-size: .92rem; display: block; }
.hp-dep-readiness {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .65rem .75rem;
  margin-bottom: .75rem;
  background: #f8fafc;
}
.hp-dep-readiness.is-ok { border-color: #86efac; background: #f0fdf4; }
.hp-dep-readiness.is-check { border-color: #fde68a; background: #fffbeb; }
.hp-dep-readiness.is-stop { border-color: #fca5a5; background: #fef2f2; }
.hp-dep-ready-title {
  margin: 0 0 .25rem;
  font-weight: 750;
  font-size: .98rem;
}
.hp-dep-bar-wrap { margin: .55rem 0 .75rem; }
.hp-dep-bar {
  position: relative;
  height: 12px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-dep-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #38bdf8;
  transition: width .2s ease, background .2s ease;
}
.hp-dep-fill.is-ok { background: #4ade80; }
.hp-dep-fill.is-mid { background: #fbbf24; }
.hp-dep-fill.is-high { background: #f87171; }
.hp-dep-mark {
  position: absolute;
  top: 0; bottom: 0;
  width: 2px;
  background: color-mix(in srgb, var(--text) 35%, transparent);
  transform: translateX(-50%);
}
.hp-dep-mark-max { background: color-mix(in srgb, #dc2626 55%, transparent); }
.hp-dep-bar-labels {
  display: flex;
  justify-content: space-between;
  font-size: .72rem;
  color: var(--muted);
  margin-top: .2rem;
}
.hp-dep-cash,
.hp-dep-alerts,
.hp-dep-commit {
  margin: .7rem 0;
  padding-top: .35rem;
  border-top: 1px solid var(--border);
}
.hp-dep-cash-num { font-size: 1.35rem; margin: .1rem 0 .35rem; }
.hp-dep-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .88rem;
}
.hp-dep-table th,
.hp-dep-table td {
  text-align: left;
  padding: .28rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-dep-table th { font-weight: 600; width: 55%; }
.hp-dep-tr-strong th,
.hp-dep-tr-strong td { font-weight: 750; }
.hp-dep-alert-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-dep-alert-list li { margin: .25rem 0; }
.hp-dep-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 8rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-dep-privacy {
  margin-top: .85rem;
  font-size: .88rem;
}
.hp-dep-privacy summary { cursor: pointer; font-weight: 600; }
.hp-dep-faq details { margin: .35rem 0; }
.hp-dep-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-dep-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 900px) {
  .hp-dep-layout { grid-template-columns: 1fr; }
  .hp-dep-panel { position: static; order: 0; }
  .hp-dep-main { order: 1; }
}
@media (max-width: 560px) {
  .hp-dep-hero { grid-template-columns: 1fr; }
  .hp-dep-hero-copy { grid-column: 1; }
  .hp-dep-hero-mascot { grid-column: 1; grid-row: auto; justify-self: start; }
  .hp-dep-gauges { grid-template-columns: 1fr; }
  .hp-dep-st { min-width: 100%; width: 100%; }
  .hp-dep-safe-top { flex-direction: column; }
}

/* —— Skjulte kostnader (rent_in-felle-kost · felle_kost) —— */
.hp-fk { margin: 0; }
.hp-fk-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-fk-hero-copy { min-width: 0; grid-column: 1; }
.hp-fk-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  width: 72px; height: 72px;
  object-fit: contain;
  border-radius: 50%;
  justify-self: end;
}
.hp-fk-how { grid-column: 1 / -1; }
.hp-fk-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-fk-lead-bullets li { margin: .2rem 0; }
.hp-fk-how {
  margin-top: .35rem;
  padding: .55rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-fk-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-fk-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-fk-how-list li { margin: .2rem 0; }
.hp-fk-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #f59e0b) 22%, transparent);
  color: color-mix(in srgb, var(--accent, #b45309) 80%, var(--text));
  vertical-align: middle;
}
.hp-fk-demo-note,
.hp-fk-profile-note {
  margin: .35rem 0 .65rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--accent, #f59e0b) 45%, var(--border));
  background: color-mix(in srgb, var(--accent, #f59e0b) 8%, var(--bg));
}
.hp-fk-profile-note {
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-fk-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
  margin: 0 0 .75rem;
}
.hp-fk-demos .chip { font-size: .8rem; }
.hp-fk-demos .chip.active,
.hp-fk-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg));
  color: var(--brand);
}
.hp-fk-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-fk-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
  gap: 1rem;
  align-items: start;
}
.hp-fk-main { order: 1; min-width: 0; }
.hp-fk-panel {
  order: 2;
  position: sticky;
  top: .75rem;
  padding: .85rem .9rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  max-height: calc(100vh - 1.5rem);
  overflow: auto;
}
.hp-fk-section {
  margin: 1.1rem 0 .45rem;
  font-size: 1.02rem;
  font-weight: 750;
}
.hp-fk-section:first-child { margin-top: 0; }
.hp-fk-incl-list {
  list-style: none;
  margin: 0 0 .75rem;
  padding: 0;
  display: grid;
  gap: .35rem;
}
.hp-fk-incl-item {
  display: flex;
  align-items: flex-start;
  gap: .5rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, transparent);
  font-size: .9rem;
}
.hp-fk-incl-item:has(input:checked) {
  border-color: color-mix(in srgb, #22c55e 45%, var(--border));
  background: color-mix(in srgb, #22c55e 8%, var(--bg-elev));
}
.hp-fk-incl-item > input { margin-top: .35rem; flex-shrink: 0; }
.hp-fk-incl-body { min-width: 0; flex: 1; }
.hp-fk-check {
  display: flex;
  align-items: flex-start;
  gap: .45rem;
  font-size: .9rem;
  cursor: pointer;
}
.hp-fk-check input { margin-top: .25rem; }
[data-fk-line].is-included {
  opacity: .55;
}
[data-fk-line].is-included input {
  text-decoration: line-through;
}
.hp-fk-src {
  display: inline-block;
  margin-top: .2rem;
  font-size: .72rem;
  padding: .05rem .35rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 12%, transparent);
}
.hp-fk-live {
  margin-bottom: .65rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid var(--border);
}
.hp-fk-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .72rem !important;
  opacity: .85;
}
.hp-fk-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
  margin-bottom: .75rem;
}
.hp-fk-gauges .hp-gauge {
  padding: .45rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, transparent);
}
.hp-fk-gauges .hp-gauge strong { font-size: .92rem; display: block; }
.hp-fk-bar-wrap { margin: .55rem 0 .75rem; }
.hp-fk-stack-bar {
  display: flex;
  height: 14px;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
}
.hp-fk-seg { display: block; height: 100%; min-width: 0; transition: width .2s ease; }
.hp-fk-seg-rent { background: #38bdf8; }
.hp-fk-seg-hid { background: #f59e0b; }
.hp-fk-legend {
  list-style: none;
  margin: .4rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .75rem;
  font-size: .8rem;
}
.hp-fk-dot {
  display: inline-block;
  width: .65rem;
  height: .65rem;
  border-radius: 3px;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-fk-lines,
.hp-fk-ab,
.hp-fk-cash,
.hp-fk-tips,
.hp-fk-commit {
  margin: .7rem 0;
  padding-top: .35rem;
  border-top: 1px solid var(--border);
}
.hp-fk-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .88rem;
}
.hp-fk-table th,
.hp-fk-table td {
  text-align: left;
  padding: .28rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-fk-table th { font-weight: 600; width: 55%; }
.hp-fk-table thead th { font-weight: 700; font-size: .78rem; color: var(--muted); }
.hp-fk-tr-strong th,
.hp-fk-tr-strong td { font-weight: 750; }
.hp-fk-table tr.is-zero { opacity: .45; }
.hp-fk-table tr.is-incl td { font-style: italic; color: color-mix(in srgb, #16a34a 70%, var(--text)); }
.hp-fk-cash-num { font-size: 1.25rem; margin: .1rem 0 .2rem; }
.hp-fk-tip-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  line-height: 1.4;
}
.hp-fk-tip-list li { margin: .2rem 0; }
.hp-fk-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .5rem .6rem;
  background: color-mix(in srgb, var(--bg) 60%, transparent);
}
.hp-fk-privacy {
  margin-top: .85rem;
  font-size: .88rem;
}
.hp-fk-privacy summary { cursor: pointer; font-weight: 600; }
.hp-fk-faq details { margin: .35rem 0; }
.hp-fk-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-fk-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 900px) {
  .hp-fk-layout { grid-template-columns: 1fr; }
  .hp-fk-panel { position: static; order: 0; max-height: none; }
  .hp-fk-main { order: 1; }
}
@media (max-width: 560px) {
  .hp-fk-hero { grid-template-columns: 1fr; }
  .hp-fk-hero-copy { grid-column: 1; }
  .hp-fk-hero-mascot { grid-column: 1; grid-row: auto; justify-self: start; }
  .hp-fk-gauges { grid-template-columns: 1fr; }
}

/* —— Leie-visningskort (rent_in-visning-leie / rent_visning) —— */
.hp-rv { display: grid; gap: 1rem; }
.hp-rv-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .85rem 1rem;
  align-items: start;
  padding: .85rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
}
.hp-rv-hero-mascot {
  width: 72px; height: 72px; border-radius: 50%;
  object-fit: cover; flex-shrink: 0;
  border: 2px solid color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-rv-hero-copy { min-width: 0; grid-column: 2; }
.hp-rv-lead-bullets {
  margin: .25rem 0 0; padding-left: 1.15rem;
  font-size: .88rem; color: var(--muted);
}
.hp-rv-lead-bullets li { margin: .15rem 0; }
.hp-rv-how {
  grid-column: 1 / -1;
  margin-top: .15rem;
  border-top: 1px dashed color-mix(in srgb, var(--brand) 25%, var(--border));
  padding-top: .45rem;
}
.hp-rv-how summary {
  cursor: pointer; font-weight: 700; font-size: .92rem;
}
.hp-rv-how-list {
  margin: .4rem 0 0; padding-left: 1.2rem;
  font-size: .88rem; color: var(--muted);
}
.hp-rv-how-list li { margin: .2rem 0; }
.hp-rv-demos {
  display: flex; flex-wrap: wrap; align-items: center; gap: .45rem;
}
.hp-rv-demo-badge {
  display: inline-block;
  font-size: .68rem; font-weight: 700; letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem; border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg-elev));
  border: 1px solid color-mix(in srgb, #f59e0b 45%, var(--border));
  color: var(--text);
}
.hp-rv-demo-note {
  margin: 0; padding: .4rem .65rem; border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-rv-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .9fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 860px) {
  .hp-rv-layout { grid-template-columns: 1fr; }
  .hp-rv-hero { grid-template-columns: auto 1fr; }
}
.hp-rv-section {
  font-size: 1rem; font-weight: 750; margin: 1rem 0 .45rem;
  letter-spacing: -0.02em;
}
.hp-rv-form-col .hp-rv-section:first-child { margin-top: 0; }
.hp-rv-q-filters {
  display: flex; flex-wrap: wrap; gap: .35rem;
  margin-bottom: 0; /* spacing owned by .hp-rv-q-toolbar when nested */
}
.hp-rv-cat {
  margin: .75rem 0 1rem;
  padding: .65rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-rv-cat-title {
  margin: 0 0 .2rem;
  font-size: .95rem;
  font-weight: 750;
  display: flex;
  align-items: baseline;
  gap: .45rem;
  flex-wrap: wrap;
}
.hp-rv-cat-help { margin: 0 0 .45rem; }
.hp-rv-qlist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .45rem;
}
.hp-rv-qrow {
  padding: .45rem .5rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev));
}
.hp-rv-qrow.is-red {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 8%, var(--bg-elev));
}
.hp-rv-qrow.is-unclear {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev));
}
.hp-rv-qrow.is-ok {
  border-color: color-mix(in srgb, #16a34a 30%, var(--border));
}
.hp-rv-qrow-main {
  display: grid;
  grid-template-columns: 1fr minmax(7.5rem, 9.5rem);
  gap: .35rem .55rem;
  align-items: start;
}
@media (max-width: 560px) {
  .hp-rv-qrow-main { grid-template-columns: 1fr; }
}
.hp-rv-qlab { font-size: .88rem; font-weight: 600; line-height: 1.3; }
.hp-rv-qsel {
  width: 100%;
  font-size: .82rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .3rem .4rem;
  background: var(--bg-elev);
}
.hp-rv-qnote {
  width: 100%;
  margin-top: .3rem;
  font-size: .8rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .28rem .45rem;
  background: var(--bg);
}
.hp-rv-dims {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem .85rem;
}
@media (max-width: 560px) {
  .hp-rv-dims { grid-template-columns: 1fr; }
}
.hp-rv-dim {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto auto;
  gap: .15rem .5rem;
  align-items: center;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  margin: 0;
}
.hp-rv-dim-label { grid-column: 1; font-size: .9rem; font-weight: 600; }
.hp-rv-dim input[type="range"] {
  grid-column: 1 / -1;
  width: 100%;
  accent-color: var(--brand);
}
.hp-rv-dim-val {
  grid-column: 2; grid-row: 1;
  font-weight: 800; font-variant-numeric: tabular-nums;
  color: var(--brand); min-width: 1.25rem; text-align: right;
}
.hp-rv-dim-bar {
  grid-column: 1 / -1;
  display: block;
  height: 4px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, var(--bg));
  overflow: hidden;
}
.hp-rv-dim-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--brand);
  transition: width .12s ease;
}
.hp-rv-live {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: .45rem .75rem;
  margin-top: .75rem;
  padding: .65rem .85rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
}
.hp-rv-live-block {
  display: flex; flex-direction: column; gap: .05rem;
}
.hp-rv-live-num {
  font-size: 1.45rem; font-weight: 800; letter-spacing: -0.03em;
  color: var(--brand); font-variant-numeric: tabular-nums;
  line-height: 1.05;
}
.hp-rv-live-chk { color: color-mix(in srgb, var(--brand) 70%, #0f766e); }
.hp-rv-band {
  display: inline-block;
  font-size: .78rem; font-weight: 700;
  padding: .15rem .5rem; border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-rv-band.is-ok {
  border-color: color-mix(in srgb, #16a34a 50%, var(--border));
  background: color-mix(in srgb, #16a34a 14%, var(--bg-elev));
}
.hp-rv-band.is-mid {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 12%, var(--bg-elev));
}
.hp-rv-band.is-tight {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 12%, var(--bg-elev));
}
.hp-rv-flags {
  display: flex; flex-wrap: wrap; gap: .4rem;
}
.hp-rv-flag {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .35rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  font-size: .82rem;
  cursor: pointer;
}
.hp-rv-flag:has(input:checked) {
  border-color: color-mix(in srgb, #dc2626 50%, var(--border));
  background: color-mix(in srgb, #dc2626 12%, var(--bg-elev));
  font-weight: 650;
}
.hp-rv-panel {
  position: sticky;
  top: .75rem;
  padding: .85rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  display: grid;
  gap: .65rem;
}
.hp-rv-panel-head {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .5rem;
}
.hp-rv-sort, .hp-rv-filters {
  display: flex; flex-wrap: wrap; gap: .3rem;
}
.hp-rv-list { display: grid; gap: .65rem; }
.hp-rv-card {
  padding: .65rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
}
.hp-rv-card--sok {
  border-left: 3px solid color-mix(in srgb, #16a34a 70%, var(--border));
}
.hp-rv-card--avvent {
  border-left: 3px solid color-mix(in srgb, #f59e0b 70%, var(--border));
}
.hp-rv-card--dropp {
  border-left: 3px solid color-mix(in srgb, #94a3b8 70%, var(--border));
  opacity: .88;
}
.hp-rv-card-top {
  display: flex; justify-content: space-between; gap: .65rem;
  align-items: flex-start;
}
.hp-rv-card-meta {
  display: flex; flex-wrap: wrap; gap: .25rem .45rem;
  align-items: center; margin-top: .2rem;
}
.hp-rv-card-score {
  text-align: right;
  display: flex; flex-direction: column; align-items: flex-end; gap: .05rem;
  flex-shrink: 0;
}
.hp-rv-card-avg {
  font-size: 1.45rem; font-weight: 800; color: var(--brand);
  font-variant-numeric: tabular-nums; line-height: 1;
}
.hp-rv-card-bars {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .2rem .55rem;
  margin: .45rem 0 .35rem;
}
.hp-rv-card-bar-row {
  display: grid;
  grid-template-columns: 2.4rem 1fr 1.1rem;
  gap: .25rem;
  align-items: center;
  font-size: .72rem;
}
.hp-rv-card-bar-lab { color: var(--muted); font-weight: 600; }
.hp-rv-card-bar-track {
  height: 4px; border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, var(--bg));
  overflow: hidden;
}
.hp-rv-card-bar-fill {
  display: block; height: 100%;
  background: var(--brand); border-radius: 999px;
}
.hp-rv-card-bar-n { text-align: right; font-variant-numeric: tabular-nums; font-weight: 700; }
.hp-rv-card-flags {
  font-size: .8rem;
  margin: .25rem 0;
  color: color-mix(in srgb, #dc2626 75%, var(--text));
}
.hp-rv-card-actions {
  display: flex; flex-wrap: wrap; gap: .4rem; align-items: center;
  margin-top: .4rem;
}
.hp-rv-card-status-lab {
  display: inline-flex; align-items: center; gap: .3rem;
}
.hp-rv-card-status-lab select {
  font-size: .78rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .15rem .3rem;
}
.hp-rv-status-pill {
  display: inline-block;
  font-size: .72rem; font-weight: 700;
  padding: .1rem .4rem; border-radius: 999px;
  border: 1px solid var(--border);
}
.hp-rv-status-pill--sok {
  background: color-mix(in srgb, #16a34a 14%, var(--bg-elev));
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
}
.hp-rv-status-pill--avvent {
  background: color-mix(in srgb, #f59e0b 14%, var(--bg-elev));
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
}
.hp-rv-status-pill--dropp {
  background: color-mix(in srgb, #94a3b8 16%, var(--bg-elev));
}
.hp-rv-openq {
  padding: .55rem .7rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev));
}
.hp-rv-openq-list {
  margin: 0; padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-rv-openq-list li { margin: .2rem 0; }
.hp-rv-rank-ol {
  margin: 0; padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-rv-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 8rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-rv-nonadvice {
  margin: .25rem 0 0;
  font-size: .78rem;
}
.hp-rv-faq details { margin: .35rem 0; }
.hp-rv-faq summary {
  cursor: pointer;
  font-weight: 650;
}
.hp-rv-dep-mnd {
  grid-column: 1 / -1;
  display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem .5rem;
  padding: .45rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
  font-size: .88rem;
}
.hp-rv-dep-mnd strong {
  font-size: 1.15rem; font-weight: 800; font-variant-numeric: tabular-nums;
  color: var(--brand);
}
.hp-rv-dep-mnd.is-warn {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-rv-dep-mnd.is-ok {
  border-color: color-mix(in srgb, #16a34a 35%, var(--border));
}
.hp-rv-q-toolbar {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .45rem;
  margin-bottom: .45rem;
}
.hp-rv-chip-n {
  display: inline-block;
  min-width: 1.1rem;
  font-size: .72rem; font-weight: 700;
  font-variant-numeric: tabular-nums;
  opacity: .85;
}
.hp-rv-qrow.is-hopp {
  outline: 2px solid color-mix(in srgb, var(--brand) 70%, transparent);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand) 18%, transparent);
  transition: outline .2s ease, box-shadow .2s ease;
}
.hp-rv-card-cmp {
  display: inline-flex; align-items: center; gap: .3rem;
  margin-right: .35rem; cursor: pointer;
}
.hp-rv-compare {
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev));
  display: grid; gap: .4rem;
}
.hp-rv-compare-head {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .4rem;
}
.hp-rv-compare-table-wrap { overflow-x: auto; }
.hp-rv-cmp-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .8rem;
}
.hp-rv-cmp-table th,
.hp-rv-cmp-table td {
  padding: .28rem .4rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  text-align: left;
  vertical-align: top;
}
.hp-rv-cmp-table thead th {
  font-weight: 700;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
.hp-rv-cmp-table th[scope="row"] {
  font-weight: 600;
  color: var(--muted);
  white-space: nowrap;
}
.hp-rv-cmp-cell {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  text-align: center !important;
}
.hp-rv-cmp-cell.is-best {
  background: color-mix(in srgb, #16a34a 16%, var(--bg-elev));
  color: color-mix(in srgb, #15803d 80%, var(--text));
  border-radius: 6px;
}
.hp-rv-cmp-meta th[scope="row"] { font-weight: 700; color: var(--text); }
.hp-rv-draft {
  width: 100%;
  margin-top: .4rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .76rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .45rem .55rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-rv-seeds {
  margin-top: .25rem;
  padding-top: .45rem;
  border-top: 1px dashed var(--border);
}
.hp-rv-seed-row {
  flex-wrap: wrap;
  gap: .35rem;
}
@media (max-width: 560px) {
  .hp-rv-q-toolbar { flex-direction: column; align-items: stretch; }
}
.hp-rv-faq summary { font-size: .92rem; }
.hp-rv-faq details p { margin: .35rem 0 .15rem; }
.hp-rv-actions { flex-wrap: wrap; }
@media (max-width: 860px) {
  .hp-rv-panel { position: static; }
}
@media (max-width: 560px) {
  .hp-rv-hero { grid-template-columns: 1fr; }
  .hp-rv-hero-copy { grid-column: 1; }
  .hp-rv-hero-mascot { grid-column: 1; }
  .hp-rv-card-bars { grid-template-columns: 1fr; }
}

/* —— Søknadspakke (rent_in-soknad-pakke · soknad_pack) —— */
.hp-sok-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-sok-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
}
.hp-sok-hero-copy { min-width: 0; grid-column: 2; }
.hp-sok-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-sok-lead-bullets li { margin: .15rem 0; }
.hp-sok-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  padding: .55rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 80%, var(--brand, #0f766e) 6%);
}
.hp-sok-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-sok-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-sok-how-list li { margin: .2rem 0; }
.hp-sok-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: .55rem 0 .75rem;
}
.hp-sok-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, #b45309 18%, transparent);
  color: color-mix(in srgb, #b45309 85%, var(--text));
  margin-left: .25rem;
}
.hp-sok-demo-note {
  margin: -.35rem 0 .75rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #b45309 45%, var(--border));
  background: color-mix(in srgb, #b45309 8%, transparent);
}
.hp-sok-demos .chip.active,
.hp-sok-demos .chip[aria-pressed="true"] {
  background: color-mix(in srgb, var(--brand, #0f766e) 18%, transparent);
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
}
.hp-sok-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-sok-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .9fr);
  gap: 1rem 1.25rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-sok-layout { grid-template-columns: 1fr; }
  .hp-sok-panel { position: static; order: 0; }
  .hp-sok-main { order: 1; }
}
.hp-sok-section {
  margin: 1.1rem 0 .55rem;
  font-size: 1.05rem;
}
.hp-sok-main .hp-sok-section:first-child { margin-top: 0; }
.hp-sok-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-sok-filter.is-on,
.hp-sok-filter[aria-pressed="true"] {
  background: color-mix(in srgb, var(--brand, #0f766e) 16%, transparent);
  border-color: color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
}
.hp-sok-fc {
  font-size: .72rem;
  font-weight: 600;
  opacity: .85;
  margin-left: .15rem;
}
.hp-sok-filter-count { margin: -.25rem 0 .55rem; }
.hp-sok-autosync-hint {
  margin: .35rem 0 .55rem;
  padding: .35rem .55rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, transparent);
}
.hp-sok-cat { margin-bottom: 1rem; }
.hp-sok-cat-title {
  margin: 0 0 .25rem;
  font-size: .98rem;
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: baseline;
}
.hp-sok-cat-pct {
  font-size: .78rem;
  font-weight: 600;
  color: color-mix(in srgb, var(--brand, #0f766e) 75%, var(--muted, #64748b));
}
.hp-sok-cat-help { margin: 0 0 .5rem; }
.hp-sok-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .45rem;
}
.hp-sok-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, transparent);
}
.hp-sok-row.is-critical {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 28%, var(--border));
}
.hp-sok-row.is-have {
  border-color: color-mix(in srgb, #15803d 40%, var(--border));
  background: color-mix(in srgb, #15803d 6%, var(--bg-elev, #fff));
}
.hp-sok-row.is-open {
  border-color: color-mix(in srgb, #64748b 35%, var(--border));
}
.hp-sok-row.is-getting {
  border-color: color-mix(in srgb, #b45309 45%, var(--border));
  background: color-mix(in srgb, #b45309 7%, var(--bg-elev, #fff));
}
.hp-sok-row.is-na,
.hp-sok-row.is-skip {
  opacity: .72;
}
.hp-sok-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-sok-label {
  flex: 1;
  min-width: 160px;
  font-size: .92rem;
}
.hp-sok-crit-badge {
  display: inline-block;
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
  padding: .1rem .35rem;
  border-radius: 999px;
  margin-right: .3rem;
  vertical-align: middle;
  background: color-mix(in srgb, var(--brand, #0f766e) 16%, transparent);
  color: color-mix(in srgb, var(--brand, #0f766e) 90%, var(--text));
}
.hp-sok-st-wrap { flex: 0 0 auto; }
.hp-sok-st {
  min-width: 9.5rem;
  font-size: .86rem;
}
.hp-sok-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .84rem;
}
.hp-sok-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .95rem 1rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 94%, var(--brand, #0f766e) 4%);
  scroll-margin-top: .75rem;
}
.hp-sok-readiness {
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .65rem;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, transparent);
}
.hp-sok-readiness.is-ok {
  border-color: color-mix(in srgb, #15803d 45%, var(--border));
  background: color-mix(in srgb, #15803d 10%, transparent);
}
.hp-sok-readiness.is-mid {
  border-color: color-mix(in srgb, #b45309 45%, var(--border));
  background: color-mix(in srgb, #b45309 10%, transparent);
}
.hp-sok-readiness.is-hot {
  border-color: color-mix(in srgb, #b91c1c 45%, var(--border));
  background: color-mix(in srgb, #b91c1c 10%, transparent);
}
.hp-sok-readiness.is-unknown {
  opacity: .95;
}
.hp-sok-ready-title {
  margin: 0 0 .2rem;
  font-weight: 700;
  font-size: .98rem;
}
.hp-sok-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .55rem;
}
.hp-sok-gauge {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .55rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-sok-gauge strong { font-size: 1.15rem; }
.hp-sok-counts {
  font-size: .84rem;
  margin: 0 0 .55rem;
  color: var(--muted, #64748b);
}
.hp-sok-bars {
  display: flex;
  flex-direction: column;
  gap: .35rem;
  margin-bottom: .7rem;
}
.hp-sok-bar-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(80px, 1.1fr);
  gap: .35rem .55rem;
  align-items: center;
}
.hp-sok-bar {
  height: .45rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  overflow: hidden;
}
.hp-sok-bar-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, color-mix(in srgb, var(--brand, #0f766e) 70%, #0ea5e9), var(--brand, #0f766e));
  transition: width .2s ease;
}
.hp-sok-gap-box,
.hp-sok-next,
.hp-sok-attach,
.hp-sok-snapshot,
.hp-sok-commit,
.hp-sok-alerts,
.hp-sok-subject {
  margin-top: .7rem;
  padding-top: .55rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
}
.hp-sok-gap-ul,
.hp-sok-attach-ul,
.hp-sok-next-ol,
.hp-sok-alert-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-sok-gap-ul {
  list-style: none;
  padding-left: 0;
}
.hp-sok-gap-ul li,
.hp-sok-attach-ul li,
.hp-sok-next-ol li,
.hp-sok-alert-ul li { margin: .2rem 0; }
.hp-sok-gap-btn {
  display: block;
  width: 100%;
  text-align: left;
  border: 1px solid transparent;
  border-radius: 8px;
  background: color-mix(in srgb, var(--bg) 55%, transparent);
  padding: .35rem .5rem;
  font: inherit;
  font-size: .86rem;
  cursor: pointer;
  color: inherit;
}
.hp-sok-gap-btn:hover,
.hp-sok-gap-btn:focus-visible {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, var(--bg-elev, #fff));
  outline: none;
}
.hp-sok-alert-ul { list-style: none; padding-left: 0; }
.hp-sok-alert {
  border-radius: 8px;
  padding: .35rem .55rem;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, transparent);
  font-size: .84rem;
}
.hp-sok-alert.is-warn {
  border-color: color-mix(in srgb, #b45309 45%, var(--border));
  background: color-mix(in srgb, #b45309 9%, transparent);
}
.hp-sok-alert.is-hot {
  border-color: color-mix(in srgb, #b91c1c 45%, var(--border));
  background: color-mix(in srgb, #b91c1c 10%, transparent);
}
.hp-sok-alert.is-ok {
  border-color: color-mix(in srgb, #15803d 40%, var(--border));
  background: color-mix(in srgb, #15803d 8%, transparent);
}
.hp-sok-alert.is-info {
  border-color: color-mix(in srgb, #0369a1 35%, var(--border));
  background: color-mix(in srgb, #0369a1 7%, transparent);
}
.hp-sok-subject-line {
  margin: 0;
  font-weight: 650;
  font-size: .92rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev, #fff));
  word-break: break-word;
}
.hp-sok-deadline {
  margin: 0 0 .55rem;
  padding: .35rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
}
.hp-sok-deadline.is-soon {
  border-color: color-mix(in srgb, #b45309 45%, var(--border));
  background: color-mix(in srgb, #b45309 8%, transparent);
}
.hp-sok-deadline.is-urgent {
  border-color: color-mix(in srgb, #b91c1c 45%, var(--border));
  background: color-mix(in srgb, #b91c1c 10%, transparent);
  font-weight: 600;
}
.hp-sok-row.hp-sok-flash {
  animation: hp-sok-flash-anim .9s ease;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand, #0f766e) 55%, transparent);
}
@keyframes hp-sok-flash-anim {
  0% { background: color-mix(in srgb, var(--brand, #0f766e) 22%, var(--bg-elev, #fff)); }
  100% { background: color-mix(in srgb, var(--bg-elev, #fff) 92%, transparent); }
}
.hp-sok-bridges { margin-top: .65rem; }
.hp-sok-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 10rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-sok-nonadvice {
  margin-top: .65rem;
  font-size: .78rem;
}
.hp-sok-seed-hint {
  margin: -.2rem 0 .75rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, transparent);
}
.hp-sok-send-q {
  grid-column: 1 / -1;
}
.hp-sok-pitch-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .65rem;
  align-items: center;
}
.hp-sok-privacy-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  padding: .12rem .45rem;
  border-radius: 999px;
  border: 1px solid var(--border);
}
.hp-sok-privacy-badge.is-hot {
  border-color: color-mix(in srgb, #b91c1c 45%, var(--border));
  background: color-mix(in srgb, #b91c1c 12%, transparent);
  color: color-mix(in srgb, #b91c1c 90%, var(--text));
}
.hp-sok-privacy-badge.is-ok {
  border-color: color-mix(in srgb, #15803d 40%, var(--border));
  background: color-mix(in srgb, #15803d 10%, transparent);
  color: color-mix(in srgb, #15803d 85%, var(--text));
}
.hp-sok-seed-out {
  padding-top: .55rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
}
.hp-sok-faq details {
  margin: .35rem 0;
}
.hp-sok-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-sok-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-sok-hero { grid-template-columns: 1fr; }
  .hp-sok-hero-copy { grid-column: 1; }
  .hp-sok-hero-mascot { width: 64px; height: 64px; }
  .hp-sok-gauges { grid-template-columns: 1fr; }
  .hp-sok-bar-row { grid-template-columns: 1fr; }
  .hp-sok-row-top { flex-direction: column; }
  .hp-sok-st { width: 100%; min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-sok-bar-fill { transition: none; }
  .hp-sok-row.hp-sok-flash { animation: none; }
}


/* Soft autosync + depositum hint */
.hp-sok-softsync {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-size: .82rem;
  color: var(--muted, #64748b);
  cursor: pointer;
  user-select: none;
  margin-left: .15rem;
}
.hp-sok-softsync input { margin: 0; }
.hp-sok-dep-hint {
  margin: 0 0 .65rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, transparent);
}

/* Før-send gate */
.hp-sok-gate {
  margin: .75rem 0;
  padding: .65rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--bg));
}
.hp-sok-gate.is-all-ok {
  border-color: color-mix(in srgb, #15803d 45%, var(--border));
  background: color-mix(in srgb, #15803d 8%, transparent);
}
.hp-sok-gate.is-hot {
  border-color: color-mix(in srgb, #b45309 40%, var(--border));
  background: color-mix(in srgb, #b45309 7%, transparent);
}
.hp-sok-gate-ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.hp-sok-gate-item {
  display: flex;
  align-items: flex-start;
  gap: .4rem;
  margin: .22rem 0;
  font-size: .86rem;
  line-height: 1.35;
}
.hp-sok-gate-item.is-ok { color: color-mix(in srgb, #15803d 88%, var(--text)); }
.hp-sok-gate-item.is-gap { color: color-mix(in srgb, #b45309 80%, var(--text)); }
.hp-sok-gate-mark {
  flex: 0 0 1.1rem;
  font-weight: 700;
  text-align: center;
}
.hp-sok-gate-sum {
  margin: .45rem 0 0;
  font-size: .84rem;
  font-weight: 650;
}

/* Kort portal-melding */
.hp-sok-short {
  margin: .75rem 0;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev, #fff));
}
.hp-sok-short-text {
  width: 100%;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif;
  font-size: .84rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .5rem .6rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}

/* —— Kollektiv/husregler (rent_in-kollektiv-regler · kollektiv) —— */
.hp-kol { margin: 0; }
.hp-kol-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-kol-hero-copy { min-width: 0; grid-column: 1; }
.hp-kol-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  width: 72px; height: 72px;
  object-fit: contain;
  border-radius: 50%;
  justify-self: end;
}
.hp-kol-how { grid-column: 1 / -1; }
.hp-kol-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-kol-lead-bullets li { margin: .2rem 0; }
.hp-kol-how {
  margin-top: .35rem;
  padding: .55rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, var(--bg-elev, #fff));
}
.hp-kol-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-kol-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-kol-how-list li { margin: .2rem 0; }
.hp-kol-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #f59e0b) 22%, transparent);
  color: color-mix(in srgb, var(--accent, #b45309) 80%, var(--text));
  vertical-align: middle;
}
.hp-kol-demo-note {
  margin: .35rem 0 .65rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--accent, #f59e0b) 45%, var(--border));
  background: color-mix(in srgb, var(--accent, #f59e0b) 8%, var(--bg));
}
.hp-kol-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
  margin: 0 0 .75rem;
}
.hp-kol-demos .chip { font-size: .8rem; }
.hp-kol-demos .chip.active,
.hp-kol-demos .chip[aria-pressed="true"] {
  border-color: var(--brand, #0f766e);
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, var(--bg));
  color: var(--brand, #0f766e);
}
.hp-kol-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .9fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 860px) {
  .hp-kol-layout { grid-template-columns: 1fr; }
}
.hp-kol-section {
  font-size: 1.05rem;
  margin: 1rem 0 .55rem;
}
.hp-kol-main .hp-kol-section:first-child { margin-top: 0; }
.hp-kol .form.grid-2 .span-2 {
  grid-column: 1 / -1;
}
.hp-kol-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-kol-filters .chip.is-on,
.hp-kol-filters .chip[aria-pressed="true"] {
  border-color: var(--brand, #0f766e);
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, var(--bg));
}
.hp-kol-filter-count { margin: 0 0 .5rem; }
.hp-kol-cat { margin: 0 0 1rem; }
.hp-kol-cat-title {
  font-size: .98rem;
  margin: 0 0 .25rem;
  display: flex;
  align-items: center;
  gap: .45rem;
  flex-wrap: wrap;
}
.hp-kol-cat-pct {
  font-size: .78rem;
  font-weight: 700;
  padding: .08rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--primary, #0f766e) 12%, transparent);
  color: var(--primary, #0f766e);
}
.hp-kol-cat-bar {
  height: 5px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  margin: 0 0 .45rem;
  overflow: hidden;
}
.hp-kol-cat-bar > span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: color-mix(in srgb, #d97706 70%, var(--border));
  transition: width .2s ease;
}
.hp-kol-cat-bar > span.is-low { background: color-mix(in srgb, #dc2626 65%, var(--border)); }
.hp-kol-cat-bar > span.is-mid { background: color-mix(in srgb, #d97706 70%, var(--border)); }
.hp-kol-cat-bar > span.is-high { background: color-mix(in srgb, #059669 75%, var(--border)); }
.hp-kol-cat-help { margin: 0 0 .5rem; }
.hp-kol-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-kol-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: var(--card, #fff);
  transition: border-color .15s, background .15s;
}
.hp-kol-row.is-critical {
  border-left: 3px solid #d97706;
}
.hp-kol-row.is-gap {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-kol-row.is-ok {
  border-color: color-mix(in srgb, #059669 35%, var(--border));
  background: color-mix(in srgb, #059669 6%, var(--card, #fff));
}
.hp-kol-row.is-conflict {
  border-color: #dc2626;
  background: color-mix(in srgb, #dc2626 7%, var(--card, #fff));
}
.hp-kol-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-kol-label { flex: 1 1 12rem; min-width: 0; font-size: .92rem; }
.hp-kol-crit-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .32rem;
  border-radius: 6px;
  background: #ffedd5;
  color: #9a3412;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-kol-st-wrap { flex: 0 0 auto; }
.hp-kol-st {
  min-height: 40px;
  font-size: .88rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .3rem .45rem;
  background: var(--bg, #fff);
}
.hp-kol-note {
  width: 100%;
  margin-top: .4rem;
  min-height: 40px;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .4rem .55rem;
  font-size: .88rem;
  resize: vertical;
  font-family: inherit;
}
.hp-kol-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-kol-row.is-flash {
  outline: 2px solid var(--brand, #0f766e);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand, #0f766e) 18%, transparent);
  transition: outline .15s, box-shadow .15s;
}
.hp-kol-progress {
  margin: 0 0 .75rem;
}
.hp-kol-progress-track {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  overflow: hidden;
  margin-bottom: .25rem;
}
.hp-kol-progress-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #d97706;
  transition: width .25s ease, background .2s;
}
.hp-kol-progress-fill.is-ok { background: #059669; }
.hp-kol-progress-fill.is-mid { background: #d97706; }
.hp-kol-progress-fill.is-tight { background: #dc2626; }
.hp-kol-meeting-box {
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: 0 0 .75rem;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 30%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 7%, var(--card, #fff));
}
.hp-kol-split-box {
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: 0 0 .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-kol-split-ul {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: .86rem;
}
.hp-kol-split-ul li {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  padding: .2rem 0;
  border-bottom: 1px dashed color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-kol-split-ul li:last-child { border-bottom: 0; }
.hp-kol-split-ul li.hp-kol-split-note {
  display: block;
  border-bottom: 0;
  padding-top: .35rem;
  font-size: .8rem;
}
.hp-kol-flag-link {
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hp-kol-flag-link:hover {
  color: var(--brand, #0f766e);
}
.hp-kol-commit-short {
  min-height: 5.5rem;
  font-family: inherit;
}
.hp-kol-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: .85rem .9rem 1rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--primary, #0f766e) 8%);
  box-shadow: 0 1px 0 rgba(0,0,0,.03);
}
.hp-kol-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin: 0 0 .85rem;
}
.hp-kol-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .55rem;
  background: var(--card, #fff);
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-kol-gauge strong {
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
}
.hp-kol-readiness {
  border-radius: 12px;
  padding: .65rem .7rem;
  margin: 0 0 .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-kol-readiness.is-ok {
  border-color: color-mix(in srgb, #059669 40%, var(--border));
  background: color-mix(in srgb, #059669 8%, var(--card, #fff));
}
.hp-kol-readiness.is-mid {
  border-color: color-mix(in srgb, #d97706 40%, var(--border));
  background: color-mix(in srgb, #d97706 8%, var(--card, #fff));
}
.hp-kol-readiness.is-tight {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 7%, var(--card, #fff));
}
.hp-kol-ready-title {
  margin: 0 0 .2rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-kol-flags-box {
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: 0 0 .75rem;
  border: 1px solid #fca5a5;
  background: #fff7f7;
}
.hp-kol-flags-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .85rem;
}
.hp-kol-flags-ul li { margin: .2rem 0; }
.hp-kol-next {
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: 0 0 .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-kol-next-ol {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .85rem;
}
.hp-kol-next-ol li { margin: .25rem 0; }
.hp-kol-commit-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  border-radius: 12px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
  resize: vertical;
  min-height: 10rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.hp-kol-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-kol-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-kol-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-kol-faq details p { margin: .35rem 0 .15rem; }
.hp-kol-formula {
  margin: .65rem 0 .85rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 28%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 7%, var(--card, #fff));
}
.hp-kol-formula-code {
  display: block;
  font-size: .82rem;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  color: var(--text);
}
.hp-kol-meet-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .4rem;
  align-items: center;
  margin: .15rem 0 .35rem;
}
.hp-kol-n {
  display: inline-block;
  min-width: 1.15rem;
  margin-left: .2rem;
  padding: .02rem .32rem;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  background: color-mix(in srgb, var(--brand, #0f766e) 14%, transparent);
  color: var(--brand, #0f766e);
  vertical-align: middle;
}
.hp-kol-filter.is-on .hp-kol-n,
.hp-kol-filter[aria-pressed="true"] .hp-kol-n {
  background: color-mix(in srgb, var(--brand, #0f766e) 22%, transparent);
}
.hp-kol-cat-fill {
  margin-left: auto;
  font-size: .78rem;
}
.hp-kol-seed-hint {
  margin: .35rem 0 .55rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, var(--bg));
}
.hp-kol-seed-row {
  padding-top: .35rem;
  border-top: 1px dashed color-mix(in srgb, var(--border) 80%, transparent);
}
@media (max-width: 560px) {
  .hp-kol-hero { grid-template-columns: 1fr; }
  .hp-kol-hero-copy { grid-column: 1; }
  .hp-kol-hero-mascot { width: 64px; height: 64px; justify-self: start; }
  .hp-kol-panel { position: static; }
  .hp-kol-gauges { grid-template-columns: 1fr; }
  .hp-kol-row-top { flex-direction: column; }
  .hp-kol-st { width: 100%; min-width: 0; }
  .hp-kol-cat-title { flex-direction: column; align-items: flex-start; }
  .hp-kol-cat-fill { margin-left: 0; }
}


.hp-kol-cat-nav {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem .4rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-kol-cat-nav .chip { font-size: .78rem; }
.hp-kol-cat.is-flash {
  outline: 2px solid var(--brand, #0f766e);
  outline-offset: 3px;
  border-radius: 12px;
}
.hp-kol-temp-bar {
  height: 6px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 75%, transparent);
  overflow: hidden;
  margin: .25rem 0 .1rem;
}
.hp-kol-temp-bar > span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #059669;
  transition: width .25s ease, background .2s;
}
.hp-kol-temp-bar > span.is-low { background: #059669; }
.hp-kol-temp-bar > span.is-mid { background: #d97706; }
.hp-kol-temp-bar > span.is-high { background: #ea580c; }
.hp-kol-temp-bar > span.is-crit { background: #dc2626; }
.hp-kol-gauge[data-kol-temp-gauge].is-low strong { color: #059669; }
.hp-kol-gauge[data-kol-temp-gauge].is-mid strong { color: #b45309; }
.hp-kol-gauge[data-kol-temp-gauge].is-high strong { color: #c2410c; }
.hp-kol-gauge[data-kol-temp-gauge].is-crit strong { color: #b91c1c; }
/* —— Innflyttingsfoto (rent_in-innflytting-foto · rent_movein) —— */
.hp-rm-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-rm-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
}
.hp-rm-hero-copy { min-width: 0; grid-column: 2; }
.hp-rm-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-rm-lead-bullets li { margin: .15rem 0; }
.hp-rm-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  padding: .55rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 80%, var(--brand, #0f766e) 6%);
}
.hp-rm-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rm-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-rm-how-list li { margin: .2rem 0; }
.hp-rm-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: .55rem 0 .75rem;
}
.hp-rm-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, #b45309 18%, transparent);
  color: color-mix(in srgb, #b45309 85%, var(--text));
  margin-left: .25rem;
}
.hp-rm-demo-note {
  margin: -.35rem 0 .75rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #b45309 45%, var(--border));
  background: color-mix(in srgb, #b45309 8%, transparent);
}
.hp-rm-demos .chip.active,
.hp-rm-demos .chip[aria-pressed="true"],
.hp-rm-demos .chip.is-on,
.hp-rm-filter .chip.is-on,
.hp-rm-filter .chip[aria-pressed="true"] {
  background: color-mix(in srgb, var(--brand, #0f766e) 18%, transparent);
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
}
.hp-rm-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-rm-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .9fr);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
.hp-rm-section {
  margin: 1.1rem 0 .45rem;
  font-size: 1.05rem;
  font-weight: 700;
}
.hp-rm-filter {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-rm-room-list,
.hp-rm-proto-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .45rem;
}
.hp-rm-room,
.hp-rm-proto-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, transparent);
}
.hp-rm-room.is-gap {
  border-color: color-mix(in srgb, #b45309 45%, var(--border));
  background: color-mix(in srgb, #b45309 7%, var(--bg-elev, #fff));
}
.hp-rm-room.is-ok {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
}
.hp-rm-room.has-dmg .hp-rm-dmg {
  border-color: color-mix(in srgb, #b45309 40%, var(--border));
}
.hp-rm-room-top,
.hp-rm-proto-top {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-rm-room-label,
.hp-rm-proto-label {
  flex: 1 1 12rem;
  min-width: 0;
}
.hp-rm-st-wrap select {
  min-width: 9.5rem;
  max-width: 100%;
}
.hp-rm-dmg-wrap {
  display: block;
  margin-top: .35rem;
}
.hp-rm-dmg {
  width: 100%;
  font-size: .88rem;
}
.hp-rm-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: .85rem .9rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 5%);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--text) 6%, transparent);
}
.hp-rm-live {
  text-align: center;
  margin-bottom: .65rem;
}
.hp-rm-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .78rem;
}
.hp-rm-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
  margin: .55rem 0 .65rem;
}
.hp-rm-gauges .hp-gauge {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .5rem;
  background: color-mix(in srgb, var(--bg, #fff) 70%, transparent);
}
.hp-rm-gauges .hp-gauge strong {
  display: block;
  margin-top: .1rem;
  font-size: .92rem;
}
.hp-rm-bar-wrap { margin: .35rem 0 .65rem; }
.hp-rm-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  overflow: hidden;
}
.hp-rm-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--brand, #0f766e) 75%, #0ea5e9),
    var(--brand, #0f766e)
  );
  transition: width .25s ease;
}
.hp-rm-readiness {
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: .35rem 0 .65rem;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 80%, transparent);
}
.hp-rm-readiness.is-ok {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, transparent);
}
.hp-rm-readiness.is-mid {
  border-color: color-mix(in srgb, #b45309 40%, var(--border));
  background: color-mix(in srgb, #b45309 9%, transparent);
}
.hp-rm-readiness.is-tight {
  border-color: color-mix(in srgb, #b91c1c 40%, var(--border));
  background: color-mix(in srgb, #b91c1c 8%, transparent);
}
.hp-rm-ready-title {
  margin: 0 0 .2rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-rm-gaps {
  margin: .45rem 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #b45309 40%, var(--border));
  background: color-mix(in srgb, #b45309 6%, transparent);
}
.hp-rm-gaps-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .88rem;
}
.hp-rm-gaps-ul li { margin: .15rem 0; }
.hp-rm-meters-box {
  margin: .45rem 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  font-size: .88rem;
}
.hp-rm-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
}
.hp-rm-privacy {
  margin-top: .85rem;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}
.hp-rm-privacy summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
}
.hp-rm-faq details {
  margin: .35rem 0;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}
.hp-rm-faq summary {
  cursor: pointer;
  font-weight: 600;
}
.hp-rm-nonadvice {
  margin-top: .65rem;
  font-size: .8rem;
}
.hp-rm-date-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: -.15rem 0 .35rem;
}
.hp-rm-fc {
  font-size: .72rem;
  font-weight: 700;
  opacity: .8;
  margin-left: .15rem;
}
.hp-rm-check .hp-rm-check-row {
  display: flex;
  align-items: center;
  gap: .45rem;
  margin-top: .3rem;
  font-size: .9rem;
}
.hp-rm-check input[type="checkbox"] {
  width: 1.05rem;
  height: 1.05rem;
  accent-color: var(--brand, #0f766e);
}
.hp-rm-countdown {
  margin: .45rem 0 .65rem;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, transparent);
}
.hp-rm-next-box {
  margin: .45rem 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 85%, transparent);
}
.hp-rm-gap-btn {
  appearance: none;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: var(--brand, #0f766e);
  font-weight: 650;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
  text-align: left;
}
.hp-rm-gap-btn:hover,
.hp-rm-gap-btn:focus-visible {
  color: color-mix(in srgb, var(--brand, #0f766e) 70%, #000);
  outline: none;
}
.hp-rm-flash {
  animation: hp-rm-flash 1.1s ease;
}
@keyframes hp-rm-flash {
  0%, 100% { box-shadow: none; }
  25%, 55% {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand, #0f766e) 45%, transparent);
  }
}
.hp-rm-proto-row.is-ok {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
}
.hp-rm-proto-row.is-gap {
  border-color: color-mix(in srgb, #b45309 45%, var(--border));
  background: color-mix(in srgb, #b45309 7%, var(--bg-elev, #fff));
}
.hp-rm-prep-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .45rem;
}
.hp-rm-prep-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, transparent);
}
.hp-rm-prep-row.is-ok {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
}
.hp-rm-prep-row.is-gap {
  border-color: color-mix(in srgb, #b45309 45%, var(--border));
  background: color-mix(in srgb, #b45309 7%, var(--bg-elev, #fff));
}
.hp-rm-prep-top {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-rm-prep-label {
  flex: 1 1 12rem;
  min-width: 0;
}
.hp-rm-seed-hint {
  margin: 0 0 .75rem;
  padding: .45rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, transparent);
}
.hp-rm-rail {
  margin: .65rem 0 .25rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 4%);
}
.hp-rm-rail-track {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}
.hp-rm-rail-chip {
  display: inline-flex;
  flex-direction: column;
  gap: .1rem;
  padding: .35rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg, #fff) 80%, transparent);
  font-size: .82rem;
  min-width: 5.5rem;
}
.hp-rm-rail-chip.is-on {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, transparent);
}
.hp-rm-formula {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  line-height: 1.35;
  word-break: break-word;
}
.hp-rm-subject {
  width: 100%;
  font-size: .88rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg, #fff) 90%, transparent);
  margin-bottom: .15rem;
}
@media (max-width: 900px) {
  .hp-rm-layout {
    grid-template-columns: 1fr;
  }
  .hp-rm-panel {
    position: static;
  }
}
@media (max-width: 560px) {
  .hp-rm-hero { grid-template-columns: 1fr; }
  .hp-rm-hero-copy { grid-column: 1; }
  .hp-rm-hero-mascot { grid-column: 1; }
  .hp-rm-gauges { grid-template-columns: 1fr; }
  .hp-rm-st-wrap select { min-width: 0; width: 100%; }
}

/* —— Oppsigelses-kalender (rent_in-oppsigelse · rent_oppsig) —— */
.hp-ro { margin: 0; }
.hp-ro-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-ro-hero-copy { min-width: 0; grid-column: 1; }
.hp-ro-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  width: 72px; height: 72px;
  object-fit: contain;
  border-radius: 50%;
  justify-self: end;
}
.hp-ro-how { grid-column: 1 / -1; }
.hp-ro-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-ro-lead-bullets li { margin: .2rem 0; }
.hp-ro-how {
  margin-top: .35rem;
  padding: .55rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-ro-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-ro-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-ro-how-list li { margin: .2rem 0; }
.hp-ro-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #f59e0b) 22%, transparent);
  color: color-mix(in srgb, var(--accent, #b45309) 80%, var(--text));
  vertical-align: middle;
}
.hp-ro-demo-note {
  margin: .35rem 0 .65rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--accent, #f59e0b) 45%, var(--border));
  background: color-mix(in srgb, var(--accent, #f59e0b) 8%, var(--bg));
}
.hp-ro-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
  margin: 0 0 .75rem;
}
.hp-ro-demos .chip { font-size: .8rem; }
.hp-ro-demos .chip.active,
.hp-ro-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg));
}
.hp-ro-layout {
  display: grid;
  grid-template-columns: 1fr minmax(280px, 360px);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
.hp-ro-section {
  font-size: 1.05rem;
  margin: 1rem 0 .45rem;
}
.hp-ro-section:first-child { margin-top: 0; }
.hp-ro-formula {
  margin: .55rem 0 .75rem;
  padding: .5rem .7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev, #fff));
  line-height: 1.45;
}
.hp-ro-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-ro-tab .hp-ro-tab-pct {
  margin-left: .3rem;
  font-size: .72rem;
  opacity: .85;
  font-weight: 700;
}
.hp-ro-tab.is-on {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg));
}
.hp-ro-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .45rem;
}
.hp-ro-filter.is-on {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 10%, var(--bg));
}
.hp-ro-phase-help { margin: 0 0 .45rem; }
.hp-ro-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .45rem;
}
.hp-ro-row {
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-ro-row.is-critical {
  border-color: color-mix(in srgb, var(--accent, #f59e0b) 35%, var(--border));
}
.hp-ro-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-ro-row-label {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem .4rem;
  align-items: center;
  flex: 1;
  min-width: 0;
  font-size: .9rem;
  font-weight: 600;
  line-height: 1.35;
}
.hp-ro-crit-badge {
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #f59e0b) 22%, transparent);
  color: color-mix(in srgb, var(--accent, #b45309) 85%, var(--text));
}
.hp-ro-st {
  min-width: 8.5rem;
  font-size: .85rem;
}
.hp-ro-due { margin: .25rem 0 .2rem; }
.hp-ro-note-inp {
  width: 100%;
  font-size: .85rem;
  margin-top: .15rem;
}
.hp-ro-panel {
  position: sticky;
  top: .75rem;
  padding: .85rem .9rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev, #fff));
  max-height: calc(100vh - 2rem);
  overflow: auto;
}
.hp-ro-live {
  text-align: center;
  padding: .55rem .4rem .65rem;
  border-radius: 12px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg));
  margin-bottom: .65rem;
}
.hp-ro-live.is-soon {
  background: color-mix(in srgb, var(--accent, #f59e0b) 16%, var(--bg));
}
.hp-ro-live.is-today {
  background: color-mix(in srgb, #22c55e 18%, var(--bg));
}
.hp-ro-live.is-past {
  background: color-mix(in srgb, #94a3b8 18%, var(--bg));
}
.hp-ro-nonadvice-fixed {
  margin: .35rem 0 0;
  font-size: .75rem;
}
.hp-ro-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
  margin-bottom: .65rem;
}
.hp-ro-gauges .hp-gauge {
  padding: .4rem .45rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.hp-ro-gauges .hp-gauge strong {
  font-size: .95rem;
  word-break: break-word;
}
.hp-ro-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .84rem;
}
.hp-ro-table th {
  text-align: left;
  font-weight: 600;
  padding: .22rem .3rem .22rem 0;
  vertical-align: top;
  color: var(--muted, #64748b);
}
.hp-ro-table td {
  text-align: right;
  padding: .22rem 0;
  font-weight: 650;
}
.hp-ro-dates-box,
.hp-ro-warn,
.hp-ro-overlap,
.hp-ro-next,
.hp-ro-draft,
.hp-ro-commit {
  margin-top: .7rem;
  padding-top: .55rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-ro-warn-list,
.hp-ro-next-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
  line-height: 1.4;
}
.hp-ro-warn-list li,
.hp-ro-next-list li { margin: .2rem 0; }
.hp-ro-overlap-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
}
.hp-ro-overlap-grid > div {
  display: flex;
  flex-direction: column;
  gap: .1rem;
  padding: .35rem .4rem;
  border-radius: 8px;
  background: var(--bg-elev, #fff);
  border: 1px solid var(--border);
}
.hp-ro-overlap.is-hot {
  border-radius: 10px;
  outline: 1px solid color-mix(in srgb, var(--accent, #f59e0b) 50%, var(--border));
}
.hp-ro-overlap.is-gap {
  border-radius: 10px;
  outline: 1px solid color-mix(in srgb, #64748b 40%, var(--border));
}
.hp-ro-draft-text,
.hp-ro-commit-text {
  width: 100%;
  font-size: .8rem;
  line-height: 1.4;
  font-family: inherit;
  resize: vertical;
  min-height: 6rem;
}
.hp-ro-privacy {
  margin-top: .85rem;
  font-size: .86rem;
}
.hp-ro-privacy summary { cursor: pointer; font-weight: 650; }
.hp-ro-faq details { margin: .35rem 0; }
.hp-ro-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-ro-faq details p { margin: .35rem 0 .15rem; }
.hp-ro-mnd-chips,
.hp-ro-date-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-ro-mnd-chips .chip,
.hp-ro-date-chips .chip {
  font-size: .75rem;
  padding: .2rem .45rem;
}
.hp-ro-mnd-chips .chip.is-on,
.hp-ro-mnd-chips .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg));
}
.hp-ro-seed-hint {
  margin: 0 0 .65rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg));
}
.hp-ro-phase-suggest {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .65rem;
  align-items: center;
  margin: .55rem 0 .75rem;
  padding: .5rem .7rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev, #fff));
  font-size: .88rem;
}
.hp-ro-fc {
  font-size: .72rem;
  font-weight: 700;
  opacity: .85;
  margin-left: .15rem;
}
.hp-ro-rail {
  margin-top: .7rem;
  padding-top: .55rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-ro-rail-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .3rem;
  position: relative;
}
.hp-ro-rail-list::before {
  content: '';
  position: absolute;
  left: .35rem;
  top: .35rem;
  bottom: .35rem;
  width: 2px;
  background: color-mix(in srgb, var(--brand) 35%, var(--border));
  border-radius: 2px;
}
.hp-ro-rail-item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: .35rem .55rem;
  align-items: baseline;
  padding: .25rem .2rem .25rem 1.1rem;
  position: relative;
  font-size: .82rem;
}
.hp-ro-rail-item::before {
  content: '';
  position: absolute;
  left: .2rem;
  top: .55rem;
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
  background: var(--brand);
  border: 2px solid var(--bg-elev, #fff);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand) 40%, transparent);
}
.hp-ro-rail-item.is-past {
  opacity: .72;
}
.hp-ro-rail-item.is-past::before {
  background: #94a3b8;
  box-shadow: 0 0 0 1px #94a3b8;
}
.hp-ro-rail-item.is-today::before,
.hp-ro-rail-item.is-soon::before {
  background: var(--accent, #f59e0b);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent, #f59e0b) 50%, transparent);
}
.hp-ro-rail-date { font-weight: 700; white-space: nowrap; }
.hp-ro-rail-label { font-weight: 600; }
.hp-ro-rail-delta { font-size: .75rem; white-space: nowrap; }
.hp-ro-next-btn {
  display: block;
  width: 100%;
  text-align: left;
  background: transparent;
  border: 0;
  padding: .15rem 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  border-radius: 6px;
}
.hp-ro-next-btn:hover,
.hp-ro-next-btn:focus-visible {
  background: color-mix(in srgb, var(--brand) 10%, transparent);
  outline: none;
}
.hp-ro-row.hp-ro-flash {
  animation: hp-ro-flash 1.4s ease;
  border-color: var(--brand);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand) 35%, transparent);
}
@keyframes hp-ro-flash {
  0% { background: color-mix(in srgb, var(--brand) 22%, var(--bg-elev, #fff)); }
  100% { background: var(--bg-elev, #fff); }
}
@media (max-width: 900px) {
  .hp-ro-layout { grid-template-columns: 1fr; }
  .hp-ro-panel {
    position: static;
    max-height: none;
  }
  .hp-ro-hero { grid-template-columns: 1fr auto; }
}
@media (max-width: 560px) {
  .hp-ro-hero { grid-template-columns: 1fr; }
  .hp-ro-hero-copy { grid-column: 1; }
  .hp-ro-hero-mascot {
    grid-column: 1;
    grid-row: auto;
    justify-self: start;
    width: 64px;
    height: 64px;
  }
  .hp-ro-gauges { grid-template-columns: 1fr; }
  .hp-ro-row-top { flex-direction: column; }
  .hp-ro-st { width: 100%; min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-ro-panel { scroll-behavior: auto; }
}

/* Plan-temperatur + match + what-if + partner + pays/SMS/impact (rent_oppsig upgrades) */
.hp-ro-progbar {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin: 0 0 .55rem;
}
.hp-ro-progbar-track {
  flex: 1;
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-ro-progbar-fill {
  height: 100%;
  width: 0%;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--brand) 75%, #22c55e),
    var(--brand)
  );
  transition: width .25s ease;
}
.hp-ro-impact {
  margin-top: .65rem;
  padding: .5rem .6rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--border));
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev, #fff));
  font-size: .84rem;
  line-height: 1.4;
}
.hp-ro-pays {
  margin-top: .7rem;
  padding-top: .55rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-ro-pays-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .25rem;
  font-size: .84rem;
}
.hp-ro-pays-list li {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  padding: .28rem .4rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-ro-sms {
  margin-top: .7rem;
  padding-top: .55rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-ro-sms-text {
  width: 100%;
  font-size: .8rem;
  line-height: 1.4;
  font-family: inherit;
  resize: vertical;
  min-height: 3.5rem;
}
.hp-ro-temp {
  text-align: center;
  padding: .5rem .55rem .55rem;
  border-radius: 12px;
  margin-bottom: .65rem;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev, #fff));
}
.hp-ro-temp.is-ok {
  background: color-mix(in srgb, #22c55e 14%, var(--bg));
  border-color: color-mix(in srgb, #22c55e 40%, var(--border));
}
.hp-ro-temp.is-check {
  background: color-mix(in srgb, var(--accent, #f59e0b) 12%, var(--bg));
  border-color: color-mix(in srgb, var(--accent, #f59e0b) 40%, var(--border));
}
.hp-ro-temp.is-missing {
  background: color-mix(in srgb, #ef4444 12%, var(--bg));
  border-color: color-mix(in srgb, #ef4444 35%, var(--border));
}
.hp-ro-temp strong {
  display: block;
  font-size: 1.15rem;
  letter-spacing: .02em;
}
.hp-ro-match {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: flex-start;
  margin: .55rem 0 .65rem;
  padding: .5rem .7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  font-size: .88rem;
  line-height: 1.4;
}
.hp-ro-match-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .15rem .45rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 14%, transparent);
  flex-shrink: 0;
}
.hp-ro-match-badge.is-ok,
.hp-ro-match.is-ok .hp-ro-match-badge {
  background: color-mix(in srgb, #22c55e 22%, transparent);
  color: color-mix(in srgb, #15803d 90%, var(--text));
}
.hp-ro-match-badge.is-warn,
.hp-ro-match.is-warn .hp-ro-match-badge {
  background: color-mix(in srgb, var(--accent, #f59e0b) 24%, transparent);
  color: color-mix(in srgb, #b45309 90%, var(--text));
}
.hp-ro-match-badge.is-info {
  background: color-mix(in srgb, var(--brand) 16%, transparent);
}
.hp-ro-match.is-ok {
  border-color: color-mix(in srgb, #22c55e 35%, var(--border));
  background: color-mix(in srgb, #22c55e 6%, var(--bg-elev, #fff));
}
.hp-ro-match.is-warn {
  border-color: color-mix(in srgb, var(--accent, #f59e0b) 40%, var(--border));
  background: color-mix(in srgb, var(--accent, #f59e0b) 7%, var(--bg-elev, #fff));
}
.hp-ro-quick-actions { margin: .45rem 0 .55rem; }
.hp-ro-row.is-overdue {
  border-color: color-mix(in srgb, #ef4444 45%, var(--border));
  background: color-mix(in srgb, #ef4444 5%, var(--bg-elev, #fff));
}
.hp-ro-row.is-overdue .hp-ro-due {
  color: color-mix(in srgb, #b91c1c 85%, var(--text));
  font-weight: 650;
}
.hp-ro-whatif-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
}
.hp-ro-whatif-chips .chip.is-on,
.hp-ro-whatif-chips .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg));
}
.hp-ro-subject,
.hp-ro-partner {
  margin-top: .7rem;
  padding-top: .55rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-ro-subject-inp {
  width: 100%;
  font-size: .84rem;
  font-weight: 600;
}
.hp-ro-partner-text {
  width: 100%;
  font-size: .8rem;
  line-height: 1.4;
  font-family: inherit;
  resize: vertical;
  min-height: 4.5rem;
}
.hp-ro-gauges {
  grid-template-columns: 1fr 1fr;
}
.hp-ro-overlap-grid {
  grid-template-columns: 1fr 1fr;
}
@media (max-width: 560px) {
  .hp-ro-match { flex-direction: column; }
}

/* —— Innbo-sjekk (rent_in-forsikring-innbo / rent_innbo) —— */
.hp-ri { display: grid; gap: 1rem; }
.hp-ri-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .85rem 1rem;
  align-items: start;
  padding: .85rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
}
.hp-ri-hero-mascot {
  width: 72px; height: 72px; border-radius: 50%;
  object-fit: cover; flex-shrink: 0;
  border: 2px solid color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-ri-hero-copy { min-width: 0; grid-column: 2; }
.hp-ri-lead-bullets {
  margin: .25rem 0 0; padding-left: 1.15rem;
  font-size: .88rem; color: var(--muted);
}
.hp-ri-lead-bullets li { margin: .15rem 0; }
.hp-ri-how {
  grid-column: 1 / -1;
  margin-top: .15rem;
  border-top: 1px dashed color-mix(in srgb, var(--brand) 25%, var(--border));
  padding-top: .45rem;
}
.hp-ri-how summary { cursor: pointer; font-weight: 700; font-size: .92rem; }
.hp-ri-how-list { margin: .35rem 0 0; padding-left: 1.2rem; font-size: .88rem; color: var(--muted); }
.hp-ri-how-list li { margin: .2rem 0; }
.hp-ri-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg));
  color: color-mix(in srgb, #b45309 80%, var(--text));
}
.hp-ri-demo-note {
  margin: .25rem 0 0;
  padding: .4rem .65rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg));
}
.hp-ri-demos {
  display: flex; flex-wrap: wrap; gap: .4rem; align-items: center;
}
.hp-ri-demos .chip { font-size: .8rem; }
.hp-ri-demos .chip.active,
.hp-ri-demos .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-ri-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-ri-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
.hp-ri-main { order: 1; min-width: 0; }
.hp-ri-panel {
  order: 0;
  position: sticky;
  top: .75rem;
  max-height: calc(100vh - 1.5rem);
  overflow: auto;
  padding: .9rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 60%, transparent);
}
.hp-ri-section {
  margin: 1.1rem 0 .45rem;
  font-size: 1.05rem;
  font-weight: 750;
}
.hp-ri-section:first-child { margin-top: 0; }
.hp-ri-val-quick {
  display: flex; flex-wrap: wrap; gap: .35rem; align-items: center;
  margin: .45rem 0 .85rem;
}
.hp-ri-val-quick .chip.active,
.hp-ri-val-quick .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 45%, transparent);
}
.hp-ri-cov-list,
.hp-ri-rf-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .4rem;
}
.hp-ri-cov-row {
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
}
.hp-ri-cov-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-ri-cov-label { flex: 1; min-width: 160px; }
.hp-ri-st-wrap { flex-shrink: 0; }
.hp-ri-st {
  min-width: 9.5rem;
  font-size: .85rem;
}
.hp-ri-rf-item {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  padding: .35rem .45rem;
  border-radius: 8px;
  cursor: pointer;
}
.hp-ri-rf-item:hover {
  background: color-mix(in srgb, var(--brand) 6%, transparent);
}
.hp-ri-rf-item input { margin-top: .2rem; accent-color: #dc2626; }
.hp-ri-live {
  text-align: center;
  padding: .35rem 0 .55rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: .65rem;
}
.hp-ri-nonadvice-fixed {
  font-size: .75rem !important;
  opacity: .85;
}
.hp-ri-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .55rem 0 .7rem;
}
.hp-ri-gauges .hp-gauge {
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev));
}
.hp-ri-gauges .hp-gauge strong { font-size: .9rem; display: block; }
.hp-ri-readiness {
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  margin: .45rem 0 .65rem;
  background: color-mix(in srgb, var(--muted) 8%, var(--bg-elev));
}
.hp-ri-readiness.is-ok {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 10%, var(--bg-elev));
}
.hp-ri-readiness.is-check {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-ri-readiness.is-missing {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 9%, var(--bg-elev));
}
.hp-ri-readiness.is-empty {
  border-color: var(--border);
  background: color-mix(in srgb, var(--muted) 8%, var(--bg-elev));
}
.hp-ri-rf-item:has(input:checked) {
  background: color-mix(in srgb, #dc2626 8%, var(--bg-elev));
  outline: 1px solid color-mix(in srgb, #dc2626 28%, var(--border));
}
.hp-ri-ready-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .98rem;
}
.hp-ri-bar-wrap { margin: .55rem 0 .75rem; }
.hp-ri-bar {
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, var(--bg));
  overflow: hidden;
}
.hp-ri-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: #38bdf8;
  transition: width .2s ease, background .2s ease;
}
.hp-ri-fill.is-ok { background: #16a34a; }
.hp-ri-fill.is-mid { background: #f59e0b; }
.hp-ri-fill.is-low { background: #dc2626; }
.hp-ri-breakdown,
.hp-ri-alerts,
.hp-ri-commit {
  margin: .65rem 0;
}
.hp-ri-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .88rem;
}
.hp-ri-table th,
.hp-ri-table td {
  padding: .22rem 0;
  text-align: left;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-ri-table th { font-weight: 600; width: 55%; }
.hp-ri-tr-strong th,
.hp-ri-tr-strong td { font-weight: 750; }
.hp-ri-alert-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  color: var(--muted);
}
.hp-ri-alert-list li { margin: .2rem 0; }
.hp-ri-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 8rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  padding: .5rem .6rem;
}
.hp-ri-privacy {
  margin-top: 1rem;
  font-size: .88rem;
}
.hp-ri-privacy summary { cursor: pointer; font-weight: 600; }
.hp-ri-faq details { margin: .35rem 0; }
.hp-ri-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-ri-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 900px) {
  .hp-ri-layout { grid-template-columns: 1fr; }
  .hp-ri-panel { position: static; order: 0; max-height: none; }
  .hp-ri-main { order: 1; }
}
@media (max-width: 560px) {
  .hp-ri-hero { grid-template-columns: 1fr; }
  .hp-ri-hero-copy { grid-column: 1; }
  .hp-ri-hero-mascot { grid-column: 1; grid-row: auto; justify-self: start; }
  .hp-ri-gauges { grid-template-columns: 1fr; }
  .hp-ri-cov-top { flex-direction: column; }
  .hp-ri-st { width: 100%; min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-ri-fill { transition: none; }
  .hp-ri-panel { scroll-behavior: auto; }
}

/* —— Parkering & bod (rent_in-parkering-bod / rent_park) —— */
.hp-rpk { display: grid; gap: 1rem; }
.hp-rpk-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .85rem 1rem;
  align-items: start;
  padding: .85rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
}
.hp-rpk-hero-mascot {
  width: 72px; height: 72px; border-radius: 50%;
  object-fit: cover; flex-shrink: 0;
  border: 2px solid color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-rpk-hero-copy { min-width: 0; grid-column: 2; }
.hp-rpk-lead-bullets {
  margin: .25rem 0 0; padding-left: 1.15rem;
  font-size: .88rem; color: var(--muted);
}
.hp-rpk-lead-bullets li { margin: .15rem 0; }
.hp-rpk-how {
  grid-column: 1 / -1;
  margin-top: .15rem;
  border-top: 1px dashed color-mix(in srgb, var(--brand) 25%, var(--border));
  padding-top: .45rem;
}
.hp-rpk-how summary { cursor: pointer; font-weight: 700; font-size: .92rem; }
.hp-rpk-how-list { margin: .35rem 0 0; padding-left: 1.2rem; font-size: .88rem; color: var(--muted); }
.hp-rpk-how-list li { margin: .2rem 0; }
.hp-rpk-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg));
  color: color-mix(in srgb, #b45309 80%, var(--text));
}
.hp-rpk-demo-note {
  margin: .25rem 0 0;
  padding: .4rem .65rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg));
}
.hp-rpk-demos {
  display: flex; flex-wrap: wrap; gap: .4rem; align-items: center;
}
.hp-rpk-demos .chip { font-size: .8rem; }
.hp-rpk-demos .chip.active,
.hp-rpk-demos .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-rpk-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-rpk-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
.hp-rpk-main { order: 1; min-width: 0; }
.hp-rpk-panel {
  order: 0;
  position: sticky;
  top: .75rem;
  max-height: calc(100vh - 1.5rem);
  overflow: auto;
  padding: .9rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 60%, transparent);
}
.hp-rpk-section {
  margin: 1.1rem 0 .45rem;
  font-size: 1.05rem;
  font-weight: 750;
}
.hp-rpk-section:first-child { margin-top: 0; }
.hp-rpk-seed-hint {
  margin: .35rem 0 0;
  padding: .4rem .65rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg));
}
.hp-rpk-suggest-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-rpk-formula {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem !important;
  line-height: 1.35;
  word-break: break-word;
  opacity: .95;
}
.hp-rpk-winner {
  font-weight: 700;
  color: color-mix(in srgb, var(--brand) 70%, var(--text));
}
.hp-rpk-hull {
  margin: .65rem 0;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 6%, var(--bg-elev));
}
.hp-rpk-hull-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .3rem;
}
.hp-rpk-hull-jump {
  display: block;
  width: 100%;
  text-align: left;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  border-radius: 8px;
  padding: .35rem .55rem;
  font-size: .82rem;
  cursor: pointer;
}
.hp-rpk-hull-jump:hover,
.hp-rpk-hull-jump:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--brand) 50%, transparent);
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
}
.hp-rpk-subj {
  width: 100%;
  font-size: .85rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  padding: .4rem .55rem;
  margin-bottom: .15rem;
}
.hp-rpk-b-wrap {
  margin: 1rem 0;
  padding: .65rem .75rem;
  border-radius: 12px;
  border: 1px dashed var(--border);
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev));
}
.hp-rpk-b-wrap > summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .95rem;
}
.hp-rpk-check-field { display: flex; align-items: center; }
.hp-rpk-check {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  cursor: pointer;
  font-size: .9rem;
}
.hp-rpk-check input { margin-top: .2rem; }
.hp-rpk-check-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .4rem;
}
.hp-rpk-need-presets {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .55rem 0 .15rem;
}
.hp-rpk-need-presets .chip.active,
.hp-rpk-need-presets .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-rpk-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-rpk-filter-bar .chip.active,
.hp-rpk-filter-bar .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-rpk-filter-bar [data-rpk-fc] {
  font-variant-numeric: tabular-nums;
  opacity: .85;
  font-size: .78em;
}
.hp-rpk-check-row {
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
  transition: border-color .15s ease, background .15s ease;
}
.hp-rpk-check-row.is-ok {
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
  background: color-mix(in srgb, #16a34a 7%, var(--bg-elev));
}
.hp-rpk-check-row.is-warn {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev));
}
.hp-rpk-check-row.is-bad {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 7%, var(--bg-elev));
}
.hp-rpk-check-row.is-open {
  border-color: color-mix(in srgb, var(--muted) 35%, var(--border));
}
.hp-rpk-check-row.is-na {
  opacity: .72;
}
.hp-rpk-check-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-rpk-check-label { flex: 1; min-width: 160px; }
.hp-rpk-st-wrap { flex-shrink: 0; }
.hp-rpk-st { min-width: 9.5rem; font-size: .85rem; }
.hp-rpk-live {
  text-align: center;
  padding: .35rem 0 .55rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: .65rem;
}
.hp-rpk-nonadvice-fixed {
  font-size: .75rem !important;
  opacity: .85;
}
.hp-rpk-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .55rem 0 .7rem;
}
.hp-rpk-gauges .hp-gauge {
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev));
}
.hp-rpk-gauges .hp-gauge strong { font-size: .9rem; display: block; }
.hp-rpk-next {
  margin: .55rem 0 .65rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev));
}
.hp-rpk-readiness {
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  margin: .45rem 0 .65rem;
  background: color-mix(in srgb, var(--muted) 8%, var(--bg-elev));
}
.hp-rpk-readiness.is-ok {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 10%, var(--bg-elev));
}
.hp-rpk-readiness.is-check {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-rpk-readiness.is-missing {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 9%, var(--bg-elev));
}
.hp-rpk-readiness.is-empty {
  border-color: var(--border);
  background: color-mix(in srgb, var(--muted) 8%, var(--bg-elev));
}
.hp-rpk-ready-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .98rem;
}
.hp-rpk-bar-wrap { margin: .55rem 0 .75rem; }
.hp-rpk-bar {
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, var(--bg));
  overflow: hidden;
}
.hp-rpk-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: #38bdf8;
  transition: width .2s ease, background .2s ease;
}
.hp-rpk-fill.is-ok { background: #16a34a; }
.hp-rpk-fill.is-mid { background: #f59e0b; }
.hp-rpk-fill.is-low { background: #dc2626; }
.hp-rpk-breakdown,
.hp-rpk-ab,
.hp-rpk-alerts,
.hp-rpk-next,
.hp-rpk-commit {
  margin: .65rem 0;
}
.hp-rpk-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .88rem;
}
.hp-rpk-table th,
.hp-rpk-table td {
  padding: .22rem 0;
  text-align: left;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  vertical-align: top;
}
.hp-rpk-table th { font-weight: 600; width: 40%; }
.hp-rpk-tr-strong th,
.hp-rpk-tr-strong td { font-weight: 750; }
.hp-rpk-alert-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  color: var(--muted);
}
.hp-rpk-alert-list li { margin: .2rem 0; }
.hp-rpk-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 8rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  padding: .5rem .6rem;
}
.hp-rpk-privacy {
  margin-top: 1rem;
  font-size: .88rem;
}
.hp-rpk-privacy summary { cursor: pointer; font-weight: 600; }
.hp-rpk-faq details { margin: .35rem 0; }
.hp-rpk-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rpk-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 900px) {
  .hp-rpk-layout { grid-template-columns: 1fr; }
  .hp-rpk-panel { position: static; order: 0; max-height: none; }
  .hp-rpk-main { order: 1; }
}
@media (max-width: 560px) {
  .hp-rpk-hero { grid-template-columns: 1fr; }
  .hp-rpk-hero-copy { grid-column: 1; }
  .hp-rpk-hero-mascot { grid-column: 1; grid-row: auto; justify-self: start; }
  .hp-rpk-gauges { grid-template-columns: 1fr; }
  .hp-rpk-check-top { flex-direction: column; }
  .hp-rpk-st { width: 100%; min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-rpk-fill { transition: none; }
  .hp-rpk-panel { scroll-behavior: auto; }
}
.hp-rpk-cost-chips {
  margin: .55rem 0 0.85rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--brand) 28%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev));
  display: grid;
  gap: .4rem;
}
.hp-rpk-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem .35rem;
  align-items: center;
}
.hp-rpk-chip-row .chip.active,
.hp-rpk-chip-row .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-rpk-must {
  margin: .55rem 0 .65rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 7%, var(--bg-elev));
}
.hp-rpk-must-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  color: var(--muted);
}
.hp-rpk-must-list li { margin: .18rem 0; }
.hp-rpk-mobile-bar { display: none; }
@media (max-width: 900px) {
  .hp-rpk-mobile-bar {
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    padding: .45rem .65rem calc(.45rem + env(safe-area-inset-bottom, 0));
    border-top: 1px solid var(--border);
    background: color-mix(in srgb, var(--bg-elev) 92%, transparent);
    backdrop-filter: blur(8px);
    box-shadow: 0 -4px 18px color-mix(in srgb, #000 12%, transparent);
  }
  .hp-rpk-mobile-bar[hidden] { display: none !important; }
  .hp-rpk-mobile-bar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
    max-width: 720px;
    margin: 0 auto;
  }
  .hp-rpk-mobile-bar-meta {
    display: grid;
    gap: .05rem;
    min-width: 0;
  }
  .hp-rpk-mobile-bar-num {
    font-size: 1.05rem;
    font-variant-numeric: tabular-nums;
  }
  .hp-rpk {
    padding-bottom: 4.5rem;
  }
}

/* —— Dyr i leie (rent_in-dyre-regler / rent_pets) —— */
.hp-rp { display: grid; gap: 1rem; }
.hp-rp-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .85rem 1rem;
  align-items: start;
  padding: .85rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
}
.hp-rp-hero-mascot {
  width: 72px; height: 72px; border-radius: 50%;
  object-fit: cover; flex-shrink: 0;
  border: 2px solid color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-rp-hero-copy { min-width: 0; grid-column: 2; }
.hp-rp-lead-bullets {
  margin: .25rem 0 0; padding-left: 1.15rem;
  font-size: .88rem; color: var(--muted);
}
.hp-rp-lead-bullets li { margin: .15rem 0; }
.hp-rp-how {
  grid-column: 1 / -1;
  margin-top: .15rem;
  border-top: 1px dashed color-mix(in srgb, var(--brand) 25%, var(--border));
  padding-top: .45rem;
}
.hp-rp-how summary { cursor: pointer; font-weight: 700; font-size: .92rem; }
.hp-rp-how-list { margin: .35rem 0 0; padding-left: 1.2rem; font-size: .88rem; color: var(--muted); }
.hp-rp-how-list li { margin: .2rem 0; }
.hp-rp-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg));
  color: color-mix(in srgb, #b45309 80%, var(--text));
}
.hp-rp-demo-note {
  margin: .25rem 0 0;
  padding: .4rem .65rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg));
}
.hp-rp-demos {
  display: flex; flex-wrap: wrap; gap: .4rem; align-items: center;
}
.hp-rp-demos .chip { font-size: .8rem; }
.hp-rp-demos .chip.active,
.hp-rp-demos .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-rp-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-rp-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
.hp-rp-main { order: 1; min-width: 0; }
.hp-rp-panel {
  order: 0;
  position: sticky;
  top: .75rem;
  max-height: calc(100vh - 1.5rem);
  overflow: auto;
  padding: .9rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 60%, transparent);
}
.hp-rp-section {
  margin: 1.1rem 0 .45rem;
  font-size: 1.05rem;
  font-weight: 750;
}
.hp-rp-section:first-child { margin-top: 0; }
.hp-rp-seed-hint {
  margin: .35rem 0 0;
  padding: .4rem .65rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg));
}
.hp-rp-suggest-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-rp-m-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  align-items: center;
  margin-top: .35rem;
}
.hp-rp-m-chips .chip.active,
.hp-rp-m-chips .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-rp-formula {
  margin: .55rem 0 .7rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev));
}
.hp-rp-formula-line {
  margin: 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .82rem;
  font-weight: 650;
  line-height: 1.35;
  word-break: break-word;
}
.hp-rp-partner {
  margin: .55rem 0 .65rem;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev));
}
.hp-rp-prio-badge {
  display: inline-block;
  margin-left: .4rem;
  font-size: .68rem;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .05rem .32rem;
  border-radius: 999px;
  vertical-align: middle;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg));
  color: color-mix(in srgb, #b45309 85%, var(--text));
  border: 1px solid color-mix(in srgb, #f59e0b 40%, var(--border));
}
.hp-rp-cov-row.is-prio {
  box-shadow: inset 3px 0 0 color-mix(in srgb, #f59e0b 75%, transparent);
}
.hp-rp-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-rp-filter-bar .chip.active,
.hp-rp-filter-bar .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-rp-filter-bar [data-rp-fc] {
  font-variant-numeric: tabular-nums;
  opacity: .85;
  font-size: .78em;
}
.hp-rp-cov-list,
.hp-rp-rf-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .4rem;
}
.hp-rp-cov-row {
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
  transition: border-color .15s ease, background .15s ease;
}
.hp-rp-cov-row.is-ok {
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
  background: color-mix(in srgb, #16a34a 7%, var(--bg-elev));
}
.hp-rp-cov-row.is-warn {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev));
}
.hp-rp-cov-row.is-bad {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 7%, var(--bg-elev));
}
.hp-rp-cov-row.is-open {
  border-color: color-mix(in srgb, var(--muted) 35%, var(--border));
}
.hp-rp-cov-row.is-na { opacity: .72; }
.hp-rp-cov-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-rp-cov-label { flex: 1; min-width: 160px; }
.hp-rp-st-wrap { flex-shrink: 0; }
.hp-rp-st {
  min-width: 9.5rem;
  font-size: .85rem;
}
.hp-rp-hull {
  margin: .65rem 0;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 6%, var(--bg-elev));
}
.hp-rp-hull-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .25rem;
}
.hp-rp-hull-jump {
  display: block;
  width: 100%;
  text-align: left;
  font: inherit;
  font-size: .86rem;
  padding: .3rem .4rem;
  border-radius: 8px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--text);
  cursor: pointer;
}
.hp-rp-hull-jump:hover,
.hp-rp-hull-jump:focus-visible {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg));
  outline: none;
}
.hp-rp-subj {
  width: 100%;
  font-size: .88rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  margin-bottom: .15rem;
}
.hp-rp-rf-item {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  padding: .35rem .45rem;
  border-radius: 8px;
  cursor: pointer;
}
.hp-rp-rf-item:hover {
  background: color-mix(in srgb, var(--brand) 6%, transparent);
}
.hp-rp-rf-item input { margin-top: .2rem; accent-color: #dc2626; }
.hp-rp-rf-item:has(input:checked) {
  background: color-mix(in srgb, #dc2626 8%, var(--bg-elev));
  outline: 1px solid color-mix(in srgb, #dc2626 28%, var(--border));
}
.hp-rp-live {
  text-align: center;
  padding: .35rem 0 .55rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: .65rem;
}
.hp-rp-nonadvice-fixed {
  font-size: .75rem !important;
  opacity: .85;
}
.hp-rp-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .55rem 0 .7rem;
}
.hp-rp-gauges .hp-gauge {
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev));
}
.hp-rp-gauges .hp-gauge strong { font-size: .9rem; display: block; }
.hp-rp-readiness {
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  margin: .45rem 0 .65rem;
  background: color-mix(in srgb, var(--muted) 8%, var(--bg-elev));
}
.hp-rp-readiness.is-ok {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 10%, var(--bg-elev));
}
.hp-rp-readiness.is-check {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-rp-readiness.is-missing {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 9%, var(--bg-elev));
}
.hp-rp-readiness.is-empty {
  border-color: var(--border);
  background: color-mix(in srgb, var(--muted) 8%, var(--bg-elev));
}
.hp-rp-ready-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .98rem;
}
.hp-rp-bar-wrap { margin: .55rem 0 .75rem; }
.hp-rp-bar {
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, var(--bg));
  overflow: hidden;
}
.hp-rp-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: #38bdf8;
  transition: width .2s ease, background .2s ease;
}
.hp-rp-fill.is-ok { background: #16a34a; }
.hp-rp-fill.is-mid { background: #f59e0b; }
.hp-rp-fill.is-low { background: #dc2626; }
.hp-rp-breakdown,
.hp-rp-alerts,
.hp-rp-next,
.hp-rp-commit {
  margin: .65rem 0;
}
.hp-rp-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .88rem;
}
.hp-rp-table th,
.hp-rp-table td {
  padding: .22rem 0;
  text-align: left;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-rp-table th { font-weight: 600; width: 55%; }
.hp-rp-tr-strong th,
.hp-rp-tr-strong td { font-weight: 750; }
.hp-rp-alert-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  color: var(--muted);
}
.hp-rp-alert-list li { margin: .2rem 0; }
.hp-rp-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  padding: .5rem .6rem;
}
.hp-rp-privacy {
  margin-top: 1rem;
  font-size: .88rem;
}
.hp-rp-privacy summary { cursor: pointer; font-weight: 600; }
.hp-rp-faq details { margin: .35rem 0; }
.hp-rp-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rp-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 900px) {
  .hp-rp-layout { grid-template-columns: 1fr; }
  .hp-rp-panel { position: static; order: 0; max-height: none; }
  .hp-rp-main { order: 1; }
}
@media (max-width: 560px) {
  .hp-rp-hero { grid-template-columns: 1fr; }
  .hp-rp-hero-copy { grid-column: 1; }
  .hp-rp-hero-mascot { grid-column: 1; grid-row: auto; justify-self: start; }
  .hp-rp-gauges { grid-template-columns: 1fr; }
  .hp-rp-cov-top { flex-direction: column; }
  .hp-rp-st { width: 100%; min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-rp-fill { transition: none; }
  .hp-rp-panel { scroll-behavior: auto; }
}

/* —— Utleier-sjekk (rent_in-utleier-sjekk · utleier_sjekk) —— */
.hp-ul { display: grid; gap: 1rem; }
.hp-ul-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .85rem 1rem;
  align-items: start;
  padding: .85rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
}
.hp-ul-suggest-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .45rem;
  align-items: center;
  margin: 0 0 .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev));
}
.hp-ul-suggest-bar [data-ul-suggest-note] {
  flex: 1 1 12rem;
  min-width: 0;
}
.hp-ul-w-tag {
  display: inline-block;
  margin-left: .35rem;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .05rem .3rem;
  border-radius: 4px;
  vertical-align: middle;
  background: color-mix(in srgb, var(--brand) 14%, var(--bg));
  color: color-mix(in srgb, var(--brand) 70%, var(--text));
}
.hp-ul-formula {
  margin: .55rem 0 .7rem;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev));
}
.hp-ul-formula summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .9rem;
}
.hp-ul-formula-list {
  margin: .25rem 0 0;
  padding-left: 0;
  list-style: none;
  font-size: .82rem;
  color: var(--muted);
}
.hp-ul-formula-list li {
  margin: .18rem 0;
  display: flex;
  gap: .4rem;
  align-items: baseline;
}
.hp-ul-fp-pts {
  display: inline-block;
  min-width: 2.1rem;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  color: color-mix(in srgb, #dc2626 75%, var(--text));
}
.hp-ul-decision {
  margin: .55rem 0 .7rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
}
.hp-ul-decision-line {
  margin: 0;
  font-weight: 650;
  font-size: .92rem;
}
.hp-ul-hero-mascot {
  width: 72px; height: 72px; border-radius: 50%;
  object-fit: cover; flex-shrink: 0;
  border: 2px solid color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-ul-hero-copy { min-width: 0; grid-column: 2; }
.hp-ul-lead-bullets {
  margin: .25rem 0 0; padding-left: 1.15rem;
  font-size: .88rem; color: var(--muted);
}
.hp-ul-lead-bullets li { margin: .15rem 0; }
.hp-ul-how {
  grid-column: 1 / -1;
  margin-top: .15rem;
  border-top: 1px dashed color-mix(in srgb, var(--brand) 25%, var(--border));
  padding-top: .45rem;
}
.hp-ul-how summary { cursor: pointer; font-weight: 700; font-size: .92rem; }
.hp-ul-how-list { margin: .35rem 0 0; padding-left: 1.2rem; font-size: .88rem; color: var(--muted); }
.hp-ul-how-list li { margin: .2rem 0; }
.hp-ul-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg));
  color: color-mix(in srgb, #b45309 80%, var(--text));
}
.hp-ul-demo-note {
  margin: .25rem 0 0;
  padding: .4rem .65rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg));
}
.hp-ul-demos {
  display: flex; flex-wrap: wrap; gap: .4rem; align-items: center;
}
.hp-ul-demos .chip { font-size: .8rem; }
.hp-ul-demos .chip.active,
.hp-ul-demos .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-ul-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-ul-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
/* Form left (wider), sticky result right — matches hard_budget / depositum */
.hp-ul-main { order: 1; min-width: 0; }
.hp-ul-panel {
  order: 2;
  position: sticky;
  top: .75rem;
  max-height: calc(100vh - 1.5rem);
  overflow: auto;
  padding: .9rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 60%, transparent);
}
.hp-ul-golden {
  display: grid;
  gap: .25rem;
  margin: .35rem 0 .55rem;
  padding: .55rem .7rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev));
  font-size: .84rem;
  color: var(--muted);
}
.hp-ul-golden strong { color: var(--text); font-weight: 700; }
.hp-ul-golden ul {
  margin: .2rem 0 0;
  padding-left: 1.1rem;
}
.hp-ul-golden li { margin: .12rem 0; }
.hp-ul-slots {
  margin: .55rem 0 .75rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
}
.hp-ul-slots-head {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .5rem;
  align-items: center;
  margin-bottom: .4rem;
}
.hp-ul-slots-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .8rem;
}
.hp-ul-slots-table th,
.hp-ul-slots-table td {
  text-align: left;
  padding: .28rem .3rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  vertical-align: top;
}
.hp-ul-slots-table th { font-weight: 700; color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .03em; }
.hp-ul-slots-table .hp-ul-slot-empty { color: var(--muted); font-style: italic; }
.hp-ul-slots-table .is-stop { color: color-mix(in srgb, #dc2626 85%, var(--text)); font-weight: 700; }
.hp-ul-slots-table .is-check { color: color-mix(in srgb, #b45309 90%, var(--text)); font-weight: 650; }
.hp-ul-slots-table .is-ok { color: color-mix(in srgb, #15803d 90%, var(--text)); font-weight: 650; }
.hp-ul-slot-actions { display: flex; flex-wrap: wrap; gap: .25rem; }
.hp-ul-stop-banner {
  margin: 0 0 .65rem;
  padding: .55rem .7rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #dc2626 50%, var(--border));
  background: color-mix(in srgb, #dc2626 12%, var(--bg-elev));
  font-size: .88rem;
}
.hp-ul-stop-banner[hidden] { display: none !important; }
.hp-ul-stop-banner strong { display: block; margin-bottom: .15rem; color: color-mix(in srgb, #991b1b 80%, var(--text)); }
.hp-ul-live [data-out="temp_show"].is-ok { color: color-mix(in srgb, #15803d 90%, var(--text)); }
.hp-ul-live [data-out="temp_show"].is-check { color: color-mix(in srgb, #b45309 90%, var(--text)); }
.hp-ul-live [data-out="temp_show"].is-stop { color: color-mix(in srgb, #dc2626 90%, var(--text)); }
.hp-ul-live [data-out="temp_show"].is-empty { color: var(--muted); }
.hp-ul-dep-hint {
  margin: .35rem 0 .55rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--brand) 25%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg));
  font-size: .82rem;
  color: var(--muted);
}
.hp-ul-dep-hint[hidden] { display: none !important; }
.hp-ul-pay-gate {
  margin: .55rem 0 .7rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev));
}
.hp-ul-pay-gate-title { margin: 0 0 .3rem; font-weight: 750; font-size: .9rem; }
.hp-ul-pay-gate ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  color: var(--muted);
}
.hp-ul-pay-gate li { margin: .15rem 0; }
.hp-ul-pay-gate li.is-pass { color: color-mix(in srgb, #15803d 85%, var(--text)); }
.hp-ul-pay-gate li.is-fail { color: color-mix(in srgb, #dc2626 85%, var(--text)); font-weight: 650; }
.hp-ul-pay-gate-verdict {
  margin: .35rem 0 0;
  font-weight: 750;
  font-size: .88rem;
}
.hp-ul-section {
  margin: 1.1rem 0 .45rem;
  font-size: 1.05rem;
  font-weight: 750;
}
.hp-ul-section:first-child { margin-top: 0; }
.hp-ul-safe-list,
.hp-ul-rf-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .4rem;
}
.hp-ul-seed-hint {
  margin: .25rem 0 0;
  padding: .4rem .65rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg));
}
.hp-ul-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .45rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-ul-filter-bar .chip {
  font-size: .78rem;
}
.hp-ul-filter-bar .chip.active,
.hp-ul-filter-bar .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-ul-fn {
  display: inline-block;
  min-width: 1.1em;
  font-weight: 700;
  opacity: .85;
}
.hp-ul-safe-row {
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.hp-ul-safe-row.is-ok {
  border-color: color-mix(in srgb, #16a34a 35%, var(--border));
  background: color-mix(in srgb, #16a34a 7%, var(--bg-elev));
}
.hp-ul-safe-row.is-warn {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev));
}
.hp-ul-safe-row.is-bad {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 8%, var(--bg-elev));
}
.hp-ul-safe-row.is-open {
  border-style: dashed;
}
.hp-ul-safe-row.is-na {
  opacity: .72;
}
.hp-ul-safe-row.is-flash {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 45%, transparent);
}
.hp-ul-safe-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-ul-safe-label { flex: 1; min-width: 160px; }
.hp-ul-st-wrap { flex-shrink: 0; }
.hp-ul-st {
  min-width: 9.5rem;
  font-size: .85rem;
}
.hp-ul-draft {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .8rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 6.5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  padding: .55rem .65rem;
}
.hp-ul-rf-item {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  padding: .35rem .45rem;
  border-radius: 8px;
  cursor: pointer;
}
.hp-ul-rf-item:hover {
  background: color-mix(in srgb, var(--brand) 6%, transparent);
}
.hp-ul-rf-item input { margin-top: .2rem; accent-color: #dc2626; }
.hp-ul-rf-item:has(input:checked) {
  background: color-mix(in srgb, #dc2626 8%, var(--bg-elev));
  outline: 1px solid color-mix(in srgb, #dc2626 28%, var(--border));
}
.hp-ul-rf-item.is-critical:has(input:checked) {
  background: color-mix(in srgb, #dc2626 12%, var(--bg-elev));
}
.hp-ul-crit-tag {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .05rem .3rem;
  border-radius: 4px;
  background: color-mix(in srgb, #dc2626 18%, var(--bg));
  color: color-mix(in srgb, #991b1b 85%, var(--text));
  vertical-align: middle;
}
.hp-ul-live {
  text-align: center;
  padding: .35rem 0 .55rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: .65rem;
}
.hp-ul-nonadvice-fixed {
  font-size: .75rem !important;
  opacity: .85;
}
.hp-ul-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .55rem 0 .7rem;
}
.hp-ul-gauges .hp-gauge {
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev));
}
.hp-ul-gauges .hp-gauge strong { font-size: .9rem; display: block; }
.hp-ul-risk-wrap { margin: .55rem 0 .75rem; }
.hp-ul-risk-bar .hp-ul-fill.is-ok { background: #16a34a; }
.hp-ul-risk-bar .hp-ul-fill.is-mid { background: #f59e0b; }
.hp-ul-risk-bar .hp-ul-fill.is-low { background: #dc2626; }
.hp-ul-gaps {
  margin: .55rem 0 .7rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 6%, var(--bg-elev));
}
.hp-ul-gap-item {
  cursor: pointer;
  border-radius: 6px;
  padding: .1rem .15rem;
}
.hp-ul-gap-item:hover,
.hp-ul-gap-item:focus {
  background: color-mix(in srgb, var(--brand) 10%, transparent);
  outline: none;
}
.hp-ul-next-list {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-ul-next-list li { margin: .2rem 0; }
.hp-ul-readiness {
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  margin: .45rem 0 .65rem;
  background: color-mix(in srgb, var(--muted) 8%, var(--bg-elev));
}
.hp-ul-readiness.is-ok {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 10%, var(--bg-elev));
}
.hp-ul-readiness.is-check {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-ul-readiness.is-stop {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 9%, var(--bg-elev));
}
.hp-ul-readiness.is-empty {
  border-color: var(--border);
  background: color-mix(in srgb, var(--muted) 8%, var(--bg-elev));
}
.hp-ul-ready-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .98rem;
}
.hp-ul-bar-wrap { margin: .55rem 0 .75rem; }
.hp-ul-bar {
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, var(--bg));
  overflow: hidden;
}
.hp-ul-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: #38bdf8;
  transition: width .2s ease, background .2s ease;
}
.hp-ul-fill.is-ok { background: #16a34a; }
.hp-ul-fill.is-mid { background: #f59e0b; }
.hp-ul-fill.is-low { background: #dc2626; }
.hp-ul-alerts,
.hp-ul-next,
.hp-ul-commit {
  margin: .65rem 0;
}
.hp-ul-alert-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  color: var(--muted);
}
.hp-ul-alert-list li { margin: .2rem 0; }
.hp-ul-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  padding: .5rem .6rem;
}
.hp-ul-privacy {
  margin-top: 1rem;
  font-size: .88rem;
}
.hp-ul-privacy summary { cursor: pointer; font-weight: 600; }
.hp-ul-faq details { margin: .35rem 0; }
.hp-ul-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-ul-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 900px) {
  .hp-ul-layout { grid-template-columns: 1fr; }
  /* Result first on small screens, form below */
  .hp-ul-panel { position: static; order: -1; max-height: none; }
  .hp-ul-main { order: 1; }
}
@media (max-width: 560px) {
  .hp-ul-hero { grid-template-columns: 1fr; }
  .hp-ul-hero-copy { grid-column: 1; }
  .hp-ul-hero-mascot { grid-column: 1; grid-row: auto; justify-self: start; }
  .hp-ul-gauges { grid-template-columns: 1fr; }
  .hp-ul-safe-top { flex-direction: column; }
  .hp-ul-st { width: 100%; min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-ul-fill { transition: none; }
  .hp-ul-safe-row { transition: none; }
  .hp-ul-panel { scroll-behavior: auto; }
}

/* —— Leie-shortlist (rent_in-leie-shortlist · rent_shortlist) —— */
.hp-rsl { display: grid; gap: 1rem; }
.hp-rsl-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .85rem 1rem;
  align-items: start;
  padding: .85rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
}
.hp-rsl-hero-mascot {
  width: 72px; height: 72px; border-radius: 50%;
  object-fit: cover; flex-shrink: 0;
  border: 2px solid color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-rsl-hero-copy { min-width: 0; grid-column: 2; }
.hp-rsl-lead-bullets {
  margin: .25rem 0 0; padding-left: 1.15rem;
  font-size: .88rem; color: var(--muted);
}
.hp-rsl-lead-bullets li { margin: .15rem 0; }
.hp-rsl-how {
  grid-column: 1 / -1;
  margin-top: .15rem;
  border-top: 1px dashed color-mix(in srgb, var(--brand) 25%, var(--border));
  padding-top: .45rem;
}
.hp-rsl-how summary {
  cursor: pointer; font-weight: 700; font-size: .92rem;
}
.hp-rsl-how-list {
  margin: .4rem 0 0; padding-left: 1.2rem;
  font-size: .88rem; color: var(--muted);
}
.hp-rsl-how-list li { margin: .2rem 0; }
.hp-rsl-demos {
  display: flex; flex-wrap: wrap; align-items: center; gap: .45rem;
}
.hp-rsl-demo-badge {
  display: inline-block;
  font-size: .68rem; font-weight: 700; letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem; border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg-elev));
  border: 1px solid color-mix(in srgb, #f59e0b 45%, var(--border));
  color: var(--text);
}
.hp-rsl-demo-note {
  margin: 0; padding: .4rem .65rem; border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-rsl-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .95fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-rsl-layout { grid-template-columns: 1fr; }
}
.hp-rsl-section {
  font-size: 1rem; font-weight: 750; margin: 1rem 0 .45rem;
  letter-spacing: -0.02em;
}
.hp-rsl-form-col .hp-rsl-section:first-child { margin-top: 0; }
.hp-rsl-musts,
.hp-rsl-incls,
.hp-rsl-has,
.hp-rsl-flags {
  display: flex; flex-wrap: wrap; gap: .4rem .55rem;
  margin-bottom: .35rem;
}
.hp-rsl-must,
.hp-rsl-incl,
.hp-rsl-has-item,
.hp-rsl-flag {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .86rem;
  padding: .28rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  cursor: pointer;
  user-select: none;
}
.hp-rsl-must:has(input:checked),
.hp-rsl-incl:has(input:checked),
.hp-rsl-has-item:has(input:checked) {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-rsl-flag:has(input:checked) {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 10%, var(--bg-elev));
}
.hp-rsl-fit-val {
  display: inline-block;
  min-width: 1.2rem;
  font-weight: 750;
  margin-left: .35rem;
}
.hp-rsl-live {
  display: flex; flex-wrap: wrap; align-items: center; gap: .55rem .85rem;
  margin-top: .85rem;
  padding: .65rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev));
}
.hp-rsl-live-block {
  display: flex; flex-direction: column; gap: .1rem; min-width: 4.5rem;
}
.hp-rsl-live-num { font-size: 1rem; font-weight: 750; letter-spacing: -0.02em; }
.hp-rsl-band {
  margin-left: auto;
  font-size: .82rem; font-weight: 700;
  padding: .25rem .55rem; border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-rsl-band.is-ok {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 12%, var(--bg-elev));
}
.hp-rsl-band.is-mid {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 12%, var(--bg-elev));
}
.hp-rsl-band.is-tight {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 12%, var(--bg-elev));
}
.hp-rsl-panel {
  position: sticky;
  top: .75rem;
  padding: .85rem .9rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  max-height: min(92vh, 1200px);
  overflow: auto;
  scroll-behavior: smooth;
}
.hp-rsl-panel-head {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .45rem;
  margin-bottom: .45rem;
}
.hp-rsl-sort,
.hp-rsl-filters {
  display: flex; flex-wrap: wrap; gap: .3rem;
  margin-bottom: .45rem;
}
.hp-rsl-list {
  display: grid; gap: .65rem;
}
.hp-rsl-card {
  padding: .65rem .7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
}
.hp-rsl-card.is-over {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
}
.hp-rsl-card.is-flag {
  border-color: color-mix(in srgb, #dc2626 35%, var(--border));
}
.hp-rsl-card.is-drop {
  opacity: .72;
  background: color-mix(in srgb, var(--muted) 8%, var(--bg-elev));
}
.hp-rsl-card.is-ready {
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, #16a34a 12%, transparent);
}
.hp-rsl-card-top {
  display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .55rem;
  margin-bottom: .35rem;
}
.hp-rsl-klarhet {
  display: inline-block;
  font-size: .78rem; font-weight: 750;
  padding: .22rem .55rem; border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  max-width: 100%;
  line-height: 1.25;
}
.hp-rsl-klarhet.is-klar {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 12%, var(--bg-elev));
}
.hp-rsl-klarhet.is-sjekk {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 12%, var(--bg-elev));
}
.hp-rsl-klarhet.is-mangler {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 10%, var(--bg-elev));
}
.hp-rsl-dep-quick {
  display: flex; flex-wrap: wrap; gap: .25rem;
  margin-top: .25rem;
}
.hp-rsl-matrix-winners {
  margin: 0 0 .45rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev));
  font-size: .82rem;
  line-height: 1.35;
}
.hp-rsl-cmp {
  display: inline-flex; align-items: center; gap: .25rem;
  font-size: .78rem; cursor: pointer;
}
.hp-rsl-card-name {
  flex: 1 1 auto;
  min-width: 0;
  font-size: .95rem;
}
.hp-rsl-fict-badge {
  display: inline-block;
  font-size: .65rem; font-weight: 700;
  text-transform: uppercase;
  padding: .05rem .35rem; border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 20%, var(--bg-elev));
  border: 1px solid color-mix(in srgb, #f59e0b 40%, var(--border));
  vertical-align: middle;
}
.hp-rsl-st {
  font-size: .8rem;
  max-width: 9.5rem;
}
.hp-rsl-card-meta {
  display: flex; flex-wrap: wrap; gap: .25rem .55rem;
  font-size: .8rem; color: var(--muted);
  margin-bottom: .3rem;
}
.hp-rsl-card-nums {
  display: flex; flex-wrap: wrap; gap: .35rem .75rem;
  font-size: .88rem; font-weight: 650;
  margin-bottom: .35rem;
}
.hp-rsl-card-nums em {
  font-style: normal; font-weight: 500;
  color: var(--muted); font-size: .75rem;
  display: block;
}
.hp-rsl-card-tags {
  display: flex; flex-wrap: wrap; gap: .3rem;
  margin-bottom: .3rem;
}
.hp-rsl-tag {
  font-size: .72rem; font-weight: 650;
  padding: .12rem .4rem; border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-rsl-tag.is-ok {
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
  background: color-mix(in srgb, #16a34a 10%, var(--bg-elev));
}
.hp-rsl-tag.is-mid {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
}
.hp-rsl-tag.is-bad,
.hp-rsl-tag.is-flag {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 10%, var(--bg-elev));
}
.hp-rsl-tag.is-soft {
  font-weight: 500; color: var(--muted);
}
.hp-rsl-card-note { margin: .15rem 0 .3rem; }
.hp-rsl-card-actions {
  display: flex; flex-wrap: wrap; gap: .3rem;
}
.hp-rsl-matrix-scroll {
  overflow-x: auto;
  margin-bottom: .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}
.hp-rsl-matrix {
  width: 100%;
  border-collapse: collapse;
  font-size: .8rem;
  min-width: 320px;
}
.hp-rsl-matrix th,
.hp-rsl-matrix td {
  padding: .35rem .5rem;
  border-bottom: 1px solid var(--border);
  text-align: left;
  vertical-align: top;
}
.hp-rsl-matrix thead th {
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
  font-weight: 700;
  white-space: nowrap;
}
.hp-rsl-matrix tbody th {
  font-weight: 650;
  color: var(--muted);
  white-space: nowrap;
  width: 6.5rem;
}
.hp-rsl-matrix td.is-best {
  background: color-mix(in srgb, #16a34a 12%, var(--bg-elev));
  font-weight: 700;
}
.hp-rsl-matrix td.is-bad {
  background: color-mix(in srgb, #dc2626 10%, var(--bg-elev));
  font-weight: 650;
}
.hp-rsl-rank-ol {
  margin: 0; padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-rsl-rank-ol li { margin: .2rem 0; }
.hp-rsl-commit-text {
  width: 100%;
  font-size: .8rem;
  line-height: 1.4;
  font-family: inherit;
  resize: vertical;
  min-height: 7rem;
}
.hp-rsl-nonadvice {
  margin-top: .65rem;
  font-size: .8rem;
}
.hp-rsl-faq details { margin: .35rem 0; }
.hp-rsl-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rsl-faq details p { margin: .35rem 0 .15rem; }

/* Pipeline strip */
.hp-rsl-pipe {
  display: flex; flex-wrap: wrap; gap: .35rem .55rem;
  margin: 0 0 .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev));
  font-size: .78rem;
  color: var(--muted);
}
.hp-rsl-pipe-item {
  cursor: pointer;
  padding: .15rem .4rem;
  border-radius: 999px;
  border: 1px solid transparent;
  user-select: none;
}
.hp-rsl-pipe-item:hover,
.hp-rsl-pipe-item:focus-visible {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
  outline: none;
}
.hp-rsl-pipe-item strong {
  color: var(--text);
  font-weight: 750;
  margin-right: .15rem;
}
.hp-rsl-fc {
  font-weight: 600;
  opacity: .75;
  font-size: .72rem;
  margin-left: .1rem;
}
.hp-rsl-next {
  margin: 0 0 .55rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev));
}
.hp-rsl-next-ul {
  margin: 0; padding-left: 1.15rem;
  font-size: .84rem; color: var(--muted);
}
.hp-rsl-next-ul li { margin: .18rem 0; }
.hp-rsl-smart {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 2rem;
  font-size: .78rem; font-weight: 750;
  padding: .12rem .4rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  color: var(--text);
  flex-shrink: 0;
}
.hp-rsl-matrix-head {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .35rem;
}
.hp-rsl-matrix-head .hp-rsl-section { margin-top: 1rem; }
@media (max-width: 900px) {
  .hp-rsl-panel {
    position: static;
    max-height: none;
  }
  .hp-rsl-hero { grid-template-columns: auto 1fr; }
}
/* Paste annonsetekst */
.hp-rsl-paste {
  margin: 0 0 .75rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 4%, var(--bg-elev));
}
.hp-rsl-paste summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .9rem;
}
.hp-rsl-paste textarea {
  width: 100%;
  font-size: .86rem;
  line-height: 1.4;
  font-family: inherit;
  resize: vertical;
  min-height: 5rem;
  margin-top: .15rem;
}
.hp-rsl-formula {
  font-size: .78rem;
  line-height: 1.35;
}
.hp-rsl-matrise-n {
  font-weight: 650;
  padding: .12rem .4rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-rsl-pin {
  border: 1px solid var(--border);
  background: var(--bg-elev);
  border-radius: 999px;
  width: 1.75rem;
  height: 1.75rem;
  line-height: 1;
  font-size: 1rem;
  cursor: pointer;
  color: var(--muted);
  padding: 0;
  flex-shrink: 0;
}
.hp-rsl-pin:hover,
.hp-rsl-pin:focus-visible {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  outline: none;
}
.hp-rsl-pin.is-on {
  color: #b45309;
  border-color: color-mix(in srgb, #f59e0b 55%, var(--border));
  background: color-mix(in srgb, #f59e0b 16%, var(--bg-elev));
}
.hp-rsl-pin-badge {
  display: inline-block;
  font-size: .65rem;
  font-weight: 700;
  text-transform: uppercase;
  padding: .05rem .35rem;
  border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 20%, var(--bg-elev));
  border: 1px solid color-mix(in srgb, #f59e0b 45%, var(--border));
  vertical-align: middle;
}
.hp-rsl-card.is-pinned {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, #f59e0b 14%, transparent);
}
.hp-rsl-bulk {
  margin-bottom: .45rem;
}

@media (max-width: 560px) {
  .hp-rsl-hero { grid-template-columns: 1fr; }
  .hp-rsl-hero-copy { grid-column: 1; }
  .hp-rsl-hero-mascot {
    grid-column: 1;
    width: 64px; height: 64px;
  }
  .hp-rsl-band { margin-left: 0; }
  .hp-rsl-card-top { flex-direction: column; align-items: flex-start; }
  .hp-rsl-st { max-width: 100%; width: 100%; }
  .hp-rsl-live-block { min-width: 4rem; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-rsl-panel { scroll-behavior: auto; }
}

/* —— Midlertidig bolig / bro-plan (rent_in-midlertidig-bolig · rent_bridge) —— */
.hp-rbd { margin: 0; }
.hp-rbd-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-rbd-hero-copy { min-width: 0; grid-column: 1; }
.hp-rbd-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  width: 72px; height: 72px;
  object-fit: contain;
  border-radius: 50%;
  justify-self: end;
}
.hp-rbd-how { grid-column: 1 / -1; }
.hp-rbd-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-rbd-lead-bullets li { margin: .2rem 0; }
.hp-rbd-how {
  margin-top: .35rem;
  padding: .55rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-rbd-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-rbd-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-rbd-how-list li { margin: .2rem 0; }
.hp-rbd-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #f59e0b) 22%, transparent);
  color: color-mix(in srgb, var(--accent, #b45309) 80%, var(--text));
  vertical-align: middle;
}
.hp-rbd-demo-note {
  margin: .35rem 0 .65rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--accent, #f59e0b) 45%, var(--border));
  background: color-mix(in srgb, var(--accent, #f59e0b) 8%, var(--bg));
}
.hp-rbd-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
  margin: 0 0 .75rem;
}
.hp-rbd-demos .chip { font-size: .8rem; }
.hp-rbd-demos .chip.active,
.hp-rbd-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg));
}
.hp-rbd-layout {
  display: grid;
  grid-template-columns: 1fr minmax(280px, 360px);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
.hp-rbd-section {
  font-size: 1.05rem;
  margin: 1rem 0 .45rem;
}
.hp-rbd-section:first-child { margin-top: 0; }
.hp-rbd-formula {
  margin: .55rem 0 .75rem;
  padding: .5rem .7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev, #fff));
  line-height: 1.45;
}
.hp-rbd-alts {
  display: flex;
  flex-direction: column;
  gap: .55rem;
}
.hp-rbd-alt-card {
  padding: .65rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.hp-rbd-alt-card.is-on {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand) 18%, transparent);
}
.hp-rbd-alt-card.is-pref {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-rbd-alt-card.is-tight {
  border-color: color-mix(in srgb, var(--accent, #f59e0b) 50%, var(--border));
}
.hp-rbd-alt-head {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .65rem;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: .45rem;
}
.hp-rbd-alt-check {
  display: flex;
  gap: .4rem;
  align-items: center;
  font-weight: 700;
  font-size: .92rem;
  cursor: pointer;
}
.hp-rbd-alt-cost {
  margin: .35rem 0 0;
  font-weight: 650;
}
.hp-rbd-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-rbd-tab .hp-rbd-tab-pct {
  margin-left: .3rem;
  font-size: .72rem;
  opacity: .85;
  font-weight: 700;
}
.hp-rbd-tab.is-on {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg));
}
.hp-rbd-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .45rem;
}
.hp-rbd-filter.is-on {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 10%, var(--bg));
}
.hp-rbd-phase-help { margin: 0 0 .45rem; }
.hp-rbd-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .45rem;
}
.hp-rbd-row {
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-rbd-row.is-critical {
  border-color: color-mix(in srgb, var(--accent, #f59e0b) 35%, var(--border));
}
.hp-rbd-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-rbd-row-label {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem .4rem;
  align-items: center;
  flex: 1;
  min-width: 0;
  font-size: .9rem;
  font-weight: 600;
  line-height: 1.35;
}
.hp-rbd-crit-badge {
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #f59e0b) 22%, transparent);
  color: color-mix(in srgb, var(--accent, #b45309) 85%, var(--text));
}
.hp-rbd-st {
  min-width: 8.5rem;
  font-size: .85rem;
}
.hp-rbd-due { margin: .25rem 0 .2rem; }
.hp-rbd-note-inp {
  width: 100%;
  font-size: .85rem;
  margin-top: .15rem;
}
.hp-rbd-panel {
  position: sticky;
  top: .75rem;
  padding: .85rem .9rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev, #fff));
  max-height: calc(100vh - 2rem);
  overflow: auto;
}
.hp-rbd-live {
  text-align: center;
  padding: .55rem .4rem .65rem;
  border-radius: 12px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg));
  margin-bottom: .65rem;
}
.hp-rbd-live.is-soon {
  background: color-mix(in srgb, var(--accent, #f59e0b) 16%, var(--bg));
}
.hp-rbd-live.is-today {
  background: color-mix(in srgb, #22c55e 18%, var(--bg));
}
.hp-rbd-live.is-past {
  background: color-mix(in srgb, #94a3b8 18%, var(--bg));
}
.hp-rbd-live.is-ok {
  background: color-mix(in srgb, #38bdf8 14%, var(--bg));
}
.hp-rbd-nonadvice-fixed {
  margin: .35rem 0 0;
  font-size: .75rem;
}
.hp-rbd-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
  margin-bottom: .65rem;
}
.hp-rbd-gauges .hp-gauge {
  padding: .4rem .45rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.hp-rbd-gauges .hp-gauge strong {
  font-size: .95rem;
  word-break: break-word;
}
.hp-rbd-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .84rem;
}
.hp-rbd-table th {
  text-align: left;
  font-weight: 600;
  padding: .22rem .3rem .22rem 0;
  vertical-align: top;
  color: var(--muted, #64748b);
}
.hp-rbd-table td {
  text-align: right;
  padding: .22rem 0;
  font-weight: 650;
}
.hp-rbd-dates-box,
.hp-rbd-compare,
.hp-rbd-cost-box,
.hp-rbd-warn,
.hp-rbd-next,
.hp-rbd-commit {
  margin-top: .7rem;
  padding-top: .55rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-rbd-warn-list,
.hp-rbd-next-list,
.hp-rbd-compare-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
  line-height: 1.4;
}
.hp-rbd-warn-list li,
.hp-rbd-next-list li,
.hp-rbd-compare-list li { margin: .2rem 0; }
.hp-rbd-commit-text {
  width: 100%;
  font-size: .8rem;
  line-height: 1.4;
  font-family: inherit;
  resize: vertical;
  min-height: 6rem;
}
.hp-rbd-privacy {
  margin-top: .85rem;
  font-size: .86rem;
}
.hp-rbd-privacy summary { cursor: pointer; font-weight: 650; }
.hp-rbd-faq details { margin: .35rem 0; }
.hp-rbd-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rbd-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 900px) {
  .hp-rbd-layout { grid-template-columns: 1fr; }
  .hp-rbd-panel {
    position: static;
    max-height: none;
  }
  .hp-rbd-hero { grid-template-columns: 1fr auto; }
}
@media (max-width: 560px) {
  .hp-rbd-hero { grid-template-columns: 1fr; }
  .hp-rbd-hero-copy { grid-column: 1; }
  .hp-rbd-hero-mascot {
    grid-column: 1;
    grid-row: auto;
    justify-self: start;
    width: 64px;
    height: 64px;
  }
  .hp-rbd-gauges { grid-template-columns: 1fr; }
  .hp-rbd-row-top { flex-direction: column; }
  .hp-rbd-st { width: 100%; min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-rbd-panel { scroll-behavior: auto; }
  .hp-rbd-alt-card { transition: none; }
}

/* —— Leie-tidslinje (rent_timeline / rent_in-leie-tidslinje) —— */
.hp-rtl { display: grid; gap: 1rem; }
.hp-rtl-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
}
.hp-rtl-hero-mascot {
  border-radius: 14px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
.hp-rtl-hero-copy { min-width: 0; grid-column: 2; }
.hp-rtl-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-rtl-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .75rem;
  background: var(--bg-elev);
}
.hp-rtl-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rtl-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-rtl-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
}
.hp-rtl-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #e0e7ff;
  color: #3730a3;
  vertical-align: middle;
}
.hp-rtl-demo-note {
  margin: .15rem 0 0;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
}
.hp-rtl-layout {
  display: grid;
  grid-template-columns: 1fr minmax(240px, 320px);
  gap: 1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-rtl-layout { grid-template-columns: 1fr; }
  .hp-rtl-panel { position: static; }
}
.hp-rtl-section {
  font-size: 1.02rem;
  margin: 1rem 0 .55rem;
  font-weight: 700;
}
.hp-rtl-section:first-child { margin-top: 0; }
.hp-rtl-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: .35rem 0 .75rem;
}
.hp-rtl-tab {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}
.hp-rtl-tab.is-on,
.hp-rtl-tab[aria-selected="true"] {
  background: color-mix(in srgb, var(--brand) 18%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  font-weight: 700;
}
.hp-rtl-tab-pct {
  font-size: .72rem;
  font-variant-numeric: tabular-nums;
  opacity: .8;
  font-weight: 700;
}
.hp-rtl-phase-head {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1rem;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: .55rem;
}
.hp-rtl-phase-help { margin: 0; flex: 1 1 12rem; }
.hp-rtl-phase-date-lab {
  display: grid;
  gap: .2rem;
  font-size: .86rem;
}
.hp-rtl-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-rtl-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: var(--card, #fff);
  transition: border-color .15s, background .15s;
}
.hp-rtl-row.is-critical { border-left: 3px solid #d97706; }
.hp-rtl-row.is-gap {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-rtl-row.is-ok {
  border-color: #86efac;
  background: #f7fdf9;
}
.hp-rtl-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
}
.hp-rtl-on {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  flex: 1 1 12rem;
  min-width: 0;
  cursor: pointer;
}
.hp-rtl-on input { margin-top: .2rem; flex: 0 0 auto; }
.hp-rtl-label {
  font-size: .92rem;
  font-weight: 600;
  line-height: 1.35;
  min-width: 0;
}
.hp-rtl-crit-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #ffedd5;
  color: #9a3412;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-rtl-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
  min-height: 36px;
}
.hp-rtl-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .95rem;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-rtl-quick-dates {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .45rem;
  align-items: center;
  margin: .15rem 0 .55rem;
}
.hp-rtl-filter {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .45rem;
  align-items: center;
  margin: .15rem 0 .55rem;
}
.hp-rtl-filter .chip.is-on,
.hp-rtl-filter [aria-pressed="true"] {
  background: color-mix(in srgb, var(--brand) 18%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  font-weight: 700;
}
.hp-rtl-filter-n {
  font-size: .72rem;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  opacity: .85;
  margin-left: .15rem;
}
.hp-rtl-gapbox {
  border: 1px solid #c7d2fe;
  background: #eef2ff;
  border-radius: 12px;
  padding: .55rem .75rem;
  margin: 0 0 .85rem;
}
.hp-rtl-gap-line {
  margin: 0;
  font-weight: 650;
  font-size: .9rem;
  line-height: 1.4;
}
.hp-rtl-row.is-flash {
  outline: 2px solid color-mix(in srgb, var(--brand) 70%, #6366f1);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand) 20%, transparent);
}
.hp-rtl-gauges {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .55rem;
  margin-bottom: .75rem;
}
.hp-rtl-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  background: var(--card, #fff);
  display: grid;
  gap: .15rem;
}
.hp-rtl-gauge-gaps strong { color: #b45309; }
.hp-rtl-gauge strong {
  font-size: 1.25rem;
  font-variant-numeric: tabular-nums;
}
.hp-rtl-rail {
  margin: 0 0 .85rem;
}
.hp-rtl-rail-cap { margin: 0 0 .4rem; }
.hp-rtl-rail-track {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
}
.hp-rtl-rail-node {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  gap: 0 .35rem;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .35rem .5rem;
  background: var(--card, #fff);
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
  min-width: 6.5rem;
  flex: 1 1 6.5rem;
  max-width: 9rem;
}
.hp-rtl-rail-node:hover {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
}
.hp-rtl-rail-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #94a3b8;
  grid-row: 1 / span 2;
}
.hp-rtl-rail-node.is-done .hp-rtl-rail-dot { background: #16a34a; }
.hp-rtl-rail-node.is-gap .hp-rtl-rail-dot { background: #ea580c; }
.hp-rtl-rail-node.is-part .hp-rtl-rail-dot { background: #2563eb; }
.hp-rtl-rail-lab {
  font-size: .72rem;
  font-weight: 700;
  line-height: 1.2;
  grid-column: 2;
}
.hp-rtl-rail-dt {
  font-size: .68rem;
  opacity: .8;
  font-variant-numeric: tabular-nums;
  grid-column: 2;
}
.hp-rtl-rail-pct {
  display: none;
}
.hp-rtl-bars { display: grid; gap: .4rem; margin-bottom: .85rem; }
.hp-rtl-bar-row {
  display: grid;
  grid-template-columns: 8.5rem 1fr;
  gap: .45rem;
  align-items: center;
}
.hp-rtl-bar-lab {
  border: 0;
  background: none;
  padding: 0;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hp-rtl-bar-lab:hover { color: var(--brand); }
.hp-rtl-bar {
  height: 8px;
  border-radius: 99px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-rtl-bar-fill {
  display: block;
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--brand), color-mix(in srgb, var(--brand) 55%, #3aa6a0));
  border-radius: 99px;
  transition: width .2s ease;
}
.hp-rtl-next {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
  background: color-mix(in srgb, var(--brand) 6%, var(--card, #fff));
}
.hp-rtl-next-btn {
  display: block;
  width: 100%;
  border: 0;
  background: none;
  padding: 0;
  margin: 0;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.hp-rtl-next-btn:hover .hp-rtl-next-title {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hp-rtl-next-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-rtl-sched-btn {
  border: 0;
  background: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: left;
}
.hp-rtl-sched-btn:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hp-rtl-warn {
  border: 1px solid #fca5a5;
  background: #fff7f7;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-rtl-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-rtl-schedule { margin-bottom: .75rem; }
.hp-rtl-schedule-ol {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  line-height: 1.45;
}
.hp-rtl-commit-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  min-height: 10rem;
}
.hp-rtl-nonadvice {
  margin-top: .65rem;
  font-size: .78rem !important;
}
.hp-rtl-faq details {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .7rem;
  margin: .4rem 0;
  background: var(--bg-elev);
}
.hp-rtl-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rtl-faq details p { margin: .35rem 0 .15rem; }
.hp-rtl-links { margin: .85rem 0; }
.hp-rtl-link-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .5rem;
}
.hp-rtl-link-grid a {
  font-size: .8rem;
  font-weight: 650;
  padding: .25rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  text-decoration: none;
  color: inherit;
}
.hp-rtl-link-grid a:hover {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
@media (max-width: 560px) {
  .hp-rtl-hero {
    grid-template-columns: 1fr;
  }
  .hp-rtl-hero-mascot { width: 56px; height: 56px; }
  .hp-rtl-hero-copy { grid-column: 1; }
  .hp-rtl-gauges { grid-template-columns: 1fr; }
  .hp-rtl-bar-row { grid-template-columns: 1fr; gap: .2rem; }
  .hp-rtl-rail-node { max-width: none; flex: 1 1 45%; }
}
@media (min-width: 901px) {
  .hp-rtl-hero {
    grid-template-columns: 72px 1fr;
  }
  .hp-rtl-gauges { grid-template-columns: repeat(2, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .hp-rtl-bar-fill { transition: none; }
  .hp-rtl-row { transition: none; }
  .hp-rtl-row.is-flash { transition: none; }
}

/* —— Utleie-tidslinje (ll_timeline / rent_out-utleie-tidslinje) —— */
.hp-llt { display: grid; gap: 1rem; }
.hp-llt-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
}
.hp-llt-hero-mascot {
  border-radius: 14px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
.hp-llt-hero-copy { min-width: 0; grid-column: 2; }
.hp-llt-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-llt-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .75rem;
  background: var(--bg-elev);
}
.hp-llt-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-llt-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-llt-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
}
.hp-llt-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #e0e7ff;
  color: #3730a3;
  vertical-align: middle;
}
.hp-llt-demo-note {
  margin: .15rem 0 0;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
}
.hp-llt-layout {
  display: grid;
  grid-template-columns: 1fr minmax(240px, 320px);
  gap: 1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-llt-layout { grid-template-columns: 1fr; }
  .hp-llt-panel { position: static; }
}
.hp-llt-section {
  font-size: 1.02rem;
  margin: 1rem 0 .55rem;
  font-weight: 700;
}
.hp-llt-section:first-child { margin-top: 0; }
.hp-llt-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: .35rem 0 .75rem;
}
.hp-llt-tab {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}
.hp-llt-tab.is-on,
.hp-llt-tab[aria-selected="true"] {
  background: color-mix(in srgb, var(--brand) 18%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  font-weight: 700;
}
.hp-llt-tab-pct {
  font-size: .72rem;
  font-variant-numeric: tabular-nums;
  opacity: .8;
  font-weight: 700;
}
.hp-llt-phase-head {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1rem;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: .55rem;
}
.hp-llt-phase-help { margin: 0; flex: 1 1 12rem; }
.hp-llt-phase-date-lab {
  display: grid;
  gap: .2rem;
  font-size: .86rem;
}
.hp-llt-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-llt-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: var(--card, #fff);
  transition: border-color .15s, background .15s;
}
.hp-llt-row.is-critical { border-left: 3px solid #d97706; }
.hp-llt-row.is-gap {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-llt-row.is-ok {
  border-color: #86efac;
  background: #f7fdf9;
}
.hp-llt-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
}
.hp-llt-on {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  flex: 1 1 12rem;
  min-width: 0;
  cursor: pointer;
}
.hp-llt-on input { margin-top: .2rem; flex: 0 0 auto; }
.hp-llt-label {
  font-size: .92rem;
  font-weight: 600;
  line-height: 1.35;
  min-width: 0;
}
.hp-llt-crit-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #ffedd5;
  color: #9a3412;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-llt-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
  min-height: 36px;
}
.hp-llt-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .95rem;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-llt-quick-dates {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .45rem;
  align-items: center;
  margin: .15rem 0 .55rem;
}
.hp-llt-filter {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .45rem;
  align-items: center;
  margin: .15rem 0 .55rem;
}
.hp-llt-filter .chip.is-on,
.hp-llt-filter [aria-pressed="true"] {
  background: color-mix(in srgb, var(--brand) 18%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  font-weight: 700;
}
.hp-llt-filter-n {
  font-size: .72rem;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  opacity: .85;
  margin-left: .15rem;
}
.hp-llt-gapbox {
  border: 1px solid #c7d2fe;
  background: #eef2ff;
  border-radius: 12px;
  padding: .55rem .75rem;
  margin: 0 0 .85rem;
}
.hp-llt-gap-line {
  margin: 0;
  font-weight: 650;
  font-size: .9rem;
  line-height: 1.4;
}
.hp-llt-row.is-flash {
  outline: 2px solid color-mix(in srgb, var(--brand) 70%, #6366f1);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand) 20%, transparent);
}
.hp-llt-gauges {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .55rem;
  margin-bottom: .75rem;
}
.hp-llt-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  background: var(--card, #fff);
  display: grid;
  gap: .15rem;
}
.hp-llt-gauge-gaps strong { color: #b45309; }
.hp-llt-gauge strong {
  font-size: 1.25rem;
  font-variant-numeric: tabular-nums;
}
.hp-llt-rail {
  margin: 0 0 .85rem;
}
.hp-llt-rail-cap { margin: 0 0 .4rem; }
.hp-llt-rail-track {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
}
.hp-llt-rail-node {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  gap: 0 .35rem;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .35rem .5rem;
  background: var(--card, #fff);
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
  min-width: 6.5rem;
  flex: 1 1 6.5rem;
  max-width: 9rem;
}
.hp-llt-rail-node:hover {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
}
.hp-llt-rail-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #94a3b8;
  grid-row: 1 / span 2;
}
.hp-llt-rail-node.is-done .hp-llt-rail-dot { background: #16a34a; }
.hp-llt-rail-node.is-gap .hp-llt-rail-dot { background: #ea580c; }
.hp-llt-rail-node.is-part .hp-llt-rail-dot { background: #2563eb; }
.hp-llt-rail-lab {
  font-size: .72rem;
  font-weight: 700;
  line-height: 1.2;
  grid-column: 2;
}
.hp-llt-rail-dt {
  font-size: .68rem;
  opacity: .8;
  font-variant-numeric: tabular-nums;
  grid-column: 2;
}
.hp-llt-rail-pct { display: none; }
.hp-llt-bars { display: grid; gap: .4rem; margin-bottom: .85rem; }
.hp-llt-bar-row {
  display: grid;
  grid-template-columns: 8.5rem 1fr;
  gap: .45rem;
  align-items: center;
}
.hp-llt-bar-lab {
  border: 0;
  background: none;
  padding: 0;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hp-llt-bar-lab:hover { color: var(--brand); }
.hp-llt-bar {
  height: 8px;
  border-radius: 99px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-llt-bar-fill {
  display: block;
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--brand), color-mix(in srgb, var(--brand) 55%, #3aa6a0));
  border-radius: 99px;
  transition: width .2s ease;
}
.hp-llt-next {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
  background: color-mix(in srgb, var(--brand) 6%, var(--card, #fff));
}
.hp-llt-next-btn {
  display: block;
  width: 100%;
  border: 0;
  background: none;
  padding: 0;
  margin: 0;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.hp-llt-next-btn:hover .hp-llt-next-title {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hp-llt-next-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-llt-sched-btn {
  border: 0;
  background: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: left;
}
.hp-llt-sched-btn:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hp-llt-warn {
  border: 1px solid #fca5a5;
  background: #fff7f7;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-llt-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-llt-schedule { margin-bottom: .75rem; }
.hp-llt-schedule-ol {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  line-height: 1.45;
}
.hp-llt-commit-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  min-height: 10rem;
}
.hp-llt-nonadvice {
  margin-top: .65rem;
  font-size: .78rem !important;
}
.hp-llt-faq details {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .7rem;
  margin: .4rem 0;
  background: var(--bg-elev);
}
.hp-llt-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-llt-faq details p { margin: .35rem 0 .15rem; }
.hp-llt-links { margin: .85rem 0; }
.hp-llt-link-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .5rem;
}
.hp-llt-link-grid a {
  font-size: .8rem;
  font-weight: 650;
  padding: .25rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  text-decoration: none;
  color: inherit;
}
.hp-llt-link-grid a:hover {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
.hp-llt-seed-note {
  margin: .15rem 0 .55rem;
  padding: .4rem .65rem;
  border-radius: 8px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  font-size: .86rem;
  line-height: 1.4;
}
.hp-llt-temp {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
  display: grid;
  gap: .15rem;
  background: var(--card, #fff);
}
.hp-llt-temp strong {
  font-size: 1.2rem;
  font-weight: 800;
  letter-spacing: .01em;
}
.hp-llt-temp.is-klar {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-llt-temp.is-klar strong { color: #15803d; }
.hp-llt-temp.is-sjekk {
  border-color: #fcd34d;
  background: #fffbeb;
}
.hp-llt-temp.is-sjekk strong { color: #b45309; }
.hp-llt-temp.is-mangler {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-llt-temp.is-mangler strong { color: #b91c1c; }
.hp-llt-formula {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .65rem;
  margin: 0 0 .75rem;
  background: var(--bg-elev);
}
.hp-llt-formula summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .88rem;
}
.hp-llt-gaps-list {
  border: 1px solid #fed7aa;
  background: #fff7ed;
  border-radius: 12px;
  padding: .5rem .7rem;
  margin: 0 0 .75rem;
}
.hp-llt-gaps-ul {
  margin: 0;
  padding-left: 0;
  list-style: none;
  display: grid;
  gap: .25rem;
}
.hp-llt-gap-btn {
  border: 0;
  background: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: left;
  font-size: .84rem;
  font-weight: 600;
  line-height: 1.35;
}
.hp-llt-gap-btn:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
  color: var(--brand);
}
.hp-llt-seeds {
  margin: .75rem 0;
  padding: .55rem .7rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--brand) 5%, var(--card, #fff));
}
.hp-llt-gauges {
  grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 1100px) {
  .hp-llt-gauges { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .hp-llt-hero {
    grid-template-columns: 1fr;
  }
  .hp-llt-hero-mascot { width: 56px; height: 56px; }
  .hp-llt-hero-copy { grid-column: 1; }
  .hp-llt-gauges { grid-template-columns: 1fr; }
  .hp-llt-bar-row { grid-template-columns: 1fr; gap: .2rem; }
  .hp-llt-rail-node { max-width: none; flex: 1 1 45%; }
}
@media (min-width: 901px) {
  .hp-llt-hero {
    grid-template-columns: 72px 1fr;
  }
  .hp-llt-gauges { grid-template-columns: repeat(2, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .hp-llt-bar-fill { transition: none; }
  .hp-llt-row { transition: none; }
  .hp-llt-row.is-flash { transition: none; }
}
.hp-llt-horizon {
  border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev));
  border-radius: 12px;
  padding: .55rem .75rem;
  margin: 0 0 .85rem;
}
.hp-llt-horizon-track {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .5rem;
}
.hp-llt-horizon-node {
  display: grid;
  gap: .1rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .35rem .55rem;
  background: var(--card, #fff);
  min-width: 7rem;
}
.hp-llt-horizon-node.is-vacant { border-left: 3px solid #ea580c; }
.hp-llt-horizon-node.is-list { border-left: 3px solid #2563eb; }
.hp-llt-horizon-node.is-keys { border-left: 3px solid #16a34a; }
.hp-llt-horizon-lab {
  font-size: .72rem;
  font-weight: 700;
  line-height: 1.2;
}
.hp-llt-horizon-dt {
  font-size: .78rem;
  font-variant-numeric: tabular-nums;
  opacity: .9;
}
.hp-llt-horizon-span {
  font-size: .72rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  opacity: .75;
  white-space: nowrap;
}
.hp-llt-phase-weeks {
  font-size: .75rem !important;
  font-variant-numeric: tabular-nums;
}
.hp-llt-phase-tools {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem .4rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-llt-phase-tool {
  font-size: .76rem;
  font-weight: 650;
  padding: .18rem .45rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  text-decoration: none;
  color: inherit;
}
.hp-llt-phase-tool:hover {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
.hp-llt-pace-hint {
  line-height: 1.4;
}

/* —— Depositum-retur (rent_in-depositum-retur · dep_return) —— */
.hp-dr { display: grid; gap: 1rem; }
.hp-dr-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .85rem 1rem;
  align-items: start;
  padding: .85rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
}
.hp-dr-hero-mascot {
  width: 72px; height: 72px; border-radius: 50%;
  object-fit: cover; flex-shrink: 0;
  border: 2px solid color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-dr-hero-copy { min-width: 0; grid-column: 2; }
.hp-dr-lead-bullets {
  margin: .25rem 0 0; padding-left: 1.15rem;
  font-size: .88rem; color: var(--muted);
}
.hp-dr-lead-bullets li { margin: .15rem 0; }
.hp-dr-how {
  grid-column: 1 / -1;
  margin-top: .15rem;
  border-top: 1px dashed color-mix(in srgb, var(--brand) 25%, var(--border));
  padding-top: .45rem;
}
.hp-dr-how summary { cursor: pointer; font-weight: 700; font-size: .92rem; }
.hp-dr-how-list { margin: .35rem 0 0; padding-left: 1.2rem; font-size: .88rem; color: var(--muted); }
.hp-dr-how-list li { margin: .2rem 0; }
.hp-dr-seed-hint {
  margin: 0;
  padding: .45rem .7rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
}
.hp-dr-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg));
  color: color-mix(in srgb, #b45309 80%, var(--text));
}
.hp-dr-demo-note {
  margin: .25rem 0 0;
  padding: .4rem .65rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg));
}
.hp-dr-demos {
  display: flex; flex-wrap: wrap; gap: .4rem; align-items: center;
}
.hp-dr-demos .chip { font-size: .8rem; }
.hp-dr-demos .chip.active,
.hp-dr-demos .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-dr-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-dr-date-chips,
.hp-dr-follow-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .15rem 0 .35rem;
}
.hp-dr-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
.hp-dr-main { order: 1; min-width: 0; }
.hp-dr-panel {
  order: 0;
  position: sticky;
  top: .75rem;
  max-height: calc(100vh - 1.5rem);
  overflow: auto;
  padding: .9rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 60%, transparent);
}
.hp-dr-section {
  margin: 1.1rem 0 .45rem;
  font-size: 1.05rem;
  font-weight: 750;
}
.hp-dr-section:first-child { margin-top: 0; }
.hp-dr-phase { margin: .85rem 0 1rem; }
.hp-dr-phase-title {
  margin: 0 0 .2rem;
  font-size: .95rem;
  font-weight: 700;
}
.hp-dr-phase-count { font-weight: 500; }
.hp-dr-filter {
  display: flex; flex-wrap: wrap; gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-dr-filter .chip.is-on,
.hp-dr-filter .chip.active,
.hp-dr-filter .chip[aria-pressed="true"] {
  outline: 2px solid color-mix(in srgb, var(--brand) 50%, transparent);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-dr-fc {
  font-weight: 600;
  opacity: .85;
  font-variant-numeric: tabular-nums;
}
.hp-dr-check-list,
.hp-dr-claim-list,
.hp-dr-alert-list,
.hp-dr-open-list,
.hp-dr-next-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .4rem;
}
.hp-dr-next-list {
  list-style: decimal;
  padding-left: 1.2rem;
  gap: .3rem;
}
.hp-dr-alert-list {
  list-style: disc;
  padding-left: 1.15rem;
  font-size: .88rem;
  color: var(--muted);
}
.hp-dr-alert-list li { margin: .15rem 0; }
.hp-dr-check-row,
.hp-dr-claim-row {
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
  transition: box-shadow .2s ease, border-color .2s ease;
}
.hp-dr-check-row.is-hopp {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 22%, transparent);
}
.hp-dr-check-top,
.hp-dr-claim-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-dr-check-label,
.hp-dr-claim-label { flex: 1; min-width: 160px; }
.hp-dr-crit-badge {
  display: inline-block;
  margin-left: .35rem;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .32rem;
  border-radius: 999px;
  vertical-align: middle;
  background: color-mix(in srgb, #ef4444 16%, var(--bg));
  color: color-mix(in srgb, #b91c1c 85%, var(--text));
  border: 1px solid color-mix(in srgb, #ef4444 35%, var(--border));
}
.hp-dr-st-wrap { flex-shrink: 0; }
.hp-dr-st { min-width: 9rem; font-size: .85rem; }
.hp-dr-claim-fields {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
}
.hp-dr-amt-wrap input {
  width: 7.5rem;
  min-width: 6rem;
}
.hp-dr-claim-note {
  display: block;
  margin-top: .35rem;
}
.hp-dr-claim-note input {
  width: 100%;
  font-size: .88rem;
}
.hp-dr-live {
  margin-bottom: .65rem;
  padding-bottom: .55rem;
  border-bottom: 1px dashed var(--border);
}
.hp-dr-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem .65rem;
  margin: .55rem 0 .55rem;
}
.hp-dr-gauges .hp-gauge {
  display: grid;
  gap: .1rem;
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev));
}
.hp-dr-gauges .hp-gauge strong {
  font-size: .95rem;
  font-variant-numeric: tabular-nums;
}
.hp-dr-stack {
  display: flex;
  height: .65rem;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--border) 60%, var(--bg));
  margin: .25rem 0 .2rem;
}
.hp-dr-stack-acc {
  display: block;
  height: 100%;
  background: color-mix(in srgb, #ef4444 70%, #f97316);
  transition: width .25s ease;
}
.hp-dr-stack-open {
  display: block;
  height: 100%;
  background: color-mix(in srgb, #f59e0b 75%, #eab308);
  transition: width .25s ease;
}
.hp-dr-stack-ret {
  display: block;
  height: 100%;
  background: color-mix(in srgb, #22c55e 70%, var(--brand));
  transition: width .25s ease;
}
.hp-dr-stack-legend {
  margin: 0 0 .55rem;
  font-size: .78rem;
}
.hp-dr-lg-acc { color: color-mix(in srgb, #b91c1c 70%, var(--text)); }
.hp-dr-lg-open { color: color-mix(in srgb, #b45309 70%, var(--text)); }
.hp-dr-lg-ret { color: color-mix(in srgb, #15803d 70%, var(--text)); }
.hp-dr-bar-wrap { margin: .35rem 0 .65rem; }
.hp-dr-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-dr-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--brand) 75%, #22c55e),
    var(--brand)
  );
  transition: width .25s ease;
}
.hp-dr-readiness {
  margin: .55rem 0;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev));
}
.hp-dr-ready-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .95rem;
}
.hp-dr-readiness.is-ok {
  border-color: color-mix(in srgb, #22c55e 45%, var(--border));
  background: color-mix(in srgb, #22c55e 10%, var(--bg-elev));
}
.hp-dr-readiness.is-mid {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 9%, var(--bg-elev));
}
.hp-dr-readiness.is-tight,
.hp-dr-readiness.is-dispute {
  border-color: color-mix(in srgb, #ef4444 40%, var(--border));
  background: color-mix(in srgb, #ef4444 8%, var(--bg-elev));
}
.hp-dr-countdown {
  margin: .55rem 0;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}
.hp-dr-next,
.hp-dr-open-prep {
  margin: .55rem 0;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
}
.hp-dr-next-btn,
.hp-dr-open-btn {
  display: inline;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  color: var(--brand, #0ea5e9);
  font: inherit;
  text-align: left;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hp-dr-next-btn:hover,
.hp-dr-open-btn:hover,
.hp-dr-next-btn:focus-visible,
.hp-dr-open-btn:focus-visible {
  color: color-mix(in srgb, var(--brand, #0ea5e9) 70%, #000);
  outline: none;
}
.hp-dr-open-list { gap: .25rem; }
.hp-dr-open-list li { font-size: .88rem; }
.hp-dr-alerts {
  margin: .55rem 0;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev));
}
.hp-dr-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .88rem;
}
.hp-dr-table th {
  text-align: left;
  font-weight: 500;
  color: var(--muted);
  padding: .2rem .35rem .2rem 0;
}
.hp-dr-table td {
  text-align: right;
  font-variant-numeric: tabular-nums;
  padding: .2rem 0;
}
.hp-dr-tr-strong th,
.hp-dr-tr-strong td {
  font-weight: 700;
  color: var(--text);
  padding-top: .35rem;
  border-top: 1px dashed var(--border);
}
.hp-dr-commit { margin-top: .75rem; }
.hp-dr-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
}
.hp-dr-nonadvice,
.hp-dr-nonadvice-fixed {
  margin-top: .55rem;
  font-size: .8rem;
}
.hp-dr-privacy {
  margin-top: .85rem;
  font-size: .9rem;
}
.hp-dr-privacy summary { cursor: pointer; font-weight: 600; }
.hp-dr-faq details {
  margin: .35rem 0;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-dr-faq summary { cursor: pointer; font-weight: 650; }
.hp-dr-range {
  margin: .45rem 0 .15rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg));
  display: grid;
  gap: .2rem;
}
.hp-dr-range-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: .5rem;
  font-size: .88rem;
  font-variant-numeric: tabular-nums;
}
.hp-dr-range-mid {
  font-weight: 700;
  padding: .1rem 0;
  border-top: 1px dashed color-mix(in srgb, var(--border) 70%, transparent);
  border-bottom: 1px dashed color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-dr-claim-sum {
  margin: 0 0 .4rem;
  padding: .35rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev));
  font-size: .85rem;
}
.hp-dr-claim-sum.is-warn {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev));
  color: color-mix(in srgb, #b45309 70%, var(--text));
  font-weight: 600;
}
.hp-dr-rail {
  margin: .55rem 0;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
}
.hp-dr-rail-list {
  list-style: none;
  margin: 0;
  padding: 0 0 0 .35rem;
  display: grid;
  gap: .45rem;
  position: relative;
}
.hp-dr-rail-list::before {
  content: '';
  position: absolute;
  left: .42rem;
  top: .35rem;
  bottom: .35rem;
  width: 2px;
  background: color-mix(in srgb, var(--brand) 35%, var(--border));
  border-radius: 2px;
}
.hp-dr-rail-item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: .35rem .55rem;
  align-items: baseline;
  padding-left: .85rem;
  position: relative;
  font-size: .88rem;
}
.hp-dr-rail-item::before {
  content: '';
  position: absolute;
  left: .2rem;
  top: .45rem;
  width: .55rem;
  height: .55rem;
  border-radius: 50%;
  background: color-mix(in srgb, var(--brand) 55%, var(--bg-elev));
  border: 2px solid color-mix(in srgb, var(--brand) 40%, var(--border));
  box-sizing: border-box;
}
.hp-dr-rail-item.is-past {
  opacity: .72;
}
.hp-dr-rail-item.is-past::before {
  background: color-mix(in srgb, var(--muted) 50%, var(--bg-elev));
  border-color: var(--border);
}
.hp-dr-rail-item.is-today::before,
.hp-dr-rail-item.is-soon::before {
  background: color-mix(in srgb, #22c55e 70%, var(--brand));
  border-color: color-mix(in srgb, #16a34a 50%, var(--border));
}
.hp-dr-rail-date { font-weight: 700; white-space: nowrap; }
.hp-dr-rail-label { font-weight: 600; }
.hp-dr-rail-delta { font-size: .75rem; white-space: nowrap; }
.hp-dr-rail-cap { margin: .25rem 0 0; }
.hp-dr-subject {
  width: 100%;
  font-size: .88rem;
  font-weight: 600;
  margin: 0 0 .15rem;
}
.hp-dr-seed-out {
  align-items: center;
}
@media (max-width: 900px) {
  .hp-dr-layout {
    grid-template-columns: 1fr;
  }
  .hp-dr-panel {
    order: -1;
    position: relative;
    top: 0;
    max-height: none;
  }
  .hp-dr-main { order: 1; }
}
@media (max-width: 560px) {
  .hp-dr-hero {
    grid-template-columns: 1fr;
  }
  .hp-dr-hero-mascot { width: 56px; height: 56px; }
  .hp-dr-hero-copy { grid-column: 1; }
  .hp-dr-gauges { grid-template-columns: 1fr; }
  .hp-dr-rail-item {
    grid-template-columns: 1fr;
    gap: .1rem;
  }
}
@media (min-width: 901px) {
  .hp-dr-hero {
    grid-template-columns: 72px 1fr;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hp-dr-fill,
  .hp-dr-stack-acc,
  .hp-dr-stack-open,
  .hp-dr-stack-ret { transition: none; }
  .hp-dr-check-row { transition: none; }
}

/* Depositum-retur: radstatus, temperatur, mnd/mottatt-chips, trekk-hjelpere */
.hp-dr-mnd-chips,
.hp-dr-recv-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  align-items: center;
  margin-top: .35rem;
}
.hp-dr-mnd-chips .chip,
.hp-dr-recv-chips .chip {
  font-size: .78rem;
  padding: .12rem .4rem;
}
.hp-dr-mnd-chips .chip.active,
.hp-dr-mnd-chips .chip.is-on,
.hp-dr-mnd-chips .chip[aria-pressed="true"],
.hp-dr-recv-chips .chip.active {
  outline: 2px solid color-mix(in srgb, var(--brand) 50%, transparent);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-dr-check-row.is-done {
  border-color: color-mix(in srgb, #22c55e 40%, var(--border));
  background: color-mix(in srgb, #22c55e 7%, var(--bg-elev));
}
.hp-dr-check-row.is-doing {
  border-color: color-mix(in srgb, #0ea5e9 45%, var(--border));
  background: color-mix(in srgb, #0ea5e9 8%, var(--bg-elev));
}
.hp-dr-check-row.is-todo {
  /* default */
}
.hp-dr-check-row.is-na {
  opacity: .62;
}
.hp-dr-claim-row.is-claim-accept {
  border-color: color-mix(in srgb, #22c55e 40%, var(--border));
  background: color-mix(in srgb, #22c55e 6%, var(--bg-elev));
}
.hp-dr-claim-row.is-claim-dispute {
  border-color: color-mix(in srgb, #ef4444 42%, var(--border));
  background: color-mix(in srgb, #ef4444 7%, var(--bg-elev));
}
.hp-dr-claim-row.is-claim-unclear {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev));
}
.hp-dr-claim-impact {
  margin: 0 0 .45rem;
  padding: .35rem .55rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev));
  font-size: .85rem;
}
.hp-dr-claim-helpers .btn { font-size: .82rem; }
.hp-dr-live-head {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .65rem;
  align-items: center;
  justify-content: space-between;
  margin-bottom: .15rem;
}
.hp-dr-temp {
  display: inline-block;
  font-size: .72rem;
  font-weight: 750;
  letter-spacing: .03em;
  text-transform: uppercase;
  padding: .18rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev));
  color: var(--text);
}
.hp-dr-temp.is-ok {
  background: color-mix(in srgb, #22c55e 18%, var(--bg-elev));
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
  color: color-mix(in srgb, #166534 85%, var(--text));
}
.hp-dr-temp.is-mid {
  background: color-mix(in srgb, #f59e0b 16%, var(--bg-elev));
  border-color: color-mix(in srgb, #d97706 40%, var(--border));
  color: color-mix(in srgb, #92400e 85%, var(--text));
}
.hp-dr-temp.is-tight,
.hp-dr-temp.is-dispute {
  background: color-mix(in srgb, #ef4444 14%, var(--bg-elev));
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  color: color-mix(in srgb, #991b1b 85%, var(--text));
}
.hp-dr-temp.is-empty {
  opacity: .75;
}


/* —— Nabo & støy (rent_in-nabovarsel-leie · rent_noise) —— */
.hp-rn { display: grid; gap: 1rem; }
.hp-rn-date-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-rn-date-chips .chip,
.hp-rn-date-chips .chip-sm {
  font-size: .78rem;
  padding: .15rem .4rem;
}
.hp-rn-chk-bar {
  height: .45rem;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
  margin: .15rem 0 .2rem;
}
.hp-rn-chk-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #22c55e, #0ea5e9);
  transition: width .2s ease;
}
.hp-rn-chk-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-rn-fcnt {
  display: inline-block;
  min-width: 1.1rem;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  opacity: .85;
  margin-left: .15rem;
}
.hp-rn-check.is-flash {
  outline: 2px solid #0ea5e9;
  outline-offset: 2px;
  background: #f0f9ff;
}
.hp-rn-sorts {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  align-items: center;
  margin: 0 0 .45rem;
}
.hp-rn-next {
  margin: 0 0 .75rem;
  padding: .5rem .6rem;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid var(--border, #e2e8f0);
}
.hp-rn-next-list {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-rn-next-list li { margin: .2rem 0; }
.hp-rn-subject {
  width: 100%;
  box-sizing: border-box;
  font-size: .85rem;
  padding: .4rem .5rem;
  border-radius: 8px;
  border: 1px solid var(--border, #cbd5e1);
  background: #f8fafc;
  margin-bottom: .15rem;
}
.hp-rn-hero {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: .75rem 1rem;
  align-items: start;
  padding: .85rem 1rem;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(14, 165, 233, .06), rgba(99, 102, 241, .04));
}
.hp-rn-hero-mascot {
  width: 72px;
  height: 72px;
  object-fit: contain;
  border-radius: 12px;
}
.hp-rn-lead { margin: 0; }
.hp-rn-lead p { margin: 0 0 .35rem; }
.hp-rn-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.1rem;
}
.hp-rn-lead-bullets li { margin: .15rem 0; }
.hp-rn-how {
  grid-column: 1 / -1;
  margin-top: .15rem;
  font-size: .9rem;
}
.hp-rn-how summary { cursor: pointer; font-weight: 650; }
.hp-rn-how-list { margin: .35rem 0 0; padding-left: 1.15rem; }
.hp-rn-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
}
.hp-rn-demo-badge,
.hp-rn .hp-rn-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .35rem;
  border-radius: 4px;
  background: #fef3c7;
  color: #92400e;
}
.hp-rn-demo-note {
  margin: .15rem 0 0;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-rn-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .95fr);
  gap: 1.15rem;
  align-items: start;
}
.hp-rn-section {
  font-size: 1.02rem;
  margin: 1rem 0 .5rem;
}
.hp-rn-form-col .hp-rn-section:first-child { margin-top: 0; }
.hp-rn-sev-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .35rem 0 .25rem;
}
.hp-rn-sev-chip {
  min-width: 2.1rem;
  height: 2.1rem;
  border-radius: 999px;
  border: 1px solid var(--border, #cbd5e1);
  background: #fff;
  font-weight: 700;
  cursor: pointer;
}
.hp-rn-sev-chip.is-on {
  background: #0ea5e9;
  border-color: #0284c7;
  color: #fff;
}
.hp-rn-sev-hint { margin-left: .25rem; }
.hp-rn-dim-val {
  display: inline-block;
  min-width: 1.25rem;
  font-weight: 700;
  margin-left: .35rem;
}
.hp-rn-live {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: center;
  margin: .45rem 0 .55rem;
  padding: .45rem .65rem;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid var(--border, #e2e8f0);
}
.hp-rn-live-num { font-size: 1.25rem; }
.hp-rn-band {
  display: inline-block;
  font-size: .78rem;
  font-weight: 700;
  padding: .15rem .45rem;
  border-radius: 999px;
  background: #e2e8f0;
  color: #334155;
}
.hp-rn-band.is-ok { background: #dcfce7; color: #166534; }
.hp-rn-band.is-mid { background: #fef9c3; color: #854d0e; }
.hp-rn-band.is-tight { background: #fee2e2; color: #991b1b; }
.hp-rn-impacts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .35rem .55rem;
  margin: .35rem 0;
}
.hp-rn-impact {
  display: flex;
  gap: .4rem;
  align-items: center;
  font-size: .9rem;
  cursor: pointer;
}
.hp-rn-checks {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-rn-check {
  padding: .55rem .65rem;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 10px;
  background: #fff;
}
.hp-rn-check-lab {
  display: flex;
  gap: .35rem;
  align-items: flex-start;
  margin-bottom: .4rem;
}
.hp-rn-check-title {
  font-size: .9rem;
  font-weight: 600;
  line-height: 1.3;
}
.hp-rn-st {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
}
.hp-rn-st-btn {
  font-size: .75rem;
  font-weight: 650;
  padding: .2rem .45rem;
  border-radius: 999px;
  border: 1px solid var(--border, #cbd5e1);
  background: #f8fafc;
  cursor: pointer;
  color: #475569;
}
.hp-rn-st-btn.is-on {
  background: #0f172a;
  border-color: #0f172a;
  color: #fff;
}
.hp-rn-st-btn[data-st="ok"].is-on { background: #15803d; border-color: #15803d; }
.hp-rn-st-btn[data-st="warn"].is-on { background: #ca8a04; border-color: #ca8a04; }
.hp-rn-st-btn[data-st="na"].is-on { background: #64748b; border-color: #64748b; }
.hp-rn-privacy {
  margin-top: .85rem;
  font-size: .86rem;
}
.hp-rn-privacy summary { cursor: pointer; font-weight: 650; }
.hp-rn-panel {
  position: sticky;
  top: .75rem;
  max-height: calc(100vh - 1.5rem);
  overflow: auto;
  padding: .85rem .9rem 1rem;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
  scroll-behavior: smooth;
}
.hp-rn-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: .5rem;
  margin-bottom: .55rem;
}
.hp-rn-gauges {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .45rem;
  margin-bottom: .65rem;
}
.hp-rn-gauge {
  padding: .45rem .55rem;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid var(--border, #e2e8f0);
  display: grid;
  gap: .15rem;
}
.hp-rn-gauge strong {
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
}
.hp-rn-temp {
  margin: 0 0 .75rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border, #e2e8f0);
  background: #f8fafc;
}
.hp-rn-temp.is-hot { background: #fef2f2; border-color: #fecaca; }
.hp-rn-temp.is-mid { background: #fffbeb; border-color: #fde68a; }
.hp-rn-temp.is-cool { background: #f0fdf4; border-color: #bbf7d0; }
.hp-rn-temp.is-empty { background: #f8fafc; }
.hp-rn-temp-title {
  margin: 0 0 .2rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-rn-patterns { margin-bottom: .75rem; }
.hp-rn-bars { display: grid; gap: .3rem; }
.hp-rn-bar-row {
  display: grid;
  grid-template-columns: minmax(4.5rem, 7rem) 1fr auto;
  gap: .35rem;
  align-items: center;
  font-size: .82rem;
}
.hp-rn-bar-lab {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #475569;
}
.hp-rn-bar-track {
  height: .45rem;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
}
.hp-rn-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #38bdf8, #6366f1);
  transition: width .2s ease;
}
.hp-rn-bar-n {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  color: #334155;
  min-width: 1.2rem;
  text-align: right;
}
.hp-rn-bar-row.is-click {
  cursor: pointer;
  border-radius: 8px;
  padding: .15rem .2rem;
  margin: 0 -.2rem;
}
.hp-rn-bar-row.is-click:hover,
.hp-rn-bar-row.is-click:focus-visible {
  background: #f0f9ff;
  outline: none;
}
.hp-rn-formula {
  margin: 0 0 .75rem;
  padding: .45rem .6rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border, #e2e8f0);
  background: #f8fafc;
  font-size: .86rem;
}
.hp-rn-formula summary {
  cursor: pointer;
  font-weight: 650;
}
.hp-rn-formula-pre {
  margin: .35rem 0 0;
  padding: .45rem .5rem;
  border-radius: 8px;
  background: #0f172a;
  color: #e2e8f0;
  font-size: .72rem;
  line-height: 1.45;
  white-space: pre-wrap;
  overflow-x: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.hp-rn-follow-cd {
  margin: .3rem 0 0;
  padding: .3rem .45rem;
  border-radius: 8px;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  color: #1e3a8a;
}
.hp-rn-type-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin: 0 0 .45rem;
}
.hp-rn-seed-row {
  align-items: center;
}
.hp-rn-temp.plan-klar { box-shadow: inset 3px 0 0 #16a34a; }
.hp-rn-temp.plan-sjekk { box-shadow: inset 3px 0 0 #ca8a04; }
.hp-rn-temp.plan-mangler { box-shadow: inset 3px 0 0 #dc2626; }
.hp-rn-hints {
  margin: 0 0 .75rem;
  padding: .5rem .6rem;
  border-radius: 10px;
  background: #f1f5f9;
}
.hp-rn-hint-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-rn-hint-list li { margin: .2rem 0; }
.hp-rn-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin: 0 0 .45rem;
}
.hp-rn-list {
  display: grid;
  gap: .5rem;
  margin-bottom: .75rem;
}
.hp-rn-card {
  padding: .55rem .65rem;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 10px;
  background: #fafafa;
}
.hp-rn-card-top {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .5rem;
  align-items: center;
  justify-content: space-between;
  margin-bottom: .2rem;
}
.hp-rn-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  margin: .3rem 0;
}
.hp-rn-tag {
  font-size: .72rem;
  font-weight: 650;
  padding: .1rem .35rem;
  border-radius: 4px;
  background: #e0f2fe;
  color: #075985;
}
.hp-rn-card-notes { margin: .3rem 0 0; }
.hp-rn-card-actions { margin-top: .4rem; }
.hp-rn-commit { margin-top: .35rem; }
.hp-rn-commit-text {
  width: 100%;
  box-sizing: border-box;
  font-size: .8rem;
  line-height: 1.4;
  font-family: inherit;
  resize: vertical;
  min-height: 6rem;
  padding: .5rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border, #cbd5e1);
  background: #f8fafc;
}
.hp-rn-nonadvice {
  margin: .65rem 0 0;
  font-size: .8rem;
}
.hp-rn-bridges { margin-top: .5rem; }
.hp-rn-faq details { margin: .35rem 0; }
.hp-rn-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rn-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 900px) {
  .hp-rn-layout { grid-template-columns: 1fr; }
  .hp-rn-panel {
    position: static;
    max-height: none;
  }
  .hp-rn-hero { grid-template-columns: 1fr auto; }
}
@media (max-width: 560px) {
  .hp-rn-hero { grid-template-columns: 1fr; }
  .hp-rn-hero-copy { grid-column: 1; }
  .hp-rn-hero-mascot {
    grid-column: 1;
    width: 56px;
    height: 56px;
  }
  .hp-rn-gauges { grid-template-columns: 1fr; }
  .hp-rn-bar-row { grid-template-columns: 1fr; gap: .2rem; }
  .hp-rn-impacts { grid-template-columns: 1fr; }
}
@media (min-width: 901px) {
  .hp-rn-hero { grid-template-columns: 72px 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-rn-bar-fill,
  .hp-rn-chk-fill { transition: none; }
  .hp-rn-panel { scroll-behavior: auto; }
  .hp-rn-check.is-flash { outline-offset: 0; }
}


/* rent_noise extras: w2w, quick, active filter, time chips, sms */
.hp-rn-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem .4rem;
  align-items: center;
  margin: 0 0 .55rem;
  padding: .4rem .5rem;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid var(--border, #e2e8f0);
}
.hp-rn-quick .chip.is-on {
  background: #0ea5e9;
  border-color: #0284c7;
  color: #fff;
}
.hp-rn-w2w {
  margin: 0 0 .75rem;
  padding: .5rem .6rem;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid var(--border, #e2e8f0);
}
.hp-rn-w2w-bars { display: grid; gap: .35rem; }
.hp-rn-w2w-row {
  display: grid;
  grid-template-columns: 5.5rem 1fr 2rem;
  gap: .35rem;
  align-items: center;
  font-size: .82rem;
}
.hp-rn-w2w-lab { color: #475569; }
.hp-rn-w2w-track {
  height: .55rem;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
}
.hp-rn-w2w-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  min-width: 0;
}
.hp-rn-w2w-fill.is-now { background: linear-gradient(90deg, #0ea5e9, #6366f1); }
.hp-rn-w2w-fill.is-prev { background: #94a3b8; }
.hp-rn-w2w-n {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.hp-rn-active-filter {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .5rem;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 .45rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
}
.hp-rn-time-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin: 0 0 .45rem;
}
.hp-rn-sms {
  min-height: 3.5rem;
  background: #fffbeb;
  border-color: #fde68a;
}
.hp-rn textarea[data-e="husorden"] {
  width: 100%;
  box-sizing: border-box;
  font: inherit;
  font-size: .9rem;
  padding: .45rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border, #cbd5e1);
  resize: vertical;
  min-height: 3rem;
}
@media (max-width: 560px) {
  .hp-rn-w2w-row { grid-template-columns: 1fr; gap: .15rem; }
}

/* —— Yield brutto/netto (rent_out-yield-brutto-netto · yield) —— */
.hp-yd { margin-top: .25rem; }
.hp-yd-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-yd-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-yd-hero-copy { min-width: 0; }
.hp-yd-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  color: var(--muted, #5b6470);
}
.hp-yd-lead-bullets li { margin: .2rem 0; }
.hp-yd-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-yd-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-yd-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-yd-how-list li { margin: .2rem 0; }
.hp-yd-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  color: var(--brand);
  vertical-align: middle;
}
.hp-yd-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .45rem;
  margin: 0 0 .65rem;
}
.hp-yd-demos .chip {
  font-size: .82rem;
  padding: .28rem .65rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-yd-demos .chip:hover,
.hp-yd-demos .chip.active,
.hp-yd-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-yd-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-yd-demo-note { margin: 0 0 .65rem; }
.hp-yd-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.95fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 820px) {
  .hp-yd-layout {
    grid-template-columns: 1fr;
    display: flex;
    flex-direction: column;
  }
  .hp-yd-panel { order: -1; }
  .hp-yd-hero { grid-template-columns: 1fr; }
  .hp-yd-hero-mascot { width: 56px; height: 56px; }
}
.hp-yd-section {
  margin: 1rem 0 .45rem;
  font-size: .95rem;
  letter-spacing: -0.01em;
}
.hp-yd-section:first-child { margin-top: 0; }
.hp-yd-quick { display: flex; flex-direction: column; gap: .35rem; }
.hp-yd-quick-row {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
}
.hp-yd-quick-row .chip-sm {
  font-size: .78rem;
  padding: .22rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-yd-quick-row .chip-sm:hover,
.hp-yd-quick-row .chip-sm.active,
.hp-yd-quick-row .chip-sm[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-yd-panel {
  position: sticky;
  top: 4.5rem;
  padding: 1rem 1.05rem 1.1rem;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev));
  box-shadow: var(--shadow, 0 4px 16px rgba(0,0,0,.04));
  scroll-margin-top: 4.5rem;
}
@media (max-width: 820px) {
  .hp-yd-panel {
    position: relative;
    top: auto;
  }
}
.hp-yd-live { margin-bottom: .65rem; }
.hp-yd-live .hp-bid-num {
  font-size: clamp(1.55rem, 3.8vw, 2rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
  color: var(--brand);
  line-height: 1.15;
}
.hp-yd-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .78rem;
  opacity: .9;
}
.hp-yd-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .75rem;
}
.hp-yd-gauges .hp-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
  background: var(--card, #fff);
}
.hp-yd-gauges .hp-gauge strong {
  font-size: 1.1rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.hp-yd-gauge-cash { grid-column: 1 / -1; }
.hp-yd-gauge-cash strong.hp-yd-neg,
[data-out="cf_m"].hp-yd-neg { color: #b91c1c; }
.hp-yd-gauge-cash strong.hp-yd-pos,
[data-out="cf_m"].hp-yd-pos { color: #15803d; }
.hp-yd-stack { margin: .65rem 0 .55rem; }
.hp-yd-stack-bar {
  display: flex;
  height: 14px;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  border: 1px solid var(--border);
}
.hp-yd-seg { display: block; min-width: 0; height: 100%; transition: width .2s ease; }
@media (prefers-reduced-motion: reduce) {
  .hp-yd-seg { transition: none !important; }
}
.hp-yd-seg-eff { background: color-mix(in srgb, #94a3b8 75%, var(--border)); }
.hp-yd-seg-ops { background: color-mix(in srgb, #f59e0b 70%, #fde68a); }
.hp-yd-seg-maint { background: color-mix(in srgb, #ea580c 65%, #fdba74); }
.hp-yd-seg-debt { background: color-mix(in srgb, #64748b 75%, var(--border)); }
.hp-yd-seg-cash { background: color-mix(in srgb, var(--brand) 70%, #16a34a); }
.hp-yd-legend {
  list-style: none;
  margin: .4rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .75rem;
  font-size: .78rem;
  color: var(--muted, #5b6470);
}
.hp-yd-legend li { display: flex; align-items: center; gap: .3rem; }
.hp-yd-dot {
  width: .65rem;
  height: .65rem;
  border-radius: 3px;
  display: inline-block;
}
.hp-yd-breakdown,
.hp-yd-scen,
.hp-yd-tips { margin-top: .7rem; }
.hp-yd-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .86rem;
  font-variant-numeric: tabular-nums;
}
.hp-yd-table th {
  text-align: left;
  font-weight: 600;
  padding: .28rem .2rem .28rem 0;
  border-bottom: 1px solid var(--border);
}
.hp-yd-table td {
  text-align: right;
  padding: .28rem 0 .28rem .2rem;
  border-bottom: 1px solid var(--border);
}
.hp-yd-table thead th {
  font-size: .78rem;
  color: var(--muted, #5b6470);
  font-weight: 650;
}
.hp-yd-tr-strong th,
.hp-yd-tr-strong td { font-weight: 750; }
.hp-yd-tr-active th,
.hp-yd-tr-active td {
  background: color-mix(in srgb, var(--brand) 10%, transparent);
  font-weight: 700;
}
.hp-yd-tip-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  color: var(--muted, #5b6470);
}
.hp-yd-tip-list li { margin: .25rem 0; }
.hp-yd-faq,
.hp-yd-privacy {
  margin-top: .85rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-yd-faq > summary,
.hp-yd-privacy > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-yd-faq details { margin: .35rem 0; }
.hp-yd-faq details summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .88rem;
}
.hp-yd-faq details p { margin: .35rem 0 .15rem; }
.hp-yd-empty p { margin: 0; font-size: .9rem; }
.hp-yd-status-row {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-yd-status {
  display: inline-block;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .01em;
  padding: .18rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  color: var(--muted, #5b6470);
}
.hp-yd-status.is-ok {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 12%, var(--bg-elev));
  color: #166534;
}
.hp-yd-status.is-neg {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 12%, var(--bg-elev));
  color: #991b1b;
}
.hp-yd-status.is-tight,
.hp-yd-status.is-low,
.hp-yd-status.is-zero {
  border-color: color-mix(in srgb, #d97706 45%, var(--border));
  background: color-mix(in srgb, #d97706 12%, var(--bg-elev));
  color: #92400e;
}
.hp-yd-status.is-empty {
  opacity: .85;
}
.hp-yd-formula {
  margin: 0 0 .65rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px dashed var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
  font-variant-numeric: tabular-nums;
  line-height: 1.35;
  word-break: break-word;
}
.hp-yd-rev { margin-top: .7rem; }
.hp-yd-shock { margin-top: .7rem; }
.hp-yd-scen tr[data-yd-sc-vac],
.hp-yd-shock tr[data-yd-sh-pp] {
  cursor: pointer;
}
.hp-yd-scen tr[data-yd-sc-vac]:hover th,
.hp-yd-scen tr[data-yd-sc-vac]:hover td,
.hp-yd-shock tr[data-yd-sh-pp]:hover th,
.hp-yd-shock tr[data-yd-sh-pp]:hover td {
  background: color-mix(in srgb, var(--brand) 8%, transparent);
}
.hp-yd-scen tr[data-yd-sc-vac]:focus-visible,
.hp-yd-shock tr[data-yd-sh-pp]:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 1px;
}
.hp-yd-seed-row {
  align-items: center;
}
.hp-yd-seed-row .btn-sm {
  font-size: .8rem;
  padding: .28rem .55rem;
}
@media (max-width: 560px) {
  .hp-yd-gauges { grid-template-columns: 1fr; }
  .hp-yd-gauge-cash { grid-column: auto; }
}
.hp-yd-rent-delta {
  margin-top: .35rem;
}
.hp-yd-rent-delta .chip-sm {
  min-width: 2.6rem;
  justify-content: center;
  font-variant-numeric: tabular-nums;
}
.hp-yd [data-yd-vac-days-hint] {
  display: block;
  margin-top: .25rem;
}


/* —— Utleiekontrakt-sjekk (rent_out-kontrakt-utleie · ll_contract) —— */
.hp-uc-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-uc-hero-mascot {
  border-radius: 16px;
  grid-row: 1 / span 2;
}
.hp-uc-hero-copy { min-width: 0; grid-column: 2; }
.hp-uc-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-uc-lead-bullets li { margin: .15rem 0; }
.hp-uc-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  padding: .65rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 70%, var(--brand, #0f766e) 6%);
}
.hp-uc-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-uc-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-uc-how-list li { margin: .2rem 0; }
.hp-uc-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .75rem;
}
.hp-uc-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: color-mix(in srgb, #f59e0b 22%, transparent);
  color: #92400e;
}
.hp-uc-demo-note {
  margin: -.35rem 0 .85rem;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: color-mix(in srgb, #f59e0b 12%, transparent);
}
.hp-uc-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.9fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-uc-layout { grid-template-columns: 1fr; }
  .hp-uc-hero { grid-template-columns: auto 1fr; }
  .hp-uc-panel { position: static; }
}
.hp-uc-section {
  margin: 1.1rem 0 .55rem;
  font-size: 1.05rem;
}
.hp-uc-main .hp-uc-section:first-child { margin-top: 0; }
.hp-uc-cat-tabs,
.hp-uc-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-uc-tab.is-on,
.hp-uc-tab[aria-pressed="true"],
.hp-uc-filter.is-on,
.hp-uc-filter[aria-pressed="true"] {
  background: color-mix(in srgb, var(--brand, #0f766e) 18%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  font-weight: 700;
}
.hp-uc-tab-pct {
  margin-left: .2rem;
  font-size: .75rem;
  opacity: .85;
  font-weight: 650;
}
.hp-uc-filter-count { margin: -.25rem 0 .55rem; }
.hp-uc-cat { margin-bottom: 1rem; }
.hp-uc-cat-title {
  margin: 0 0 .25rem;
  font-size: .98rem;
}
.hp-uc-cat-help { margin: 0 0 .5rem; }
.hp-uc-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .45rem;
}
.hp-uc-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: var(--bg-elev, #fff);
  transition: border-color .15s, background .15s;
}
.hp-uc-row.is-critical {
  border-left: 3px solid color-mix(in srgb, #dc2626 70%, var(--border));
}
.hp-uc-row.is-ok {
  background: color-mix(in srgb, #ecfdf5 75%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #10b981 30%, var(--border));
}
.hp-uc-row.is-unclear {
  background: color-mix(in srgb, #fffbeb 80%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #f59e0b 35%, var(--border));
}
.hp-uc-row.is-missing,
.hp-uc-row.is-gap {
  background: color-mix(in srgb, #fef2f2 70%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #f87171 30%, var(--border));
}
.hp-uc-row.is-red {
  background: color-mix(in srgb, #fee2e2 85%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
}
.hp-uc-row.is-na {
  opacity: .72;
  background: color-mix(in srgb, var(--bg, #f8fafc) 60%, var(--bg-elev, #fff));
}
.hp-uc-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .65rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-uc-label {
  flex: 1 1 12rem;
  min-width: 0;
  font-size: .92rem;
}
.hp-uc-crit-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .32rem;
  border-radius: 5px;
  margin-right: .3rem;
  vertical-align: middle;
  background: color-mix(in srgb, #dc2626 16%, transparent);
  color: #b91c1c;
}
.hp-uc-status-wrap { flex: 0 0 auto; }
.hp-uc-status {
  min-width: 9.5rem;
  font-size: .86rem;
}
.hp-uc-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
}
.hp-uc-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .9rem 1rem 1rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--brand, #0f766e) 4%);
}
.hp-uc-readiness {
  padding: .65rem .75rem;
  border-radius: 12px;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-uc-readiness.is-ok {
  border-color: color-mix(in srgb, #10b981 45%, var(--border));
  background: color-mix(in srgb, #ecfdf5 80%, var(--bg-elev, #fff));
}
.hp-uc-readiness.is-mid {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #fffbeb 80%, var(--bg-elev, #fff));
}
.hp-uc-readiness.is-warm,
.hp-uc-readiness.is-hot {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #fef2f2 85%, var(--bg-elev, #fff));
}
.hp-uc-readiness.is-unknown {
  border-color: color-mix(in srgb, #64748b 30%, var(--border));
}
.hp-uc-ready-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .98rem;
}
.hp-uc-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  margin-bottom: .55rem;
}
.hp-uc-gauge {
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-uc-gauge strong { font-size: 1.15rem; }
.hp-uc-counts {
  font-size: .82rem;
  color: var(--muted, #64748b);
  margin-bottom: .65rem;
}
.hp-uc-bars {
  display: grid;
  gap: .35rem;
  margin-bottom: .75rem;
}
.hp-uc-bar-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(70px, 0.9fr);
  gap: .4rem;
  align-items: center;
  font-size: .78rem;
}
.hp-uc-bar {
  height: 8px;
  border-radius: 99px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  overflow: hidden;
}
.hp-uc-bar-fill {
  display: block;
  height: 100%;
  border-radius: 99px;
  background: color-mix(in srgb, var(--brand, #0f766e) 75%, #34d399);
  transition: width .2s ease;
}
.hp-uc-filter-n {
  margin-left: .15rem;
  font-size: .72rem;
  opacity: .85;
  font-weight: 650;
}
.hp-uc-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  margin-top: .35rem;
}
.hp-uc-qchip {
  font-size: .72rem !important;
  padding: .12rem .4rem !important;
  min-height: 0;
  line-height: 1.2;
}
.hp-uc-qchip.is-on,
.hp-uc-qchip[aria-pressed="true"] {
  background: color-mix(in srgb, var(--brand, #0f766e) 20%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  font-weight: 700;
}
.hp-uc-row.is-flash {
  outline: 2px solid color-mix(in srgb, var(--brand, #0f766e) 70%, #38bdf8);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand, #0f766e) 18%, transparent);
  transition: outline .15s, box-shadow .15s;
}
.hp-uc-jump-li {
  cursor: pointer;
  border-radius: 6px;
  padding: .1rem .15rem;
}
.hp-uc-jump-li:hover,
.hp-uc-jump-li:focus {
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, transparent);
  outline: none;
}
.hp-uc-countdown {
  margin: 0 0 .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #0ea5e9 28%, var(--border));
  background: color-mix(in srgb, #e0f2fe 55%, var(--bg-elev, #fff));
}
.hp-uc-formula {
  margin: 0 0 .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 22%, var(--border));
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 6%);
}
.hp-uc-formula-line {
  margin: 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  word-break: break-word;
}
.hp-uc-mnd-chips,
.hp-uc-date-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .25rem;
}
.hp-uc-mnd-chips .chip.is-on,
.hp-uc-mnd-chips .chip[aria-pressed="true"] {
  background: color-mix(in srgb, var(--brand, #0f766e) 18%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  font-weight: 700;
}
.hp-uc-date-qfield,
.hp-uc-dep-mnd-field {
  margin-bottom: .15rem;
}
.hp-uc-draft-block {
  padding: .75rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 5%);
}
.hp-uc-draft-text {
  width: 100%;
  font-size: .84rem;
  line-height: 1.45;
  font-family: inherit;
}
.hp-uc-facts-actions { margin-top: .25rem; }
.hp-uc-dep-box,
.hp-uc-flag-box,
.hp-uc-next,
.hp-uc-questions,
.hp-uc-snapshot,
.hp-uc-commit {
  margin-top: .7rem;
  padding-top: .55rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
}
.hp-uc-flag-ul,
.hp-uc-q-ul,
.hp-uc-next-ol {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-uc-flag-ul li,
.hp-uc-q-ul li,
.hp-uc-next-ol li { margin: .2rem 0; }
.hp-uc-commit-text {
  width: 100%;
  font-size: .8rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.hp-uc-nonadvice {
  margin-top: .65rem;
  font-size: .78rem;
}
.hp-uc-faq details {
  margin: .4rem 0;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}
.hp-uc-faq summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
}
@media (max-width: 600px) {
  .hp-uc-hero { grid-template-columns: 1fr; }
  .hp-uc-hero-copy { grid-column: 1; }
  .hp-uc-hero-mascot { grid-row: auto; width: 64px; height: 64px; }
  .hp-uc-gauges { grid-template-columns: 1fr; }
  .hp-uc-bar-row { grid-template-columns: 1fr; }
  .hp-uc-row-top { flex-direction: column; }
  .hp-uc-status { width: 100%; min-width: 0; }
}


/* —— Utleiekontrakt-sjekk extras (chips · weight bar · package) —— */
.hp-uc-weight-bar-wrap { margin: .15rem 0 .55rem; }
.hp-uc-weight-bar {
  height: 10px;
  border-radius: 99px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-uc-weight-bar-fill {
  display: block;
  height: 100%;
  border-radius: 99px;
  background: color-mix(in srgb, var(--brand, #0f766e) 70%, #34d399);
  transition: width .2s ease, background .2s ease;
}
.hp-uc-weight-bar.is-ok .hp-uc-weight-bar-fill {
  background: color-mix(in srgb, #10b981 80%, var(--brand, #0f766e));
}
.hp-uc-weight-bar.is-mid .hp-uc-weight-bar-fill {
  background: color-mix(in srgb, #f59e0b 75%, #fde68a);
}
.hp-uc-weight-bar.is-hot .hp-uc-weight-bar-fill {
  background: color-mix(in srgb, #dc2626 70%, #f87171);
}
.hp-uc-notice-chips,
.hp-uc-due-chips,
.hp-uc-inkl-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .25rem;
}
.hp-uc-notice-chips .chip.is-on,
.hp-uc-notice-chips .chip[aria-pressed="true"],
.hp-uc-due-chips .chip.is-on,
.hp-uc-due-chips .chip[aria-pressed="true"],
.hp-uc-inkl-chips .chip.is-on,
.hp-uc-inkl-chips .chip[aria-pressed="true"] {
  background: color-mix(in srgb, var(--brand, #0f766e) 18%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  font-weight: 700;
}
.hp-uc-inkl-field { margin-bottom: .25rem; }

/* —— Vedlikeholdsbudsjett (rent_out-vedlikehold-fond · maint_fund) —— */
.hp-vmf { margin-top: .25rem; }
.hp-vmf-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-vmf-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-vmf-hero-copy { min-width: 0; }
.hp-vmf-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  color: var(--muted, #5b6470);
}
.hp-vmf-lead-bullets li { margin: .2rem 0; }
.hp-vmf-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-vmf-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-vmf-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-vmf-how-list li { margin: .2rem 0; }
.hp-vmf-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  color: var(--brand);
  vertical-align: middle;
}
.hp-vmf-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .45rem;
  margin: 0 0 .65rem;
}
.hp-vmf-demos .chip {
  font-size: .82rem;
  padding: .28rem .65rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-vmf-demos .chip:hover,
.hp-vmf-demos .chip.active,
.hp-vmf-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-vmf-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-vmf-demo-note { margin: 0 0 .65rem; }
.hp-vmf-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.95fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 820px) {
  .hp-vmf-layout {
    grid-template-columns: 1fr;
    display: flex;
    flex-direction: column;
  }
  .hp-vmf-panel { order: -1; }
  .hp-vmf-hero { grid-template-columns: 1fr; }
  .hp-vmf-hero-mascot { width: 56px; height: 56px; }
}
.hp-vmf-section {
  margin: 1rem 0 .45rem;
  font-size: .95rem;
  letter-spacing: -0.01em;
}
.hp-vmf-section:first-child { margin-top: 0; }
.hp-vmf-quick-row {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
}
.hp-vmf-quick .chip-sm {
  font-size: .78rem;
  padding: .2rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-vmf-quick .chip-sm.active,
.hp-vmf-quick .chip-sm[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  font-weight: 650;
}
.hp-vmf-lines {
  display: flex;
  flex-direction: column;
  gap: .55rem;
}
.hp-vmf-line {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem .65rem;
  background: var(--bg-elev, #fff);
  opacity: .72;
  transition: opacity .15s ease, border-color .15s ease;
}
.hp-vmf-line.is-on {
  opacity: 1;
  border-color: color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 4%, var(--bg-elev, #fff));
}
.hp-vmf-line-on {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-weight: 650;
  font-size: .9rem;
  cursor: pointer;
  margin-right: .25rem;
}
.hp-vmf-line-label { user-select: none; }
.hp-vmf-line-fields {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: .45rem .65rem;
  margin-top: .4rem;
  align-items: end;
}
@media (max-width: 560px) {
  .hp-vmf-line-fields { grid-template-columns: 1fr 1fr; }
  .hp-vmf-line-yr { grid-column: 1 / -1; }
}
.hp-vmf-line-yr {
  min-width: 5.5rem;
  text-align: right;
  padding-bottom: .15rem;
}
.hp-vmf-line-yr strong {
  display: block;
  font-size: .92rem;
  font-variant-numeric: tabular-nums;
}
.hp-vmf-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem 1rem;
  background: var(--bg-elev, #fff);
  max-height: calc(100vh - 1.5rem);
  overflow: auto;
}
.hp-vmf-live {
  text-align: center;
  margin-bottom: .65rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid var(--border);
}
.hp-vmf-live .hp-bid-num {
  font-size: 1.65rem;
  font-weight: 750;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.hp-vmf-nonadvice-fixed {
  margin: .35rem 0 0;
  font-size: .76rem;
  opacity: .9;
}
.hp-vmf-status-row {
  display: flex;
  justify-content: center;
  margin: 0 0 .35rem;
}
.hp-vmf-status {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
  padding: .18rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--border) 25%, var(--bg-elev, #fff));
  color: var(--muted, #5b6470);
}
.hp-vmf-status--empty { opacity: .85; }
.hp-vmf-status--thin {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 12%, var(--bg-elev, #fff));
  color: #b91c1c;
}
.hp-vmf-status--check {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 14%, var(--bg-elev, #fff));
  color: #b45309;
}
.hp-vmf-status--ok {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 12%, var(--bg-elev, #fff));
  color: #15803d;
}
.hp-vmf-status--high {
  border-color: color-mix(in srgb, #7c3aed 45%, var(--border));
  background: color-mix(in srgb, #7c3aed 12%, var(--bg-elev, #fff));
  color: #6d28d9;
}
.hp-vmf-formula {
  margin: .25rem 0 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .72rem;
  opacity: .88;
  word-break: break-word;
}
.hp-vmf-line-presets {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .4rem;
  margin: 0 0 .55rem;
}
.hp-vmf-line-presets .chip-sm {
  font-size: .78rem;
  padding: .2rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-vmf-line-presets .chip-sm.active,
.hp-vmf-line-presets .chip-sm[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  font-weight: 650;
}
.hp-vmf-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .55rem 0 .7rem;
}
.hp-vmf-gauges .hp-gauge {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .5rem;
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.hp-vmf-gauges .hp-gauge strong {
  font-size: .95rem;
  font-variant-numeric: tabular-nums;
}
.hp-vmf-compare {
  margin: 0 0 .7rem;
  padding: .45rem .55rem .55rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-vmf-compare-row {
  display: grid;
  grid-template-columns: 3.2rem 1fr;
  gap: .4rem;
  align-items: center;
  margin: .28rem 0;
}
.hp-vmf-compare-track {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-vmf-compare-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 999px;
  transition: width .2s ease;
}
.hp-vmf-compare-pct { background: color-mix(in srgb, var(--brand) 75%, #64748b); }
.hp-vmf-compare-lines { background: color-mix(in srgb, #0ea5e9 80%, #64748b); }
.hp-vmf-compare-fill.is-bind {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand) 50%, transparent);
  filter: saturate(1.15);
}
.hp-vmf-fill-pots {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem .35rem;
  margin: .45rem 0 0;
}
.hp-vmf-fill-pots .chip-sm {
  font-size: .76rem;
  padding: .18rem .45rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-vmf-fill-pots .chip-sm:disabled {
  opacity: .45;
  cursor: not-allowed;
}
.hp-vmf-bar-wrap { margin: .35rem 0 .45rem; }
.hp-vmf-bar {
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-vmf-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: #dc2626;
  transition: width .2s ease;
}
.hp-vmf-fill.is-mid { background: #f59e0b; }
.hp-vmf-fill.is-ok { background: #16a34a; }
.hp-vmf-fill.is-low { background: #dc2626; }
.hp-vmf-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .84rem;
  margin: .35rem 0 .5rem;
}
.hp-vmf-table th,
.hp-vmf-table td {
  padding: .28rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  text-align: left;
  vertical-align: top;
}
.hp-vmf-table th { font-weight: 600; width: 52%; color: var(--muted, #5b6470); }
.hp-vmf-table td { font-variant-numeric: tabular-nums; text-align: right; }
.hp-vmf-line-sum {
  margin: 0;
  padding-left: 0;
  list-style: none;
  font-size: .84rem;
}
.hp-vmf-line-sum li {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem .45rem;
  justify-content: space-between;
  padding: .22rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-vmf-tip-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-vmf-tip-list li { margin: .2rem 0; }
.hp-vmf-faq details,
.hp-vmf-privacy {
  margin: .55rem 0;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}
.hp-vmf-faq summary,
.hp-vmf-privacy summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
}
.hp-vmf-faq details { margin: .35rem 0; }
.hp-vmf-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 600px) {
  .hp-vmf-gauges { grid-template-columns: 1fr; }
  .hp-vmf-panel {
    position: static;
    max-height: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hp-vmf-fill { transition: none; }
  .hp-vmf-compare-fill { transition: none; }
  .hp-vmf-line { transition: none; }
}

/* —— Utleie-visning (rent_out-visning-utleie · ll_visning) —— */
.hp-lv-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-lv-hero-mascot {
  border-radius: 16px;
  grid-row: 1 / span 2;
}
.hp-lv-hero-copy { min-width: 0; grid-column: 2; }
.hp-lv-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-lv-lead-bullets li { margin: .15rem 0; }
.hp-lv-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  padding: .65rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 70%, var(--brand, #0f766e) 6%);
}
.hp-lv-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-lv-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-lv-how-list li { margin: .2rem 0; }
.hp-lv-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .75rem;
}
.hp-lv-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: color-mix(in srgb, var(--brand, #0f766e) 18%, transparent);
  color: var(--brand, #0f766e);
  vertical-align: middle;
}
.hp-lv-demo-note { margin: 0 0 .75rem; }
.hp-lv-seed-note {
  margin: 0 0 .75rem;
  padding: .45rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, transparent);
}
.hp-lv-dep-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  align-items: center;
  grid-column: 1 / -1;
  margin: -.15rem 0 .15rem;
}
.hp-lv-dep-chips .chip.is-on {
  background: color-mix(in srgb, var(--brand, #0f766e) 18%, transparent);
  border-color: var(--brand, #0f766e);
  font-weight: 700;
}
.hp-lv-dep-warn {
  margin: .45rem 0 0;
  padding: .45rem .65rem;
  border-radius: 10px;
  font-size: .84rem;
  border: 1px solid var(--border);
}
.hp-lv-dep-warn.is-warn {
  background: color-mix(in srgb, #ca8a04 12%, transparent);
  border-color: color-mix(in srgb, #ca8a04 40%, var(--border));
}
.hp-lv-dep-warn.is-ok {
  background: color-mix(in srgb, #16a34a 10%, transparent);
  border-color: color-mix(in srgb, #16a34a 35%, var(--border));
}
.hp-lv-temp-row {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .55rem;
  align-items: center;
  margin: 0 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-lv-temp-badge {
  font-size: .88rem;
  font-weight: 800;
  padding: .2rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  letter-spacing: .02em;
}
.hp-lv-temp-badge.is-ok {
  background: color-mix(in srgb, #16a34a 16%, transparent);
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
  color: #166534;
}
.hp-lv-temp-badge.is-mid {
  background: color-mix(in srgb, #ca8a04 14%, transparent);
  border-color: color-mix(in srgb, #ca8a04 35%, var(--border));
  color: #854d0e;
}
.hp-lv-temp-badge.is-tight {
  background: color-mix(in srgb, #dc2626 12%, transparent);
  border-color: color-mix(in srgb, #dc2626 35%, var(--border));
  color: #991b1b;
}
.hp-lv-patterns,
.hp-lv-warm-strip {
  margin: 0 0 .75rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-lv-pattern-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem .55rem;
}
.hp-lv-pattern-block {
  min-width: 0;
}
.hp-lv-pattern-line {
  margin: .15rem 0 0;
  font-size: .84rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  line-height: 1.35;
}
.hp-lv-layout {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 1.25rem;
  align-items: start;
}
.hp-lv-prep-filters,
.hp-lv-sorts,
.hp-lv-next-presets {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  align-items: center;
  margin: 0 0 .45rem;
}
.hp-lv-fc {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  opacity: .85;
  margin-left: .15rem;
}
.hp-lv-pipeline {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: .3rem;
  margin: 0 0 .75rem;
}
.hp-lv-pipe {
  padding: .35rem .3rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-lv-pipe strong {
  font-size: 1rem;
  font-variant-numeric: tabular-nums;
}
.hp-lv-pipe.is-active {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, transparent);
}
.hp-lv-nextview {
  margin: 0 0 .75rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-lv-draft {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  resize: vertical;
}
.hp-lv-quick-st {
  display: flex;
  flex-wrap: wrap;
  gap: .2rem;
  margin: .35rem 0 .15rem;
}
.hp-lv-seeds {
  margin-top: .75rem;
  padding-top: .55rem;
  border-top: 1px solid var(--border);
}
.hp-lv-section {
  font-size: 1.05rem;
  margin: 1.1rem 0 .45rem;
}
.hp-lv-form-col .hp-lv-section:first-child { margin-top: 0; }
.hp-lv-live {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem .85rem;
  align-items: center;
  margin: .65rem 0 0;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-lv-live-block {
  display: flex;
  flex-direction: column;
  min-width: 4.5rem;
}
.hp-lv-live-num {
  font-size: 1.15rem;
  font-variant-numeric: tabular-nums;
}
.hp-lv-band {
  font-size: .82rem;
  font-weight: 700;
  padding: .25rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
}
.hp-lv-band.is-ok {
  background: color-mix(in srgb, #16a34a 16%, transparent);
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
  color: #166534;
}
.hp-lv-band.is-mid {
  background: color-mix(in srgb, #ca8a04 14%, transparent);
  border-color: color-mix(in srgb, #ca8a04 35%, var(--border));
}
.hp-lv-band.is-tight {
  background: color-mix(in srgb, #dc2626 12%, transparent);
  border-color: color-mix(in srgb, #dc2626 35%, var(--border));
  color: #991b1b;
}
.hp-lv-preplist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .4rem;
}
.hp-lv-preprow {
  display: grid;
  grid-template-columns: 1fr minmax(7.5rem, 9rem);
  gap: .45rem .65rem;
  align-items: center;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-lv-preplab { font-size: .88rem; min-width: 0; }
.hp-lv-prepsel { width: 100%; font-size: .86rem; }
.hp-lv-script {
  display: flex;
  flex-direction: column;
  gap: .35rem;
}
.hp-lv-script-item {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  font-size: .88rem;
  cursor: pointer;
}
.hp-lv-script-item input { margin-top: .2rem; flex-shrink: 0; }
.hp-lv-int-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .35rem 0 .55rem;
}
.hp-lv-int-chip {
  min-width: 2.1rem;
  height: 2.1rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  font-weight: 700;
  cursor: pointer;
}
.hp-lv-int-chip.is-on {
  background: color-mix(in srgb, var(--brand, #0f766e) 22%, transparent);
  border-color: var(--brand, #0f766e);
  color: var(--brand, #0f766e);
}
.hp-lv-dim-val {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  margin-left: .35rem;
}
.hp-lv-signals {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
}
.hp-lv-signal {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  padding: .28rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  font-size: .82rem;
  cursor: pointer;
  background: var(--bg-elev, #fff);
}
.hp-lv-signal.is-warm:has(input:checked) {
  background: color-mix(in srgb, #16a34a 14%, transparent);
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
}
.hp-lv-signal.is-cold:has(input:checked) {
  background: color-mix(in srgb, #64748b 16%, transparent);
}
.hp-lv-panel {
  position: sticky;
  top: .75rem;
  padding: .85rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 4%);
}
.hp-lv-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: .5rem;
  margin-bottom: .55rem;
}
.hp-lv-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin-bottom: .75rem;
}
.hp-lv-gauge {
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
  display: flex;
  flex-direction: column;
}
.hp-lv-gauge strong {
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
}
.hp-lv-hints,
.hp-lv-followups {
  margin: 0 0 .75rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-lv-hint-list,
.hp-lv-fu-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-lv-hint-list li,
.hp-lv-fu-list li { margin: .2rem 0; }
.hp-lv-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin: 0 0 .55rem;
}
.hp-lv-list {
  display: flex;
  flex-direction: column;
  gap: .55rem;
  margin-bottom: .75rem;
  max-height: 28rem;
  overflow: auto;
}
.hp-lv-card {
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-lv-card.is-warm {
  border-color: color-mix(in srgb, #16a34a 35%, var(--border));
}
.hp-lv-card.is-cold { opacity: .78; }
.hp-lv-card.is-demo {
  border-style: dashed;
}
.hp-lv-card-top {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  align-items: baseline;
}
.hp-lv-card-int {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  font-size: .9rem;
}
.hp-lv-card-int.is-ok { color: #166534; }
.hp-lv-card-int.is-mid { color: #a16207; }
.hp-lv-card-int.is-tight { color: #991b1b; }
.hp-lv-card-meta { margin: .15rem 0 0; }
.hp-lv-card-sigs { margin: .3rem 0 0; }
.hp-lv-pill {
  display: inline-block;
  font-size: .72rem;
  padding: .1rem .4rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, transparent);
  margin: .1rem .15rem 0 0;
}
.hp-lv-card-notes { margin: .3rem 0 0; }
.hp-lv-card-next {
  margin: .3rem 0 0;
  font-size: .84rem;
}
.hp-lv-card-next.is-done {
  text-decoration: line-through;
  opacity: .7;
}
.hp-lv-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  margin-top: .4rem;
}
.hp-lv-commit {
  margin-top: .5rem;
  padding-top: .55rem;
  border-top: 1px solid var(--border);
}
.hp-lv-commit-text {
  width: 100%;
  font-size: .8rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  resize: vertical;
}
.hp-lv-nonadvice {
  margin-top: .65rem;
  font-size: .78rem;
}
.hp-lv-faq details {
  margin: .4rem 0;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}
.hp-lv-faq summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
}
@media (max-width: 900px) {
  .hp-lv-layout { grid-template-columns: 1fr; }
  .hp-lv-panel { position: static; }
  .hp-lv-pipeline { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 600px) {
  .hp-lv-hero { grid-template-columns: 1fr; }
  .hp-lv-hero-copy { grid-column: 1; }
  .hp-lv-hero-mascot { grid-row: auto; width: 64px; height: 64px; }
  .hp-lv-preprow { grid-template-columns: 1fr; }
  .hp-lv-gauges { grid-template-columns: 1fr 1fr; }
  .hp-lv-pipeline { grid-template-columns: repeat(2, 1fr); }
  .hp-lv-pattern-grid { grid-template-columns: 1fr; }
}


/* —— Utleie-visning extras (overdue · hist · progress · SMS · JSON) —— */
.hp-lv-progress {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin: .45rem 0 .15rem;
}
.hp-lv-progress-track {
  flex: 1;
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-lv-progress-fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand, #0f766e) 70%, #94a3b8);
  transition: width .2s ease;
}
.hp-lv-progress-fill.is-ok { background: color-mix(in srgb, #16a34a 75%, transparent); }
.hp-lv-progress-fill.is-mid { background: color-mix(in srgb, #ca8a04 70%, transparent); }
.hp-lv-progress-fill.is-tight { background: color-mix(in srgb, #dc2626 65%, transparent); }
.hp-lv-mobile-jump { display: none; }
@media (max-width: 900px) {
  .hp-lv-mobile-jump { display: flex; }
}
.hp-lv-preprow.is-ok {
  border-color: color-mix(in srgb, #16a34a 35%, var(--border));
  background: color-mix(in srgb, #16a34a 6%, var(--bg-elev, #fff));
}
.hp-lv-preprow.is-na { opacity: .72; }
.hp-lv-preprow.is-todo {
  border-color: color-mix(in srgb, #ca8a04 30%, var(--border));
}
.hp-lv-script-item.is-done {
  border-color: color-mix(in srgb, #16a34a 35%, var(--border));
  background: color-mix(in srgb, #16a34a 7%, var(--bg-elev, #fff));
}
.hp-lv-hist {
  margin: 0 0 .75rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fff);
}
.hp-lv-hist-bars {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: .35rem;
  align-items: end;
  min-height: 4.2rem;
}
.hp-lv-hist-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .15rem;
  min-width: 0;
  height: 4.2rem;
  justify-content: flex-end;
}
.hp-lv-hist-bar {
  width: 70%;
  min-height: 2px;
  border-radius: 6px 6px 2px 2px;
  background: color-mix(in srgb, var(--brand, #0f766e) 55%, #94a3b8);
}
.hp-lv-hist-n {
  font-size: .75rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.hp-lv-overdue {
  margin: 0 0 .75rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #dc2626 35%, var(--border));
  background: color-mix(in srgb, #dc2626 7%, var(--bg, #fff));
}
.hp-lv-od-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .35rem;
  border-radius: 6px;
  background: color-mix(in srgb, #dc2626 16%, transparent);
  color: #991b1b;
  vertical-align: middle;
}
.hp-lv-card.is-overdue {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, #dc2626 12%, transparent);
}
.hp-lv-card-next.is-overdue {
  color: #991b1b;
  font-weight: 600;
}
.hp-lv-fu-list li.is-overdue,
.hp-lv-hint-list li.is-overdue {
  color: #991b1b;
}
.hp-lv-json-import {
  width: 100%;
  margin-top: .4rem;
  font-size: .8rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  resize: vertical;
}
[data-lv-sms-count].is-warn {
  color: #854d0e;
  font-weight: 700;
}

/* —— Depositum som utleier (rent_out-depositum-utleier · ll_deposit) —— */
.hp-ld { margin: 0; }
.hp-ld-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-ld-hero-copy { min-width: 0; grid-column: 1; }
.hp-ld-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  width: 72px; height: 72px;
  object-fit: contain;
  border-radius: 50%;
  justify-self: end;
}
.hp-ld-how { grid-column: 1 / -1; }
.hp-ld-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-ld-lead-bullets li { margin: .2rem 0; }
.hp-ld-how {
  margin-top: .35rem;
  padding: .55rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-ld-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-ld-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-ld-how-list li { margin: .2rem 0; }
.hp-ld-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #f59e0b) 22%, transparent);
  color: color-mix(in srgb, var(--accent, #b45309) 80%, var(--text));
  vertical-align: middle;
}
.hp-ld-demo-note {
  margin: .35rem 0 .65rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--accent, #f59e0b) 45%, var(--border));
  background: color-mix(in srgb, var(--accent, #f59e0b) 8%, var(--bg));
}
.hp-ld-seed-hint {
  margin: 0 0 .75rem;
  padding: .45rem .7rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, var(--bg));
  font-size: .86rem;
}
.hp-ld-m-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-ld-m-chips .chip {
  font-size: .78rem;
  padding: .2rem .5rem;
}
.hp-ld-m-chips .chip.active,
.hp-ld-m-chips .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg));
  color: var(--brand);
  font-weight: 650;
}
.hp-ld-form-banner {
  margin: .55rem 0 .35rem;
  padding: .5rem .7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 30%, var(--bg-elev, #fff));
}
.hp-ld-form-banner.is-risk {
  border-color: #fca5a5;
  background: #fef2f2;
  color: #991b1b;
}
.hp-ld-form-banner.is-warn {
  border-color: #fde68a;
  background: #fffbeb;
  color: #92400e;
}
.hp-ld-form-banner.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
  color: #166534;
}
.hp-ld-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .4rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-ld-filter-row .chip.active,
.hp-ld-filter-row .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg));
  color: var(--brand);
  font-weight: 650;
}
.hp-ld-check {
  display: flex;
  gap: .45rem;
  align-items: flex-start;
  font-size: .9rem;
  cursor: pointer;
}
.hp-ld-check input { margin-top: .2rem; }
.hp-ld-safe-row.is-ok {
  border-color: #86efac;
  background: color-mix(in srgb, #dcfce7 55%, var(--bg-elev, #fff));
}
.hp-ld-safe-row.is-warn {
  border-color: #fde68a;
  background: color-mix(in srgb, #fef9c3 50%, var(--bg-elev, #fff));
}
.hp-ld-safe-row.is-bad {
  border-color: #fca5a5;
  background: color-mix(in srgb, #fee2e2 55%, var(--bg-elev, #fff));
}
.hp-ld-safe-row.is-open {
  border-style: dashed;
}
.hp-ld-safe-row.is-na {
  opacity: .72;
}
.hp-ld-safe-row.is-flash {
  outline: 2px solid var(--brand, #0f766e);
  outline-offset: 2px;
  transition: outline-color .2s;
}
.hp-ld-draft {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .82rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
  color: var(--text);
}
.hp-ld-cash {
  margin: .7rem 0;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev, #fff));
}
.hp-ld-cash-num {
  margin: .15rem 0 .35rem;
  font-size: 1.25rem;
}
.hp-ld-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .86rem;
}
.hp-ld-table th {
  text-align: left;
  font-weight: 550;
  padding: .2rem .3rem .2rem 0;
  color: var(--muted);
}
.hp-ld-table td {
  text-align: right;
  padding: .2rem 0;
  font-variant-numeric: tabular-nums;
}
.hp-ld-tr-total th,
.hp-ld-tr-total td {
  font-weight: 700;
  border-top: 1px solid var(--border);
  padding-top: .35rem;
}
.hp-ld-next-btn {
  appearance: none;
  border: 0;
  background: none;
  color: var(--brand, #0f766e);
  font: inherit;
  font-weight: 600;
  text-align: left;
  padding: 0;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hp-ld-next-btn:hover { color: color-mix(in srgb, var(--brand, #0f766e) 80%, #000); }
.hp-ld-next-link {
  color: var(--brand, #0f766e);
  font-weight: 600;
}
.hp-ld-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
  margin: 0 0 .75rem;
}
.hp-ld-demos .chip { font-size: .8rem; }
.hp-ld-demos .chip.active,
.hp-ld-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg));
  color: var(--brand);
}
.hp-ld-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-ld-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.85fr);
  gap: 1rem;
  align-items: start;
}
.hp-ld-main { order: 1; min-width: 0; }
.hp-ld-panel {
  order: 2;
  position: sticky;
  top: 4.5rem;
  padding: 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  box-shadow: var(--shadow, 0 2px 12px rgba(0,0,0,.06));
}
.hp-ld-section {
  margin: 1.1rem 0 .45rem;
  font-size: 1.02rem;
  font-weight: 750;
  letter-spacing: -0.02em;
}
.hp-ld-section:first-child { margin-top: 0; }
.hp-ld-safe-list,
.hp-ld-rf-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: .45rem;
}
.hp-ld-safe-row {
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev, #fff));
}
.hp-ld-safe-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .65rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-ld-safe-label { flex: 1; min-width: 160px; }
.hp-ld-st-wrap { flex-shrink: 0; }
.hp-ld-st {
  font: inherit;
  font-size: .86rem;
  padding: .4rem .5rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  min-width: 9.5rem;
}
.hp-ld-rf-item {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  font-size: .9rem;
  cursor: pointer;
}
.hp-ld-rf-item:has(input:checked) {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-ld-rf-item input { margin-top: .15rem; accent-color: #dc2626; }
[data-ld-hold-block].is-dim,
[data-ld-return-block].is-dim {
  opacity: .72;
}
[data-ld-hold-block].is-focus,
[data-ld-return-block].is-focus {
  opacity: 1;
  outline: 1px solid color-mix(in srgb, var(--brand) 25%, var(--border));
  outline-offset: 4px;
  border-radius: 12px;
  padding: .15rem .2rem .35rem;
}
.hp-ld-live { text-align: center; margin-bottom: .65rem; }
.hp-ld-live .hp-bid-num { margin: .15rem 0; }
.hp-ld-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .78rem;
}
.hp-ld-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin-bottom: .65rem;
}
.hp-ld-gauges .hp-gauge {
  padding: .45rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, transparent);
}
.hp-ld-gauges .hp-gauge strong { font-size: .92rem; display: block; }
.hp-ld-readiness {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .65rem .75rem;
  margin-bottom: .75rem;
  background: #f8fafc;
}
.hp-ld-readiness.is-ok { border-color: #86efac; background: #f0fdf4; }
.hp-ld-readiness.is-check { border-color: #fde68a; background: #fffbeb; }
.hp-ld-readiness.is-stop { border-color: #fca5a5; background: #fef2f2; }
.hp-ld-ready-title {
  margin: 0 0 .25rem;
  font-weight: 750;
  font-size: .98rem;
}
.hp-ld-bar-wrap { margin: .55rem 0 .75rem; }
.hp-ld-bar {
  position: relative;
  height: 12px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-ld-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #38bdf8;
  transition: width .2s ease, background .2s ease;
}
.hp-ld-fill.is-ok { background: #4ade80; }
.hp-ld-fill.is-mid { background: #fbbf24; }
.hp-ld-fill.is-high { background: #f87171; }
.hp-ld-mark {
  position: absolute;
  top: 0; bottom: 0;
  width: 2px;
  background: color-mix(in srgb, var(--text) 35%, transparent);
  transform: translateX(-50%);
}
.hp-ld-mark-max { background: color-mix(in srgb, #dc2626 55%, transparent); }
.hp-ld-bar-labels {
  display: flex;
  justify-content: space-between;
  font-size: .72rem;
  color: var(--muted);
  margin-top: .2rem;
}
.hp-ld-phase-box,
.hp-ld-next,
.hp-ld-alerts,
.hp-ld-commit {
  margin: .7rem 0;
  padding-top: .35rem;
  border-top: 1px solid var(--border);
}
.hp-ld-next-ol {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-ld-next-ol li { margin: .25rem 0; }
.hp-ld-alert-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-ld-alert-list li { margin: .25rem 0; }
.hp-ld-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 8rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-ld-privacy {
  margin-top: .85rem;
  font-size: .88rem;
}
.hp-ld-privacy summary { cursor: pointer; font-weight: 600; }
.hp-ld-faq details { margin: .35rem 0; }
.hp-ld-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-ld-faq details p { margin: .35rem 0 .15rem; }
.hp-ld-date-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .3rem;
}
.hp-ld-date-chips .chip { font-size: .75rem; padding: .15rem .45rem; }
.hp-ld-formula {
  margin: .45rem 0 .55rem;
  padding: .45rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, var(--bg));
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
}
.hp-ld-fc {
  display: inline-block;
  min-width: 1.1em;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  opacity: .85;
}
.hp-ld-subh {
  margin: .75rem 0 .35rem;
  font-size: .95rem;
  font-weight: 700;
}
.hp-ld-trekk {
  margin-top: .55rem;
  padding: .65rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 30%, var(--bg-elev, #fff));
}
.hp-ld-trekk-sum {
  margin: .45rem 0 0;
  padding: .35rem .5rem;
  border-radius: 8px;
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, transparent);
  font-weight: 600;
}
.hp-ld-subject-row {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
}
.hp-ld-subject-row input {
  flex: 1 1 12rem;
  min-width: 0;
}
.hp-ld-seed-row {
  align-items: center;
}
.hp-ld-score-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin: 0 0 .7rem;
  padding: .5rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, transparent);
}
.hp-ld-score-ring {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 50%;
  border: 3px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-ld-score-ring strong {
  font-size: 1.25rem;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.hp-ld-score-ring.is-ok { border-color: #4ade80; background: #f0fdf4; }
.hp-ld-score-ring.is-check { border-color: #fbbf24; background: #fffbeb; }
.hp-ld-score-ring.is-stop { border-color: #f87171; background: #fef2f2; }
.hp-ld-return-box {
  margin: .7rem 0;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev, #fff));
}
.hp-ld-stack {
  display: flex;
  height: 10px;
  border-radius: 999px;
  overflow: hidden;
  margin-top: .45rem;
  background: color-mix(in srgb, var(--border) 60%, var(--bg));
}
.hp-ld-stack-ret {
  display: block;
  height: 100%;
  background: #4ade80;
  transition: width .2s ease;
}
.hp-ld-stack-tk {
  display: block;
  height: 100%;
  background: #f87171;
  transition: width .2s ease;
}
@media (max-width: 900px) {
  .hp-ld-layout { grid-template-columns: 1fr; }
  .hp-ld-panel { position: static; order: 0; }
  .hp-ld-main { order: 1; }
}
@media (max-width: 560px) {
  .hp-ld-hero { grid-template-columns: 1fr; }
  .hp-ld-hero-copy { grid-column: 1; }
  .hp-ld-hero-mascot { grid-column: 1; grid-row: auto; justify-self: start; }
  .hp-ld-gauges { grid-template-columns: 1fr; }
  .hp-ld-st { min-width: 100%; width: 100%; }
  .hp-ld-safe-top { flex-direction: column; }
  .hp-ld-subject-row { flex-direction: column; align-items: stretch; }
}
.hp-ld-int-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-ld-int-chips .chip.active,
.hp-ld-int-chips .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg));
  color: var(--brand);
  font-weight: 650;
}
.hp-ld-rail {
  margin: .55rem 0 .65rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev, #fff));
}
.hp-ld-rail-track {
  position: relative;
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  margin: .45rem 0 .35rem;
}
.hp-ld-rail-fill {
  position: absolute;
  top: 0; bottom: 0;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand, #0f766e) 45%, #38bdf8);
  transition: left .2s ease, width .2s ease;
}
.hp-ld-rail-dot {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  border: 2px solid var(--bg-elev, #fff);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--text) 20%, transparent);
}
.hp-ld-rail-dot.is-recv { background: #38bdf8; }
.hp-ld-rail-dot.is-today { background: var(--brand, #0f766e); }
.hp-ld-rail-dot.is-retur { background: #f59e0b; }
.hp-ld-rail-labels {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  font-size: .72rem;
  color: var(--muted);
}
.hp-ld-progress {
  margin: 0 0 .7rem;
  padding: .5rem .6rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, transparent);
}
.hp-ld-progress-bar {
  display: flex;
  height: 10px;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--border) 60%, var(--bg));
}
.hp-ld-progress-ok { background: #4ade80; transition: width .2s ease; }
.hp-ld-progress-warn { background: #fbbf24; transition: width .2s ease; }
.hp-ld-progress-bad { background: #f87171; transition: width .2s ease; }
.hp-ld-progress-open { background: color-mix(in srgb, var(--muted, #94a3b8) 55%, transparent); transition: width .2s ease; }


/* —— Husordensregler utleier (rent_out-husordensregler · ll_house) —— */
.hp-lh { margin: 0; }
.hp-lh-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-lh-hero-copy { min-width: 0; grid-column: 1; }
.hp-lh-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  width: 72px; height: 72px;
  object-fit: contain;
  border-radius: 50%;
  justify-self: end;
}
.hp-lh-how { grid-column: 1 / -1; }
.hp-lh-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-lh-lead-bullets li { margin: .2rem 0; }
.hp-lh-how {
  margin-top: .35rem;
  padding: .55rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-lh-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-lh-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-lh-how-list li { margin: .2rem 0; }
.hp-lh-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #f59e0b) 22%, transparent);
  color: color-mix(in srgb, var(--accent, #b45309) 80%, var(--text));
  vertical-align: middle;
}
.hp-lh-demo-note {
  margin: .35rem 0 .65rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--accent, #f59e0b) 45%, var(--border));
  background: color-mix(in srgb, var(--accent, #f59e0b) 8%, var(--bg));
}
.hp-lh-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
  margin: 0 0 .75rem;
}
.hp-lh-demos .chip { font-size: .8rem; }
.hp-lh-demos .chip.active,
.hp-lh-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg));
  color: var(--brand);
}
.hp-lh-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-lh-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .9fr);
  gap: 1rem 1.25rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-lh-layout { grid-template-columns: 1fr; }
  .hp-lh-panel { position: static; order: 0; }
  .hp-lh-main { order: 1; }
}
.hp-lh-section {
  margin: 1.1rem 0 .55rem;
  font-size: 1.05rem;
}
.hp-lh-main .hp-lh-section:first-child { margin-top: 0; }
.hp-lh-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-lh-filters .chip.is-on,
.hp-lh-filters .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg));
}
.hp-lh-filter-count { margin: 0 0 .5rem; }
.hp-lh-cat { margin: 0 0 1rem; }
.hp-lh-cat-title {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  margin: 0 0 .25rem;
  font-size: .98rem;
}
.hp-lh-cat-pct {
  font-size: .78rem;
  font-weight: 700;
  color: var(--muted);
  padding: .08rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 55%, transparent);
}
.hp-lh-cat-help { margin: 0 0 .5rem; }
.hp-lh-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .55rem;
}
.hp-lh-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem .65rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--bg));
}
.hp-lh-row.is-critical {
  border-color: color-mix(in srgb, var(--brand) 28%, var(--border));
}
.hp-lh-row.is-gap {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 7%, var(--bg));
}
.hp-lh-row.is-ok {
  border-color: color-mix(in srgb, #22c55e 35%, var(--border));
}
.hp-lh-row.is-draft {
  border-color: color-mix(in srgb, #3b82f6 30%, var(--border));
}
.hp-lh-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-lh-label { flex: 1 1 12rem; min-width: 0; }
.hp-lh-crit-badge {
  display: inline-block;
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .35rem;
  border-radius: 999px;
  margin-right: .3rem;
  vertical-align: middle;
  background: color-mix(in srgb, var(--brand) 16%, transparent);
  color: var(--brand);
}
.hp-lh-st-wrap { flex: 0 0 auto; }
.hp-lh-st {
  min-width: 8.5rem;
  font-size: .86rem;
}
.hp-lh-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 2.6rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .4rem .5rem;
  background: var(--bg);
}
.hp-lh-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-lh-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .95rem 1rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--bg));
  box-shadow: 0 1px 0 color-mix(in srgb, var(--text) 4%, transparent);
}
.hp-lh-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin-bottom: .75rem;
}
.hp-lh-gauge {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-lh-gauge strong {
  display: block;
  font-size: 1.05rem;
  margin: .1rem 0;
}
.hp-lh-readiness {
  margin: .55rem 0 .7rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}
.hp-lh-readiness.is-ok {
  border-color: color-mix(in srgb, #22c55e 40%, var(--border));
  background: color-mix(in srgb, #22c55e 10%, var(--bg));
}
.hp-lh-readiness.is-mid {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 9%, var(--bg));
}
.hp-lh-readiness.is-tight {
  border-color: color-mix(in srgb, #ef4444 40%, var(--border));
  background: color-mix(in srgb, #ef4444 9%, var(--bg));
}
.hp-lh-ready-title {
  margin: 0 0 .25rem;
  font-weight: 750;
  font-size: .95rem;
}
.hp-lh-flags-box,
.hp-lh-next,
.hp-lh-commit {
  margin: .7rem 0;
  padding-top: .35rem;
  border-top: 1px solid var(--border);
}
.hp-lh-flags-ul,
.hp-lh-next-ol {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-lh-flags-ul li,
.hp-lh-next-ol li { margin: .25rem 0; }
.hp-lh-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 10rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-lh-nonadvice {
  margin-top: .65rem;
  font-size: .8rem;
}
.hp-lh-faq details { margin: .35rem 0; }
.hp-lh-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-lh-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 560px) {
  .hp-lh-hero { grid-template-columns: 1fr; }
  .hp-lh-hero-copy { grid-column: 1; }
  .hp-lh-hero-mascot { grid-column: 1; grid-row: auto; justify-self: start; }
  .hp-lh-gauges { grid-template-columns: 1fr; }
  .hp-lh-st { min-width: 100%; width: 100%; }
  .hp-lh-row-top { flex-direction: column; }
}

/* —— Ledighetsplan (rent_out-ledighetsplan · vacancy_plan) —— */
.hp-ldp { margin-top: .25rem; }
.hp-ldp-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-ldp-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-ldp-hero-copy { min-width: 0; }
.hp-ldp-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  color: var(--muted, #5b6470);
}
.hp-ldp-lead-bullets li { margin: .2rem 0; }
.hp-ldp-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-ldp-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-ldp-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-ldp-how-list li { margin: .2rem 0; }
.hp-ldp-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  color: var(--brand);
  vertical-align: middle;
}
.hp-ldp-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .45rem;
  margin: 0 0 .65rem;
}
.hp-ldp-demos .chip {
  font-size: .82rem;
  padding: .28rem .65rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-ldp-demos .chip:hover,
.hp-ldp-demos .chip.active,
.hp-ldp-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-ldp-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-ldp-demo-note { margin: 0 0 .65rem; }
.hp-ldp-quick {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .4rem;
  margin: 0 0 .35rem;
}
.hp-ldp-quick .chip-sm {
  font-size: .78rem;
  padding: .2rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-ldp-quick .chip-sm[aria-pressed="true"],
.hp-ldp-quick .chip-sm.active {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-ldp-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.95fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 820px) {
  .hp-ldp-layout {
    grid-template-columns: 1fr;
    display: flex;
    flex-direction: column;
  }
  .hp-ldp-panel { order: -1; }
  .hp-ldp-hero { grid-template-columns: 1fr; }
  .hp-ldp-hero-mascot { width: 56px; height: 56px; }
}
.hp-ldp-section {
  margin: 1rem 0 .45rem;
  font-size: .95rem;
  letter-spacing: -0.01em;
}
.hp-ldp-main .hp-ldp-section:first-child { margin-top: 0; }
.hp-ldp-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem 1rem;
  background: var(--bg-elev, #fff);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 60%, transparent);
}
.hp-ldp-live {
  margin: 0 0 .75rem;
  padding-bottom: .65rem;
  border-bottom: 1px solid var(--border);
}
.hp-ldp-live .hp-bid-num {
  font-size: 1.65rem;
  font-weight: 750;
  letter-spacing: -0.02em;
  line-height: 1.15;
  margin: .15rem 0;
}
.hp-ldp-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .78rem;
  opacity: .9;
}
.hp-ldp-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: 0 0 .85rem;
}
.hp-ldp-gauges .hp-gauge {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .5rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-ldp-gauges .hp-gauge strong {
  display: block;
  font-size: .98rem;
  margin-top: .1rem;
}
.hp-ldp-timeline { margin: 0 0 .85rem; }
.hp-ldp-stack-bar {
  display: flex;
  height: 12px;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--border) 50%, var(--bg));
  margin-bottom: .4rem;
}
.hp-ldp-seg { display: block; height: 100%; min-width: 2px; }
.hp-ldp-seg-exit { background: #6b7c93; }
.hp-ldp-seg-prep { background: #3d8bfd; }
.hp-ldp-seg-market { background: #20c997; }
.hp-ldp-seg-sign { background: #f59f00; }
.hp-ldp-seg-movein { background: #ae3ec9; }
.hp-ldp-seg-extra { background: #868e96; }
.hp-ldp-seg-empty { background: color-mix(in srgb, var(--border) 70%, transparent); }
.hp-ldp-legend {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: .78rem;
  color: var(--muted, #5b6470);
  display: flex;
  flex-wrap: wrap;
  gap: .2rem .75rem;
}
.hp-ldp-legend li { display: inline-flex; align-items: center; gap: .3rem; }
.hp-ldp-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.hp-ldp-dot.hp-ldp-seg-exit { background: #6b7c93; }
.hp-ldp-dot.hp-ldp-seg-prep { background: #3d8bfd; }
.hp-ldp-dot.hp-ldp-seg-market { background: #20c997; }
.hp-ldp-dot.hp-ldp-seg-sign { background: #f59f00; }
.hp-ldp-dot.hp-ldp-seg-movein { background: #ae3ec9; }
.hp-ldp-dot.hp-ldp-seg-extra { background: #868e96; }
.hp-ldp-breakdown,
.hp-ldp-scen,
.hp-ldp-buffer,
.hp-ldp-tips { margin: 0 0 .85rem; }
.hp-ldp-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .84rem;
}
.hp-ldp-table th,
.hp-ldp-table td {
  text-align: left;
  padding: .28rem .2rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  vertical-align: top;
}
.hp-ldp-table th { font-weight: 550; color: var(--muted, #5b6470); width: 58%; }
.hp-ldp-table td { text-align: right; font-variant-numeric: tabular-nums; }
.hp-ldp-table thead th {
  font-size: .78rem;
  font-weight: 650;
  color: var(--text, #1a1d21);
  text-align: right;
}
.hp-ldp-table thead th:first-child { text-align: left; }
.hp-ldp-tr-strong th,
.hp-ldp-tr-strong td { font-weight: 700; color: var(--text, #1a1d21); }
.hp-ldp-buf-bar-wrap { margin: 0 0 .35rem; }
.hp-ldp-buf-bar {
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 55%, var(--bg));
  overflow: hidden;
}
.hp-ldp-buf-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 75%, #888);
  transition: width .2s ease;
}
.hp-ldp-buf-fill.is-ok { background: #2f9e44; }
.hp-ldp-buf-fill.is-low { background: #e67700; }
.hp-ldp-tip-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  color: var(--muted, #5b6470);
}
.hp-ldp-tip-list li { margin: .25rem 0; }
.hp-ldp-faq,
.hp-ldp-privacy {
  margin-top: .85rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev, #fff));
}
.hp-ldp-faq > summary,
.hp-ldp-privacy > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-ldp-faq details {
  margin: .4rem 0 0;
  padding: .25rem 0 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-ldp-faq details summary {
  cursor: pointer;
  font-weight: 550;
  font-size: .84rem;
}
.hp-ldp-faq details p { margin: .35rem 0 .15rem; }
.hp-ldp-actions .btn,
.hp-ldp-actions a.btn { margin: 0; }
@media (max-width: 520px) {
  .hp-ldp-gauges { grid-template-columns: 1fr; }
  .hp-ldp-panel { position: static; }
}
@media (min-width: 821px) {
  .hp-ldp-hero { grid-template-columns: 72px 1fr; }
  .hp-ldp-panel { scroll-behavior: auto; }
}
.hp-ldp-seed-hint {
  margin: 0 0 .65rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg));
}
.hp-ldp-date-quick,
.hp-ldp-whatif {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem .35rem;
  margin: .35rem 0 0;
}
.hp-ldp-phase-sum {
  margin-left: .25rem;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
}
.hp-ldp-checks {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .35rem;
}
.hp-ldp-check {
  display: flex;
  align-items: flex-start;
  gap: .5rem;
  font-size: .88rem;
  cursor: pointer;
  padding: .35rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-ldp-check input { margin-top: .15rem; flex-shrink: 0; }
.hp-ldp-check:has(input:checked) {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-ldp-status-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .6rem;
  margin: 0 0 .55rem;
}
.hp-ldp-status {
  display: inline-block;
  font-size: .75rem;
  font-weight: 750;
  letter-spacing: .03em;
  text-transform: uppercase;
  padding: .18rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--border) 35%, var(--bg-elev));
}
.hp-ldp-status[data-status="klar"] {
  border-color: color-mix(in srgb, #2f9e44 50%, var(--border));
  background: color-mix(in srgb, #2f9e44 16%, var(--bg-elev));
  color: #1b6b2a;
}
.hp-ldp-status[data-status="sjekk"] {
  border-color: color-mix(in srgb, #f59f00 50%, var(--border));
  background: color-mix(in srgb, #f59f00 16%, var(--bg-elev));
  color: #8a5a00;
}
.hp-ldp-status[data-status="hull"] {
  border-color: color-mix(in srgb, #e03131 50%, var(--border));
  background: color-mix(in srgb, #e03131 14%, var(--bg-elev));
  color: #9b1c1c;
}
.hp-ldp-formula {
  margin: 0 0 .75rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 55%, var(--bg-elev, #fff));
}
.hp-ldp-formula code {
  display: block;
  font-size: .72rem;
  line-height: 1.35;
  word-break: break-word;
  white-space: pre-wrap;
  color: var(--muted, #5b6470);
}
.hp-ldp-gauges { grid-template-columns: 1fr 1fr; }
.hp-ldp-daterail {
  margin: 0 0 .85rem;
  padding: .45rem .55rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-ldp-rail {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: .8rem;
}
.hp-ldp-rail li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .25rem .4rem;
  padding: .22rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-ldp-rail li:last-child { border-bottom: 0; }
.hp-ldp-rail-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.hp-ldp-rail-dot.hp-ldp-seg-exit { background: #6b7c93; }
.hp-ldp-rail-dot.hp-ldp-seg-prep { background: #3d8bfd; }
.hp-ldp-rail-dot.hp-ldp-seg-market { background: #20c997; }
.hp-ldp-rail-dot.hp-ldp-seg-sign { background: #f59f00; }
.hp-ldp-rail-dot.hp-ldp-seg-movein { background: #ae3ec9; }
.hp-ldp-rail-dot.hp-ldp-seg-extra { background: #868e96; }
.hp-ldp-scen-table .hp-ldp-sc-row {
  cursor: pointer;
  transition: background .12s ease;
}
.hp-ldp-scen-table .hp-ldp-sc-row:hover,
.hp-ldp-scen-table .hp-ldp-sc-row:focus-visible {
  background: color-mix(in srgb, var(--brand) 10%, transparent);
  outline: none;
}
.hp-ldp-scen-table .hp-ldp-sc-row.is-active {
  background: color-mix(in srgb, var(--brand) 14%, transparent);
  font-weight: 650;
}
.hp-ldp-scen-table .hp-ldp-sc-row th { font-weight: inherit; }
.hp-ldp-target-box {
  margin: 0 0 .85rem;
  padding: .45rem .55rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev, #fff));
}
.hp-ldp-target-box.is-over {
  border-color: color-mix(in srgb, #e67700 45%, var(--border));
  background: color-mix(in srgb, #e67700 10%, var(--bg-elev, #fff));
}
.hp-ldp-target-box.is-under {
  border-color: color-mix(in srgb, #2f9e44 40%, var(--border));
  background: color-mix(in srgb, #2f9e44 8%, var(--bg-elev, #fff));
}
.hp-ldp-fill-bufs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem .35rem;
  margin: .45rem 0 0;
}
.hp-ldp-fill-bufs .chip-sm {
  font-size: .78rem;
  padding: .2rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-ldp-fill-bufs .chip-sm:disabled {
  opacity: .45;
  cursor: not-allowed;
}
.hp-ldp-fill-bufs .chip-sm:not(:disabled):hover {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-ldp-actions-list {
  margin: 0 0 .85rem;
}
.hp-ldp-status[data-status="empty"],
.hp-ldp-status[data-status="mangler"] {
  border-color: color-mix(in srgb, var(--border) 80%, #888);
  background: color-mix(in srgb, var(--border) 25%, var(--bg-elev));
  color: var(--muted, #5b6470);
}
.hp-ldp-comp-wrap {
  margin: 0 0 .85rem;
}
.hp-ldp-comp-bar {
  display: flex;
  height: 12px;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--border) 55%, transparent);
  margin: 0 0 .4rem;
}
.hp-ldp-comp-seg { display: block; height: 100%; min-width: 2px; }
.hp-ldp-comp-lost { background: #e03131; }
.hp-ldp-comp-fixed { background: #f59f00; }
.hp-ldp-comp-once { background: #7048e8; }
.hp-ldp-comp-empty { background: color-mix(in srgb, var(--border) 70%, transparent); }
.hp-ldp-dot.hp-ldp-comp-lost { background: #e03131; }
.hp-ldp-dot.hp-ldp-comp-fixed { background: #f59f00; }
.hp-ldp-dot.hp-ldp-comp-once { background: #7048e8; }
.hp-ldp-compare { margin: 0 0 .85rem; }
.hp-ldp-cmp-table tbody tr[data-ldp-cmp-row]:not(.is-active) {
  cursor: pointer;
}
.hp-ldp-cmp-table tbody tr[data-ldp-cmp-row]:not(.is-active):hover,
.hp-ldp-cmp-table tbody tr[data-ldp-cmp-row]:not(.is-active):focus-visible {
  background: color-mix(in srgb, var(--brand, #0b7285) 10%, transparent);
}
.hp-ldp-cmp-table tbody tr.is-active {
  background: color-mix(in srgb, var(--brand, #0b7285) 14%, transparent);
  font-weight: 600;
}
.hp-ldp-cmp-table td { font-variant-numeric: tabular-nums; }

/* —— Utleieforsikring-sjekk (rent_out-forsikring-utleie · ll_ins) —— */
.hp-li { margin: 0; }
.hp-li-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-li-hero-copy { min-width: 0; grid-column: 1; }
.hp-li-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  width: 72px; height: 72px;
  object-fit: contain;
  border-radius: 50%;
  justify-self: end;
}
.hp-li-how { grid-column: 1 / -1; }
.hp-li-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-li-lead-bullets li { margin: .2rem 0; }
.hp-li-how {
  margin-top: .35rem;
  padding: .55rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-li-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-li-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-li-how-list li { margin: .2rem 0; }
.hp-li-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #f59e0b) 22%, transparent);
  color: color-mix(in srgb, var(--accent, #b45309) 80%, var(--text));
  vertical-align: middle;
}
.hp-li-demo-note {
  margin: .35rem 0 .65rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--accent, #f59e0b) 45%, var(--border));
  background: color-mix(in srgb, var(--accent, #f59e0b) 8%, var(--bg));
}
.hp-li-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
  margin: 0 0 .75rem;
}
.hp-li-demos .chip { font-size: .8rem; }
.hp-li-demos .chip.active,
.hp-li-demos .chip[aria-pressed="true"],
.hp-li-prem-quick .chip.active,
.hp-li-prem-quick .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg));
  color: var(--brand);
}
.hp-li-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-li-prem-quick,
.hp-li-date-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-li-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .4rem;
  align-items: center;
  margin: 0 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-li-filter-bar .chip.active,
.hp-li-filter-bar .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg));
  color: var(--brand);
  font-weight: 650;
}
.hp-li-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.85fr);
  gap: 1rem;
  align-items: start;
}
.hp-li-main { order: 1; min-width: 0; }
.hp-li-panel {
  order: 2;
  position: sticky;
  top: 4.5rem;
  padding: 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  box-shadow: var(--shadow, 0 2px 12px rgba(0,0,0,.06));
  max-height: calc(100vh - 5.5rem);
  overflow: auto;
}
.hp-li-section {
  margin: 1.1rem 0 .45rem;
  font-size: 1.02rem;
  font-weight: 750;
  letter-spacing: -0.02em;
}
.hp-li-section:first-child { margin-top: 0; }
.hp-li-cov-list,
.hp-li-rf-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: .45rem;
}
.hp-li-cov-row {
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev, #fff));
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.hp-li-cov-row[data-li-cov-st="ok"] {
  border-color: color-mix(in srgb, #16a34a 35%, var(--border));
}
.hp-li-cov-row[data-li-cov-st="warn"] {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
}
.hp-li-cov-row[data-li-cov-st="bad"] {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #fef2f2 55%, var(--bg-elev, #fff));
}
.hp-li-cov-row[data-li-cov-st="na"] {
  opacity: .72;
}
.hp-li-cov-row.is-jump {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 28%, transparent);
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev, #fff));
}
.hp-li-cov-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .65rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-li-cov-label { flex: 1; min-width: 160px; }
.hp-li-st-wrap { flex-shrink: 0; }
.hp-li-st {
  font: inherit;
  font-size: .86rem;
  padding: .4rem .5rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  min-width: 9.5rem;
}
.hp-li-rf-item {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  font-size: .9rem;
  cursor: pointer;
}
.hp-li-rf-item:has(input:checked) {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-li-rf-item input { margin-top: .15rem; accent-color: #dc2626; }
.hp-li-draft {
  width: 100%;
  font: inherit;
  font-size: .84rem;
  line-height: 1.45;
  padding: .6rem .7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev, #fff));
  resize: vertical;
  min-height: 7.5rem;
  box-sizing: border-box;
}
.hp-li-live { text-align: center; margin-bottom: .65rem; }
.hp-li-live .hp-bid-num { margin: .15rem 0; }
.hp-li-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .78rem;
}
.hp-li-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin-bottom: .65rem;
}
.hp-li-gauges .hp-gauge {
  padding: .45rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, transparent);
}
.hp-li-gauges .hp-gauge strong { font-size: .88rem; display: block; line-height: 1.25; }
.hp-li-readiness {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .65rem .75rem;
  margin-bottom: .75rem;
  background: #f8fafc;
}
.hp-li-readiness.is-ok { border-color: #86efac; background: #f0fdf4; }
.hp-li-readiness.is-check { border-color: #fde68a; background: #fffbeb; }
.hp-li-readiness.is-missing { border-color: #fca5a5; background: #fef2f2; }
.hp-li-readiness.is-empty { border-color: var(--border); background: #f8fafc; }
.hp-li-ready-title {
  margin: 0 0 .25rem;
  font-weight: 750;
  font-size: .98rem;
}
.hp-li-bar-wrap { margin: .55rem 0 .75rem; }
.hp-li-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-li-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: #94a3b8;
  transition: width .25s ease;
}
.hp-li-fill.is-ok { background: #16a34a; }
.hp-li-fill.is-mid { background: #f59e0b; }
.hp-li-fill.is-low { background: #dc2626; }
.hp-li-hull {
  margin: .55rem 0 .75rem;
  padding: .5rem .6rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg));
}
.hp-li-hull-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .3rem;
}
.hp-li-hull-btn {
  display: block;
  width: 100%;
  text-align: left;
  font: inherit;
  font-size: .82rem;
  padding: .35rem .45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  color: var(--text);
  cursor: pointer;
}
.hp-li-hull-btn:hover,
.hp-li-hull-btn:focus-visible {
  border-color: var(--brand);
  outline: none;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand) 22%, transparent);
}
.hp-li-alerts,
.hp-li-next,
.hp-li-commit {
  margin: .65rem 0;
}
.hp-li-alert-list,
.hp-li-next-list {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-li-alert-list li,
.hp-li-next-list li { margin: .2rem 0; }
.hp-li-commit-text {
  width: 100%;
  font: inherit;
  font-size: .82rem;
  line-height: 1.4;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
  resize: vertical;
  min-height: 8rem;
  box-sizing: border-box;
}
.hp-li-privacy {
  margin-top: .85rem;
  font-size: .88rem;
}
.hp-li-privacy summary { cursor: pointer; font-weight: 600; }
.hp-li-faq details { margin: .35rem 0; }
.hp-li-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-li-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 900px) {
  .hp-li-layout { grid-template-columns: 1fr; }
  .hp-li-panel { position: static; order: 0; max-height: none; }
  .hp-li-main { order: 1; }
}
@media (max-width: 560px) {
  .hp-li-hero { grid-template-columns: 1fr; }
  .hp-li-hero-copy { grid-column: 1; }
  .hp-li-hero-mascot { grid-column: 1; grid-row: auto; justify-self: start; }
  .hp-li-gauges { grid-template-columns: 1fr; }
  .hp-li-st { min-width: 100%; width: 100%; }
  .hp-li-cov-top { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-li-fill { transition: none; }
  .hp-li-cov-row { transition: none; }
  .hp-li-panel { scroll-behavior: auto; }
}

/* —— Utleieannonse (rent_out-annonse-utleie / ad) —— */
.hp-rad { margin: 0 0 .5rem; }
.hp-rad-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-rad-hero-mascot {
  border-radius: 14px;
  background: color-mix(in srgb, var(--accent, #0d9488) 12%, transparent);
}
.hp-rad-hero-copy { min-width: 0; grid-column: 2; }
.hp-rad-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
  color: var(--muted, #64748b);
}
.hp-rad-lead-bullets li { margin: .15rem 0; }
.hp-rad-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 80%, var(--bg));
}
.hp-rad-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rad-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
  color: var(--muted, #64748b);
}
.hp-rad-how-list li { margin: .2rem 0; }
.hp-rad-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  margin: 0 0 .55rem;
}
.hp-rad-demo-badge {
  display: inline-block;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 22%, transparent);
  color: #92400e;
  vertical-align: middle;
}
.hp-rad-demo-note {
  margin: 0 0 .75rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: color-mix(in srgb, #f59e0b 12%, transparent);
}
.hp-rad-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .95fr);
  gap: 1rem 1.25rem;
  align-items: start;
}
@media (max-width: 860px) {
  .hp-rad-layout { grid-template-columns: 1fr; }
  .hp-rad-hero { grid-template-columns: auto 1fr; }
  .hp-rad-panel { position: static; }
}
.hp-rad-section {
  font-size: 1rem;
  font-weight: 750;
  margin: 1rem 0 .45rem;
}
.hp-rad-main .hp-rad-section:first-child { margin-top: 0; }
.hp-rad-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--bg));
  box-shadow: 0 1px 0 color-mix(in srgb, var(--fg, #0f172a) 4%, transparent);
}
.hp-rad-empty { padding: .35rem 0; }
.hp-rad-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin: 0 0 .65rem;
}
.hp-rad-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .55rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-rad-gauge strong {
  font-size: 1.15rem;
  font-weight: 750;
  letter-spacing: -0.01em;
}
.hp-rad-scorebar {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  overflow: hidden;
  margin: 0 0 .65rem;
}
.hp-rad-scorebar-fill {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0d9488, #14b8a6);
  transition: width .25s ease;
}
.hp-rad-facts {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  margin: 0 0 .75rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: color-mix(in srgb, var(--accent, #0d9488) 8%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent, #0d9488) 22%, var(--border));
}
.hp-rad-fact {
  display: flex;
  flex-direction: column;
  gap: .05rem;
  min-width: 5.5rem;
}
.hp-rad-fact strong { font-size: .92rem; font-weight: 700; }
.hp-rad-subh {
  font-size: .88rem;
  font-weight: 700;
  margin: .65rem 0 .3rem;
}
.hp-rad-title-out {
  width: 100%;
  font-weight: 650;
  font-size: .95rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .45rem .55rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-rad-body-out {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.45;
  resize: vertical;
  min-height: 12rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-rad-incl-fs {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem .65rem;
  margin: 0;
}
.hp-rad-incl-fs legend {
  padding: 0 .25rem;
  font-weight: 650;
}
.hp-rad-incl-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: .35rem .55rem;
}
.hp-rad-check {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: .88rem;
  cursor: pointer;
}
.hp-rad-check input { margin: 0; }
.hp-rad-checks {
  margin: 0;
  padding-left: 0;
  list-style: none;
  font-size: .84rem;
}
.hp-rad-checks li {
  margin: .28rem 0;
  padding: .2rem .35rem;
  border-radius: 8px;
}
.hp-rad-checks li.is-ok {
  background: color-mix(in srgb, #10b981 12%, transparent);
  color: color-mix(in srgb, #065f46 70%, var(--fg, #0f172a));
}
.hp-rad-checks li.is-miss {
  background: color-mix(in srgb, #f59e0b 10%, transparent);
  color: color-mix(in srgb, #92400e 65%, var(--fg, #0f172a));
}
.hp-rad-tips-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  color: var(--muted, #64748b);
}
.hp-rad-tips-ul li { margin: .2rem 0; }
.hp-rad-nonadvice {
  margin: .75rem 0 0;
  font-size: .78rem;
}
.hp-rad-faq details {
  border-bottom: 1px solid var(--border);
  padding: .45rem 0;
}
.hp-rad-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rad-faq details p { margin: .35rem 0 .15rem; }
.hp-rad-demos .chip.is-on,
.hp-rad-demos .chip[aria-pressed="true"] {
  background: color-mix(in srgb, var(--accent, #0d9488) 18%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--accent, #0d9488) 45%, var(--border));
  font-weight: 650;
}
@media (max-width: 560px) {
  .hp-rad-hero { grid-template-columns: 1fr; }
  .hp-rad-hero-copy { grid-column: 1; }
  .hp-rad-hero-mascot { grid-column: 1; justify-self: start; }
  .hp-rad-panel { position: static; }
  .hp-rad-gauges { grid-template-columns: 1fr; }
  .hp-rad-incl-grid { grid-template-columns: 1fr; }
}

/* —— Innflytting protokoll utleier (rent_out-innflytting-utleier · ll_movein) —— */
.hp-lm { margin: 0; }
.hp-lm-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-lm-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
}
.hp-lm-hero-copy { min-width: 0; grid-column: 2; }
.hp-lm-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-lm-lead-bullets li { margin: .15rem 0; }
.hp-lm-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  padding: .55rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 80%, var(--brand, #0f766e) 6%);
}
.hp-lm-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-lm-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-lm-how-list li { margin: .2rem 0; }
.hp-lm-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: .55rem 0 .75rem;
}
.hp-lm-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, #b45309 18%, transparent);
  color: color-mix(in srgb, #b45309 85%, var(--text));
  margin-left: .25rem;
}
.hp-lm-demo-note {
  margin: -.35rem 0 .75rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #b45309 45%, var(--border));
  background: color-mix(in srgb, #b45309 8%, transparent);
}
.hp-lm-demos .chip.active,
.hp-lm-demos .chip[aria-pressed="true"],
.hp-lm-demos .chip.is-on,
.hp-lm-filter .chip.is-on,
.hp-lm-filter .chip[aria-pressed="true"] {
  background: color-mix(in srgb, var(--brand, #0f766e) 18%, transparent);
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
}
.hp-lm-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-lm-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .9fr);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
.hp-lm-section {
  margin: 1.1rem 0 .45rem;
  font-size: 1.05rem;
  font-weight: 700;
}
.hp-lm-filter {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-lm-room-list,
.hp-lm-proto-list,
.hp-lm-prep-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .45rem;
}
.hp-lm-room,
.hp-lm-proto-row,
.hp-lm-prep-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, transparent);
}
.hp-lm-room.is-gap,
.hp-lm-proto-row.is-gap,
.hp-lm-prep-row.is-gap {
  border-color: color-mix(in srgb, #b45309 45%, var(--border));
  background: color-mix(in srgb, #b45309 7%, var(--bg-elev, #fff));
}
.hp-lm-room.is-ok,
.hp-lm-proto-row.is-ok,
.hp-lm-prep-row.is-ok {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
}
.hp-lm-room.has-dmg .hp-lm-dmg {
  border-color: color-mix(in srgb, #b45309 40%, var(--border));
}
.hp-lm-room-top,
.hp-lm-proto-top,
.hp-lm-prep-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: center;
  justify-content: space-between;
}
.hp-lm-room-label,
.hp-lm-proto-label,
.hp-lm-prep-label {
  flex: 1 1 12rem;
  min-width: 0;
  font-weight: 550;
  font-size: .92rem;
}
.hp-lm-st-wrap {
  flex: 0 0 auto;
  margin: 0;
}
.hp-lm-st,
.hp-lm-st-wrap select {
  min-width: 9.5rem;
  max-width: 100%;
  font-size: .88rem;
}
.hp-lm-dmg-wrap {
  display: block;
  margin-top: .4rem;
}
.hp-lm-dmg {
  width: 100%;
  font-size: .88rem;
}
.hp-lm-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: .85rem .9rem 1rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 94%, var(--brand, #0f766e) 4%);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 60%, transparent);
}
.hp-lm-live {
  margin-bottom: .65rem;
}
.hp-lm-live .hp-bid-num {
  font-size: 1.85rem;
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.15;
  color: var(--brand, #0f766e);
}
.hp-lm-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
  margin: .35rem 0 .55rem;
}
.hp-lm-gauges .hp-gauge {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .5rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
  display: flex;
  flex-direction: column;
  gap: .1rem;
  min-width: 0;
}
.hp-lm-gauges .hp-gauge strong {
  font-size: .92rem;
  font-weight: 700;
  word-break: break-word;
}
.hp-lm-bar-wrap {
  margin: .45rem 0 .65rem;
}
.hp-lm-bar {
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-lm-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--brand, #0f766e) 75%, #0ea5e9),
    var(--brand, #0f766e)
  );
  transition: width .25s ease;
}
.hp-lm-readiness {
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: .35rem 0 .55rem;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-lm-readiness.is-ok {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, var(--bg-elev, #fff));
}
.hp-lm-readiness.is-mid {
  border-color: color-mix(in srgb, #ca8a04 45%, var(--border));
  background: color-mix(in srgb, #ca8a04 9%, var(--bg-elev, #fff));
}
.hp-lm-readiness.is-tight {
  border-color: color-mix(in srgb, #b45309 50%, var(--border));
  background: color-mix(in srgb, #b45309 10%, var(--bg-elev, #fff));
}
.hp-lm-ready-title {
  margin: 0 0 .2rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-lm-gaps,
.hp-lm-meters-box,
.hp-lm-next {
  margin: .55rem 0;
  padding: .5rem .6rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 35%, var(--bg-elev, #fff));
}
.hp-lm-gaps-ul,
.hp-lm-next-ol {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .88rem;
}
.hp-lm-gaps-ul li,
.hp-lm-next-ol li { margin: .2rem 0; }
.hp-lm-commit {
  margin-top: .65rem;
}
.hp-lm-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 10rem;
}
.hp-lm-nonadvice,
.hp-lm-nonadvice-fixed {
  margin-top: .55rem;
  font-size: .78rem;
}
.hp-lm-privacy {
  margin-top: .85rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev, #fff));
}
.hp-lm-privacy > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-lm-faq {
  margin-top: 1rem;
}
.hp-lm-faq details {
  margin: .4rem 0 0;
  padding: .25rem 0 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-lm-faq details summary {
  cursor: pointer;
  font-weight: 550;
  font-size: .88rem;
}
.hp-lm-faq details p { margin: .35rem 0 .15rem; }
.hp-lm-fc {
  font-weight: 600;
  font-size: .78em;
  opacity: .85;
  margin-left: .15rem;
}
.hp-lm-countdown {
  margin: .45rem 0 .55rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 30%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, var(--bg-elev, #fff));
}
.hp-lm-cd-main {
  margin: .1rem 0;
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: -.02em;
  color: var(--brand, #0f766e);
}
.hp-lm-gap-btn {
  appearance: none;
  border: 0;
  background: none;
  padding: 0;
  margin: 0;
  font: inherit;
  font-weight: 600;
  color: var(--brand, #0f766e);
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
  text-align: left;
}
.hp-lm-gap-btn:hover,
.hp-lm-gap-btn:focus-visible {
  color: color-mix(in srgb, var(--brand, #0f766e) 70%, #000);
  outline: none;
}
.hp-lm-flash {
  animation: hp-lm-flash-pulse 1.1s ease;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand, #0f766e) 55%, transparent);
}
@keyframes hp-lm-flash-pulse {
  0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--brand, #0f766e) 55%, transparent); }
  40% { box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand, #0f766e) 45%, transparent); }
  100% { box-shadow: 0 0 0 0 transparent; }
}
.hp-lm-check {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .55rem;
}
.hp-lm-check input[type="checkbox"] {
  width: 1.05rem;
  height: 1.05rem;
  margin: 0;
}
.hp-lm-date-q { align-self: end; }
.hp-lm-draft { min-height: 7rem; }
.hp-lm-filter .chip-ghost { font-weight: 500; }
.hp-lm-seed-hint {
  margin: -.2rem 0 .75rem;
  padding: .45rem .7rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, transparent);
}
.hp-lm-rail {
  margin: .65rem 0 .25rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 4%);
}
.hp-lm-rail-track {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}
.hp-lm-rail-chip {
  display: inline-flex;
  flex-direction: column;
  gap: .1rem;
  padding: .35rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
  min-width: 5.5rem;
}
.hp-lm-rail-chip.is-on {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, var(--bg-elev, #fff));
}
.hp-lm-formula {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.35;
  word-break: break-word;
  margin: .25rem 0 .15rem;
  opacity: .92;
}
.hp-lm-subject {
  width: 100%;
  font-size: .88rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg, #fff) 90%, transparent);
  margin-bottom: .15rem;
}
.hp-lm-dep-chips .chip.is-on,
.hp-lm-dep-chips .chip[aria-pressed="true"] {
  background: color-mix(in srgb, var(--brand, #0f766e) 18%, transparent);
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
}
@media (max-width: 900px) {
  .hp-lm-layout { grid-template-columns: 1fr; }
  .hp-lm-panel { position: static; order: 0; }
  .hp-lm-main { order: 1; }
}
@media (max-width: 560px) {
  .hp-lm-hero { grid-template-columns: 1fr; }
  .hp-lm-hero-copy { grid-column: 1; }
  .hp-lm-hero-mascot { grid-column: 1; grid-row: auto; justify-self: start; }
  .hp-lm-gauges { grid-template-columns: 1fr; }
  .hp-lm-st,
  .hp-lm-st-wrap select { min-width: 100%; width: 100%; }
  .hp-lm-room-top,
  .hp-lm-proto-top,
  .hp-lm-prep-top { flex-direction: column; align-items: stretch; }
}


/* lm upgrades: temp badge, Dag D, key chips, sticky */
.hp-lm-temp-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .55rem;
  margin: 0 0 .25rem;
}
.hp-lm-temp-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: .18rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, #b45309 12%, var(--bg-elev, #fff));
  color: color-mix(in srgb, #b45309 80%, var(--text));
}
.hp-lm-temp-badge.is-klar {
  background: color-mix(in srgb, var(--brand, #0f766e) 14%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  color: color-mix(in srgb, var(--brand, #0f766e) 85%, var(--text));
}
.hp-lm-temp-badge.is-sjekk {
  background: color-mix(in srgb, #ca8a04 14%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #ca8a04 45%, var(--border));
  color: color-mix(in srgb, #a16207 90%, var(--text));
}
.hp-lm-temp-badge.is-mangler {
  background: color-mix(in srgb, #b45309 12%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #b45309 45%, var(--border));
}
.hp-lm-key-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-top: .35rem;
}
.hp-lm-key-chip {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  cursor: pointer;
  user-select: none;
  font-size: .82rem;
  font-weight: 550;
}
.hp-lm-key-chip input {
  width: 1rem;
  height: 1rem;
  margin: 0;
}
.hp-lm-key-chip:has(input:checked) {
  background: color-mix(in srgb, var(--brand, #0f766e) 16%, transparent);
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
}
.hp-lm-dagd-card,
.hp-lm-proto-mal {
  margin: .55rem 0;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-lm-dagd-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .35rem;
  margin-bottom: .35rem;
}
.hp-lm-dagd-pre {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .76rem;
  line-height: 1.4;
  max-height: 14rem;
  overflow: auto;
}
.hp-lm-proto-ta {
  min-height: 8rem;
  font-size: .76rem;
}
.hp-lm-sticky {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  padding: .45rem .65rem calc(.45rem + env(safe-area-inset-bottom, 0px));
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--brand, #0f766e) 8%);
  border-top: 1px solid var(--border);
  box-shadow: 0 -4px 16px color-mix(in srgb, #000 12%, transparent);
}
.hp-lm-sticky-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .55rem;
  max-width: 1100px;
  margin: 0 auto;
}
.hp-lm-sticky-pct {
  font-weight: 800;
  font-size: 1.05rem;
  color: var(--brand, #0f766e);
}
.hp-lm-sticky-temp {
  font-size: .78rem;
  font-weight: 750;
  letter-spacing: .03em;
  text-transform: uppercase;
  padding: .12rem .4rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, transparent);
}
.hp-lm-sticky-cd {
  flex: 1 1 auto;
  min-width: 4rem;
}
.hp-lm-time-q { align-self: end; }
@media (min-width: 901px) {
  .hp-lm-sticky { display: none !important; }
}
@media (max-width: 900px) {
  .hp-lm { padding-bottom: 4.5rem; }
}

/* —— Oppsigelse utleier (rent_out-oppsigelse-utleier · ll_oppsig) —— */
.hp-lo { margin: 0; }
.hp-lo-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-lo-hero-copy { min-width: 0; grid-column: 1; }
.hp-lo-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  width: 72px; height: 72px;
  object-fit: contain;
  border-radius: 50%;
  justify-self: end;
}
.hp-lo-how { grid-column: 1 / -1; }
.hp-lo-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-lo-lead-bullets li { margin: .2rem 0; }
.hp-lo-how {
  margin-top: .35rem;
  padding: .55rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-lo-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-lo-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-lo-how-list li { margin: .2rem 0; }
.hp-lo-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #f59e0b) 22%, transparent);
  color: color-mix(in srgb, var(--accent, #b45309) 80%, var(--text));
  vertical-align: middle;
}
.hp-lo-demo-note {
  margin: .35rem 0 .65rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--accent, #f59e0b) 45%, var(--border));
  background: color-mix(in srgb, var(--accent, #f59e0b) 8%, var(--bg));
}
.hp-lo-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
  margin: 0 0 .75rem;
}
.hp-lo-demos .chip { font-size: .8rem; }
.hp-lo-demos .chip.active,
.hp-lo-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg));
}
.hp-lo-layout {
  display: grid;
  grid-template-columns: 1fr minmax(280px, 360px);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
.hp-lo-section {
  font-size: 1.05rem;
  margin: 1rem 0 .45rem;
}
.hp-lo-section:first-child { margin-top: 0; }
.hp-lo-formula {
  margin: .55rem 0 .75rem;
  padding: .5rem .7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev, #fff));
  line-height: 1.45;
}
.hp-lo-match {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .65rem;
  align-items: flex-start;
  margin: .55rem 0 .35rem;
  padding: .5rem .7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
  font-size: .86rem;
  line-height: 1.4;
}
.hp-lo-match.is-ok {
  border-color: color-mix(in srgb, #22c55e 40%, var(--border));
  background: color-mix(in srgb, #22c55e 8%, var(--bg));
}
.hp-lo-match.is-warn {
  border-color: color-mix(in srgb, var(--accent, #f59e0b) 45%, var(--border));
  background: color-mix(in srgb, var(--accent, #f59e0b) 10%, var(--bg));
}
.hp-lo-match.is-info {
  border-color: color-mix(in srgb, var(--brand) 30%, var(--border));
}
.hp-lo-match-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .14rem .45rem;
  border-radius: 999px;
  white-space: nowrap;
  background: color-mix(in srgb, var(--brand) 14%, var(--bg));
  color: var(--text);
}
.hp-lo-match-badge.is-ok,
.hp-lo-match.is-ok .hp-lo-match-badge {
  background: color-mix(in srgb, #22c55e 22%, transparent);
  color: color-mix(in srgb, #15803d 85%, var(--text));
}
.hp-lo-match-badge.is-warn,
.hp-lo-match.is-warn .hp-lo-match-badge {
  background: color-mix(in srgb, var(--accent, #f59e0b) 24%, transparent);
  color: color-mix(in srgb, var(--accent, #b45309) 85%, var(--text));
}
.hp-lo-match-badge.is-info {
  background: color-mix(in srgb, var(--brand) 16%, transparent);
}
.hp-lo-temp {
  margin-bottom: .65rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  text-align: center;
}
.hp-lo-temp strong {
  display: block;
  font-size: 1.15rem;
  font-weight: 800;
  margin-top: .1rem;
}
.hp-lo-temp.is-ok {
  border-color: color-mix(in srgb, #22c55e 40%, var(--border));
  background: color-mix(in srgb, #22c55e 10%, var(--bg));
}
.hp-lo-temp.is-check {
  border-color: color-mix(in srgb, var(--accent, #f59e0b) 40%, var(--border));
  background: color-mix(in srgb, var(--accent, #f59e0b) 8%, var(--bg));
}
.hp-lo-temp.is-missing {
  border-color: color-mix(in srgb, #ef4444 40%, var(--border));
  background: color-mix(in srgb, #ef4444 8%, var(--bg));
}
.hp-lo-row.is-overdue {
  border-color: color-mix(in srgb, #ef4444 45%, var(--border));
  background: color-mix(in srgb, #ef4444 6%, var(--bg-elev, #fff));
}
.hp-lo-row.is-due-soon {
  border-color: color-mix(in srgb, var(--accent, #f59e0b) 40%, var(--border));
}
.hp-lo-subject-inp {
  width: 100%;
  font-size: .86rem;
  font-weight: 650;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: .4rem .55rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-lo-partner {
  margin-top: .65rem;
  padding: .55rem .6rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-lo-partner-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  resize: vertical;
  min-height: 4.5rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: .45rem .55rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-lo-quick-actions { margin: .45rem 0; }
.hp-lo-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-lo-tab .hp-lo-tab-pct {
  margin-left: .3rem;
  font-size: .72rem;
  opacity: .85;
  font-weight: 700;
}
.hp-lo-tab.is-on {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg));
}
.hp-lo-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .45rem;
}
.hp-lo-filter.is-on {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 10%, var(--bg));
}
.hp-lo-phase-help { margin: 0 0 .45rem; }
.hp-lo-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .45rem;
}
.hp-lo-row {
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-lo-row.is-critical {
  border-color: color-mix(in srgb, var(--accent, #f59e0b) 35%, var(--border));
}
.hp-lo-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-lo-row-label {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem .4rem;
  align-items: center;
  flex: 1;
  min-width: 0;
  font-size: .9rem;
  font-weight: 600;
  line-height: 1.35;
}
.hp-lo-crit-badge {
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent, #f59e0b) 22%, transparent);
  color: color-mix(in srgb, var(--accent, #b45309) 85%, var(--text));
}
.hp-lo-st {
  min-width: 8.5rem;
  font-size: .85rem;
}
.hp-lo-due { margin: .25rem 0 .2rem; }
.hp-lo-note-inp {
  width: 100%;
  font-size: .85rem;
  margin-top: .15rem;
}
.hp-lo-panel {
  position: sticky;
  top: .75rem;
  padding: .85rem .9rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev, #fff));
  max-height: calc(100vh - 2rem);
  overflow: auto;
}
.hp-lo-live {
  text-align: center;
  padding: .55rem .4rem .65rem;
  border-radius: 12px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg));
  margin-bottom: .65rem;
}
.hp-lo-live.is-soon {
  background: color-mix(in srgb, var(--accent, #f59e0b) 16%, var(--bg));
}
.hp-lo-live.is-today {
  background: color-mix(in srgb, #22c55e 18%, var(--bg));
}
.hp-lo-live.is-past {
  background: color-mix(in srgb, #ef4444 12%, var(--bg));
}
.hp-lo-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .72rem;
  opacity: .9;
}
.hp-lo-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin-bottom: .65rem;
}
.hp-lo-gauges .hp-gauge {
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.hp-lo-gauges .hp-gauge strong {
  font-size: .95rem;
  font-weight: 750;
  line-height: 1.25;
}
.hp-lo-dates-box,
.hp-lo-warn,
.hp-lo-vacancy,
.hp-lo-rent-sched,
.hp-lo-next,
.hp-lo-draft,
.hp-lo-commit {
  margin-top: .65rem;
  padding: .55rem .6rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-lo-rent-sched {
  border-color: color-mix(in srgb, var(--brand) 28%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-lo-sms-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  resize: vertical;
  min-height: 3.2rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: .45rem .55rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-lo-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .86rem;
}
.hp-lo-table th {
  text-align: left;
  font-weight: 600;
  padding: .2rem .35rem .2rem 0;
  color: var(--muted, #64748b);
  vertical-align: top;
  width: 48%;
}
.hp-lo-table td {
  padding: .2rem 0;
  font-weight: 650;
}
.hp-lo-warn {
  border-color: color-mix(in srgb, var(--accent, #f59e0b) 40%, var(--border));
  background: color-mix(in srgb, var(--accent, #f59e0b) 8%, var(--bg));
}
.hp-lo-warn-list,
.hp-lo-next-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  line-height: 1.4;
}
.hp-lo-warn-list li,
.hp-lo-next-list li { margin: .2rem 0; }
.hp-lo-vacancy.is-hot {
  border-color: color-mix(in srgb, #ef4444 35%, var(--border));
  background: color-mix(in srgb, #ef4444 6%, var(--bg));
}
.hp-lo-vacancy-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
}
.hp-lo-vacancy-grid > div {
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-lo-vacancy-grid strong { font-size: .95rem; }
.hp-lo-draft-text,
.hp-lo-commit-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  resize: vertical;
  min-height: 7rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: .45rem .55rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-lo-privacy {
  margin-top: .85rem;
  font-size: .88rem;
}
.hp-lo-privacy summary { cursor: pointer; font-weight: 600; }
.hp-lo-faq details { margin: .35rem 0; }
.hp-lo-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-lo-faq details p { margin: .35rem 0 .15rem; }
.hp-lo-bridges { margin-top: .5rem; }
.hp-lo-mnd-chips,
.hp-lo-date-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-lo-mnd-chips .chip,
.hp-lo-date-chips .chip {
  font-size: .75rem;
  padding: .2rem .45rem;
}
.hp-lo-mnd-chips .chip.is-on,
.hp-lo-mnd-chips .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg));
}
.hp-lo-seed-hint {
  margin: 0 0 .65rem;
  padding: .4rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg));
}
.hp-lo-phase-suggest {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .65rem;
  align-items: center;
  margin: .55rem 0 .75rem;
  padding: .5rem .7rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 7%, var(--bg-elev, #fff));
  font-size: .88rem;
}
.hp-lo-fc {
  font-size: .72rem;
  font-weight: 700;
  opacity: .85;
  margin-left: .15rem;
}
.hp-lo-rail {
  margin-top: .7rem;
  padding-top: .55rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-lo-rail-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .3rem;
  position: relative;
}
.hp-lo-rail-list::before {
  content: '';
  position: absolute;
  left: .35rem;
  top: .35rem;
  bottom: .35rem;
  width: 2px;
  background: color-mix(in srgb, var(--brand) 35%, var(--border));
  border-radius: 2px;
}
.hp-lo-rail-item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: .35rem .55rem;
  align-items: baseline;
  padding: .25rem .2rem .25rem 1.1rem;
  position: relative;
  font-size: .82rem;
}
.hp-lo-rail-item::before {
  content: '';
  position: absolute;
  left: .2rem;
  top: .55rem;
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
  background: var(--brand);
  border: 2px solid var(--bg-elev, #fff);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand) 40%, var(--border));
}
.hp-lo-rail-item.is-past {
  opacity: .72;
}
.hp-lo-rail-item.is-past::before {
  background: color-mix(in srgb, #94a3b8 80%, var(--brand));
}
.hp-lo-rail-item.is-today::before {
  background: #22c55e;
  box-shadow: 0 0 0 1px color-mix(in srgb, #22c55e 50%, var(--border));
}
.hp-lo-rail-item.is-soon::before {
  background: var(--accent, #f59e0b);
}
.hp-lo-rail-date { font-weight: 700; white-space: nowrap; }
.hp-lo-rail-label { min-width: 0; }
.hp-lo-rail-delta { font-size: .75rem; white-space: nowrap; }
.hp-lo-next-btn {
  display: inline;
  border: 0;
  background: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--brand) 45%, transparent);
  text-underline-offset: 2px;
}
.hp-lo-next-btn:hover,
.hp-lo-next-btn:focus-visible {
  color: var(--brand);
  outline: none;
}
@media (max-width: 900px) {
  .hp-lo-layout { grid-template-columns: 1fr; }
  .hp-lo-panel { position: static; order: 0; max-height: none; }
  .hp-lo-main { order: 1; }
}
@media (max-width: 560px) {
  .hp-lo-hero { grid-template-columns: 1fr; }
  .hp-lo-hero-copy { grid-column: 1; }
  .hp-lo-hero-mascot { grid-column: 1; grid-row: auto; justify-self: start; }
  .hp-lo-gauges { grid-template-columns: 1fr; }
  .hp-lo-st { min-width: 100%; width: 100%; }
  .hp-lo-vacancy-grid { grid-template-columns: 1fr; }
}

/* —— 12-mnd leieinntekt (rent_out-leieinntekt-prognose · ll_forecast) —— */
.hp-llf { margin-top: .25rem; }
.hp-llf-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-llf-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-llf-hero-copy { min-width: 0; }
.hp-llf-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  color: var(--muted, #5b6470);
}
.hp-llf-lead-bullets li { margin: .2rem 0; }
.hp-llf-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-llf-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-llf-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-llf-how-list li { margin: .2rem 0; }
.hp-llf-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  color: var(--brand);
  vertical-align: middle;
}
.hp-llf-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .45rem;
  margin: 0 0 .65rem;
}
.hp-llf-demos .chip {
  font-size: .82rem;
  padding: .28rem .65rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-llf-demos .chip:hover,
.hp-llf-demos .chip.active,
.hp-llf-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-llf-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-llf-demo-note { margin: 0 0 .65rem; }
.hp-llf-section {
  font-size: 1.02rem;
  font-weight: 700;
  margin: 1.1rem 0 .45rem;
}
.hp-llf-quick {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .4rem;
  margin: 0 0 .45rem;
}
.hp-llf-quick .chip-sm {
  font-size: .78rem;
  padding: .2rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-llf-quick .chip-sm[aria-pressed="true"],
.hp-llf-quick .chip-sm.active {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-llf-occ-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .5rem;
}
.hp-llf-occ-chip {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  font-size: .82rem;
  padding: .28rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
  user-select: none;
}
.hp-llf-occ-chip:has(input:checked) {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
  font-weight: 600;
}
.hp-llf-occ-chip:has(input:not(:checked)) {
  opacity: .72;
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}
.hp-llf-occ-chip input {
  width: 0.95rem;
  height: 0.95rem;
  margin: 0;
  accent-color: var(--brand);
}
.hp-llf-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.95fr);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
.hp-llf-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem 1rem;
  background: var(--bg-elev, #fff);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 80%, transparent);
  max-height: min(92vh, 920px);
  overflow: auto;
}
.hp-llf-live {
  text-align: center;
  padding: .35rem 0 .55rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: .65rem;
}
.hp-llf-live .hp-bid-num {
  font-size: 1.65rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.15;
}
.hp-llf-live .hp-bid-num.hp-llf-neg { color: #b42318; }
.hp-llf-live .hp-bid-num.hp-llf-pos { color: color-mix(in srgb, var(--brand) 80%, #0a7a3e); }
.hp-llf-nonadvice-fixed { margin: .25rem 0 0; font-size: .75rem; }
.hp-llf-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: 0 0 .7rem;
}
.hp-llf-gauges .hp-gauge {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .5rem;
  background: color-mix(in srgb, var(--bg) 55%, var(--bg-elev, #fff));
}
.hp-llf-gauges .hp-gauge strong {
  display: block;
  font-size: .98rem;
  margin-top: .1rem;
}
.hp-llf-bars { margin: 0 0 .75rem; }
.hp-llf-bar-row {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: .2rem;
  align-items: end;
  height: 88px;
  padding: .25rem 0 0;
}
.hp-llf-bar-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  height: 100%;
  min-width: 0;
}
.hp-llf-bar {
  width: 100%;
  max-width: 18px;
  border-radius: 4px 4px 2px 2px;
  min-height: 4px;
}
.hp-llf-bar-pos {
  background: color-mix(in srgb, var(--brand) 72%, #1a9b55);
}
.hp-llf-bar-neg { background: #d92d20; }
.hp-llf-bar-vac {
  background: color-mix(in srgb, var(--muted, #5b6470) 45%, var(--border));
}
.hp-llf-bar-lbl {
  font-size: .62rem;
  color: var(--muted, #5b6470);
  margin-top: .15rem;
  line-height: 1;
}
.hp-llf-table-wrap { margin: 0 0 .7rem; overflow-x: auto; }
.hp-llf-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .82rem;
}
.hp-llf-table th,
.hp-llf-table td {
  border-bottom: 1px solid var(--border);
  padding: .28rem .3rem;
  text-align: right;
  vertical-align: top;
}
.hp-llf-table thead th {
  font-weight: 650;
  color: var(--muted, #5b6470);
  font-size: .75rem;
  text-align: right;
}
.hp-llf-table thead th:first-child,
.hp-llf-table tbody th {
  text-align: left;
  font-weight: 600;
}
.hp-llf-table-sum th { text-align: left; font-weight: 500; color: var(--muted, #5b6470); }
.hp-llf-tr-vac { background: color-mix(in srgb, #f79009 8%, transparent); }
.hp-llf-tr-strong th,
.hp-llf-tr-strong td { font-weight: 700; border-top: 1px solid var(--border); }
.hp-llf-st {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  padding: .08rem .35rem;
  border-radius: 999px;
  border: 1px solid var(--border);
}
.hp-llf-st-occ {
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-llf-st-vac {
  background: color-mix(in srgb, #f79009 14%, var(--bg-elev));
  border-color: color-mix(in srgb, #f79009 40%, var(--border));
  color: #b54708;
}
.hp-llf-neg { color: #b42318; font-weight: 650; }
.hp-llf-pos { color: color-mix(in srgb, var(--brand) 70%, #0a7a3e); }
.hp-llf-tips { margin: .55rem 0 .45rem; }
.hp-llf-tip-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  color: var(--muted, #5b6470);
}
.hp-llf-tip-list li { margin: .18rem 0; }
.hp-llf-summary {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .75rem;
  line-height: 1.35;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .55rem;
  background: color-mix(in srgb, var(--bg) 60%, var(--bg-elev, #fff));
  resize: vertical;
  min-height: 6rem;
}
.hp-llf-faq,
.hp-llf-privacy {
  margin-top: .85rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .4rem .65rem .5rem;
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev, #fff));
}
.hp-llf-faq > summary,
.hp-llf-privacy > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-llf-faq details {
  margin: .35rem 0 0;
  padding-left: .15rem;
}
.hp-llf-faq details summary {
  cursor: pointer;
  font-size: .86rem;
  font-weight: 600;
}
.hp-llf-actions { margin-bottom: .25rem; }
.hp-llf-seed-hint {
  margin: 0 0 .65rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev, #fff));
  font-size: .84rem;
}
.hp-llf-status-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .55rem;
  margin: 0 0 .55rem;
}
.hp-llf-status {
  display: inline-block;
  font-size: .72rem;
  font-weight: 750;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .12rem .45rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-llf-st-ok {
  background: color-mix(in srgb, #12b76a 14%, var(--bg-elev));
  border-color: color-mix(in srgb, #12b76a 45%, var(--border));
  color: #027a48;
}
.hp-llf-st-check {
  background: color-mix(in srgb, #f79009 14%, var(--bg-elev));
  border-color: color-mix(in srgb, #f79009 45%, var(--border));
  color: #b54708;
}
.hp-llf-st-neg {
  background: color-mix(in srgb, #f04438 12%, var(--bg-elev));
  border-color: color-mix(in srgb, #f04438 40%, var(--border));
  color: #b42318;
}
.hp-llf-st-empty {
  background: color-mix(in srgb, var(--muted, #5b6470) 10%, var(--bg-elev));
}
.hp-llf-formula {
  margin: 0 0 .7rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 55%, var(--bg-elev, #fff));
}
.hp-llf-formula-code {
  display: block;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .72rem;
  line-height: 1.4;
  white-space: pre-wrap;
  word-break: break-word;
  color: var(--text, #1a1f26);
}
.hp-llf-scenarios { margin: 0 0 .75rem; }
.hp-llf-sc-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .4rem;
}
.hp-llf-sc-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .12rem;
  text-align: left;
  padding: .45rem .5rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
  cursor: pointer;
  font: inherit;
  color: inherit;
  min-width: 0;
}
.hp-llf-sc-card:hover {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
}
.hp-llf-sc-card.is-active {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand) 25%, transparent);
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
.hp-llf-sc-title {
  font-size: .78rem;
  font-weight: 750;
}
.hp-llf-sc-sub { font-size: .7rem; }
.hp-llf-what {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .45rem;
  margin: .65rem 0 0;
}
.hp-llf-what .chip-sm {
  font-size: .78rem;
  padding: .2rem .55rem;
}
.hp-llf-sc-delta {
  display: block;
  margin-top: .15rem;
  font-variant-numeric: tabular-nums;
}
.hp-llf-sc-net {
  font-size: .95rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  margin-top: .1rem;
}
button.hp-llf-bar-cell {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
button.hp-llf-bar-cell:hover .hp-llf-bar {
  outline: 2px solid color-mix(in srgb, var(--brand) 50%, transparent);
  outline-offset: 1px;
}
button.hp-llf-bar-cell:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
  border-radius: 4px;
}
.hp-llf-cum { margin: 0 0 .7rem; }
.hp-llf-cum-track {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: .2rem;
  align-items: end;
  height: 64px;
  padding: .2rem 0 0;
}
.hp-llf-cum-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  height: 100%;
  min-width: 0;
}
.hp-llf-cum-fill {
  width: 100%;
  max-width: 14px;
  border-radius: 3px 3px 1px 1px;
  min-height: 4px;
  background: color-mix(in srgb, var(--brand) 55%, #64748b);
  opacity: .85;
}
.hp-llf-cum-fill.is-neg {
  background: #d92d20;
  opacity: .9;
}
.hp-llf-cum-zero {
  position: absolute;
  left: 0;
  right: 0;
  height: 0;
  border-top: 1px dashed color-mix(in srgb, var(--muted, #5b6470) 55%, transparent);
  pointer-events: none;
  z-index: 1;
}
.hp-llf-tr-click {
  cursor: pointer;
}
.hp-llf-tr-click:hover {
  background: color-mix(in srgb, var(--brand) 8%, transparent);
}
.hp-llf-tr-click:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--brand) 50%, transparent);
  outline-offset: -2px;
}
.hp-llf-occ-meter {
  margin: 0 0 .65rem;
}
.hp-llf-occ-meter-track {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, var(--bg));
  overflow: hidden;
  margin-bottom: .25rem;
}
.hp-llf-occ-meter-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--brand) 70%, #1a9b55),
    color-mix(in srgb, var(--brand) 45%, #0a7a3e)
  );
  transition: width .2s ease;
}
.hp-llf-stack {
  margin: 0 0 .7rem;
}
.hp-llf-stack-bar {
  display: flex;
  flex-wrap: nowrap;
  gap: 2px;
  height: 14px;
  border-radius: 8px;
  overflow: hidden;
  background: color-mix(in srgb, var(--bg) 60%, var(--border));
  border: 1px solid var(--border);
}
.hp-llf-stack-seg {
  display: block;
  height: 100%;
  min-width: 0;
}
.hp-llf-stack-seg.is-gross {
  background: color-mix(in srgb, var(--brand) 65%, #1a9b55);
}
.hp-llf-stack-seg.is-fixed {
  background: color-mix(in srgb, #f79009 70%, #b54708);
}
.hp-llf-stack-seg.is-once {
  background: color-mix(in srgb, #7a5af8 65%, #6941c6);
}
.hp-llf-rent-chips {
  margin-top: .35rem;
}
.hp-llf-sticky {
  position: sticky;
  bottom: 0;
  z-index: 20;
  margin-top: .75rem;
  padding: .45rem .55rem;
  border: 1px solid var(--border);
  border-radius: 12px 12px 0 0;
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--brand));
  box-shadow: 0 -4px 16px color-mix(in srgb, #000 8%, transparent);
}
.hp-llf-sticky-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .65rem;
}
.hp-llf-sticky-inner strong {
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
}
@media (min-width: 901px) {
  .hp-llf-sticky { display: none !important; }
}

@media (max-width: 900px) {
  .hp-llf-layout { grid-template-columns: 1fr; }
  .hp-llf-panel {
    position: static;
    max-height: none;
  }
  .hp-llf-hero { grid-template-columns: 1fr; }
  .hp-llf-hero-mascot { grid-column: 1; }
  .hp-llf-bar-lbl { font-size: .55rem; }
  .hp-llf-sc-grid { grid-template-columns: 1fr; }
  .hp-llf-gauges { grid-template-columns: 1fr 1fr; }
}

/* —— Kostnadsfordeling utleie (rent_out-felleskost-fordeling · cost_split) —— */
.hp-cs { margin: 0; }
.hp-cs-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-cs-hero-copy { min-width: 0; grid-column: 1; }
.hp-cs-hero-mascot {
  grid-column: 2;
  grid-row: 1;
  width: 72px; height: 72px;
  object-fit: contain;
  border-radius: 50%;
  justify-self: end;
}
.hp-cs-how { grid-column: 1 / -1; }
.hp-cs-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-cs-lead-bullets li { margin: .2rem 0; }
.hp-cs-how {
  margin-top: .35rem;
  padding: .55rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-cs-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-cs-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .88rem;
  line-height: 1.45;
}
.hp-cs-how-list li { margin: .25rem 0; }
.hp-cs-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .65rem;
}
.hp-cs-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: color-mix(in srgb, var(--brand) 18%, transparent);
  color: var(--text, #111);
}
.hp-cs-demo-note {
  margin: 0 0 .75rem;
  padding: .4rem .6rem;
  border-radius: 8px;
  border-left: 3px solid color-mix(in srgb, var(--brand) 55%, #888);
  background: color-mix(in srgb, var(--brand) 8%, transparent);
}
.hp-cs-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .9fr);
  gap: 1rem 1.25rem;
  align-items: start;
}
.hp-cs-section {
  font-size: 1.05rem;
  margin: 1rem 0 .45rem;
}
.hp-cs-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .5rem;
}
.hp-cs-filter.is-on {
  background: color-mix(in srgb, var(--brand) 22%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  font-weight: 600;
}
.hp-cs-matrix-scroll {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-elev, #fff);
}
.hp-cs-matrix {
  width: 100%;
  border-collapse: collapse;
  font-size: .88rem;
  min-width: 560px;
}
.hp-cs-matrix th,
.hp-cs-matrix td {
  padding: .45rem .5rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  vertical-align: middle;
  text-align: left;
}
.hp-cs-matrix thead th {
  position: sticky;
  top: 0;
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev, #fff));
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  z-index: 1;
}
.hp-cs-group-row th {
  background: color-mix(in srgb, var(--muted, #666) 10%, var(--bg-elev, #fff));
  font-size: .8rem;
  font-weight: 700;
  padding: .4rem .55rem;
  color: var(--text, #222);
}
.hp-cs-row-label {
  font-weight: 600;
  min-width: 9rem;
}
.hp-cs-item-label { margin-right: .2rem; }
.hp-cs-who {
  width: 100%;
  min-width: 10.5rem;
  font-size: .85rem;
}
.hp-cs-amt {
  width: 100%;
  min-width: 5.5rem;
  max-width: 7.5rem;
}
.hp-cs-note-inp {
  width: 100%;
  min-width: 5rem;
  font-size: .85rem;
}
.hp-cs-who-pill {
  display: inline-block;
  margin-left: .25rem;
  font-size: .68rem;
  font-weight: 700;
  padding: .08rem .32rem;
  border-radius: 999px;
  vertical-align: middle;
  background: color-mix(in srgb, var(--muted, #888) 18%, transparent);
}
.hp-cs-row.is-open {
  background: color-mix(in srgb, #e6a800 10%, transparent);
}
.hp-cs-row.is-inkl {
  background: color-mix(in srgb, #2a9d5c 7%, transparent);
}
.hp-cs-row.is-tenant {
  background: color-mix(in srgb, #2b6cb0 7%, transparent);
}
.hp-cs-row.is-owner {
  background: color-mix(in srgb, #6b46c1 6%, transparent);
}
.hp-cs-row.is-delt {
  background: color-mix(in srgb, #dd6b20 7%, transparent);
}
.hp-cs-row.is-na {
  opacity: .72;
}
.hp-cs-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .55rem 0 0;
}
.hp-cs-privacy {
  margin-top: .85rem;
  font-size: .88rem;
}
.hp-cs-panel {
  position: sticky;
  top: .75rem;
  padding: .85rem .9rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev, #fff));
  box-shadow: 0 1px 0 color-mix(in srgb, #000 4%, transparent);
}
.hp-cs-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .55rem 0;
}
.hp-cs-gauges .hp-gauge {
  padding: .4rem .5rem;
  border-radius: 10px;
  background: var(--bg-elev, #fff);
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
}
.hp-cs-gauges .hp-gauge strong {
  display: block;
  font-size: 1rem;
  margin-top: .1rem;
}
.hp-cs-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--muted, #888) 18%, transparent);
  overflow: hidden;
}
.hp-cs-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, color-mix(in srgb, var(--brand) 75%, #2a9d5c), var(--brand, #0a7));
  transition: width .2s ease;
}
.hp-cs-stack-bar {
  display: flex;
  height: .7rem;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--muted, #888) 14%, transparent);
}
.hp-cs-seg { display: block; height: 100%; min-width: 0; transition: width .2s ease; }
.hp-cs-seg-rent { background: color-mix(in srgb, var(--brand) 80%, #1a5); }
.hp-cs-seg-extra { background: color-mix(in srgb, #2b6cb0 75%, #89c); }
.hp-cs-legend {
  list-style: none;
  margin: .35rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .55rem 1rem;
  font-size: .82rem;
}
.hp-cs-dot {
  display: inline-block;
  width: .65rem;
  height: .65rem;
  border-radius: 2px;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-cs-dot.hp-cs-seg-rent { background: color-mix(in srgb, var(--brand) 80%, #1a5); }
.hp-cs-dot.hp-cs-seg-extra { background: color-mix(in srgb, #2b6cb0 75%, #89c); }
.hp-cs-counts {
  margin: .55rem 0;
  padding: .35rem .5rem;
  border-radius: 8px;
  background: var(--bg-elev, #fff);
  border: 1px dashed var(--border);
}
.hp-cs-lists {
  display: grid;
  gap: .5rem;
  margin: .55rem 0;
}
.hp-cs-list-box {
  padding: .45rem .55rem;
  border-radius: 10px;
  background: var(--bg-elev, #fff);
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-cs-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
  line-height: 1.4;
}
.hp-cs-ul li { margin: .15rem 0; }
.hp-cs-alert-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
  line-height: 1.4;
}
.hp-cs-commit-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  resize: vertical;
  min-height: 4rem;
}
.hp-cs-nonadvice,
.hp-cs-nonadvice-fixed {
  font-size: .78rem;
  opacity: .9;
}
.hp-cs-faq {
  margin-top: 1.25rem;
}
.hp-cs-faq details {
  margin: .4rem 0;
  padding: .45rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-cs-faq summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .92rem;
}
@media (max-width: 900px) {
  .hp-cs-layout { grid-template-columns: 1fr; }
  .hp-cs-panel { position: static; }
  .hp-cs-hero { grid-template-columns: 1fr; }
  .hp-cs-hero-mascot { grid-column: 1; grid-row: auto; justify-self: start; }
  .hp-cs-gauges { grid-template-columns: 1fr 1fr; }
  .hp-cs-who { min-width: 100%; }
}

/* —— Oppuss for utleie (ll_reno / rent_out-oppuss-for-utleie) —— */
.hp-lreno-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-lreno-hero-mascot {
  border-radius: 14px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, #fff);
}
.hp-lreno-hero-copy { min-width: 0; grid-column: 2; }
.hp-lreno-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-lreno-lead-bullets li { margin: .15rem 0; }
.hp-lreno-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-lreno-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-lreno-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-lreno-how-list li { margin: .2rem 0; }
.hp-lreno-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .5rem;
  margin: .35rem 0 .55rem;
}
.hp-lreno-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: #fef3c7;
  color: #92400e;
  vertical-align: middle;
}
.hp-lreno-demo-note {
  margin: 0 0 .65rem;
  padding: .4rem .6rem;
  border-radius: 10px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-lreno-demos .chip {
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  border-radius: 999px;
  padding: .35rem .7rem;
  font-size: .86rem;
  cursor: pointer;
}
.hp-lreno-demos .chip:hover,
.hp-lreno-demos .chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, #fff);
}
.hp-lreno-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-lreno-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr);
  gap: 1.1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-lreno-layout { grid-template-columns: 1fr; }
  .hp-lreno-hero { grid-template-columns: auto 1fr; }
  .hp-lreno-panel { position: static; }
}
.hp-lreno-section {
  margin: 1rem 0 .45rem;
  font-size: 1.02rem;
  font-weight: 750;
  letter-spacing: -0.02em;
}
.hp-lreno-main .hp-lreno-section:first-child { margin-top: 0; }
.hp-lreno-packs,
.hp-lreno-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .45rem;
  margin: 0 0 .55rem;
}
.hp-lreno-packs .chip,
.hp-lreno-filters .chip {
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  border-radius: 999px;
  padding: .3rem .65rem;
  font-size: .84rem;
  cursor: pointer;
}
.hp-lreno-filters .chip-sm,
.hp-lreno-sorts .chip-sm { padding: .22rem .55rem; font-size: .8rem; }
.hp-lreno-filters .chip[aria-pressed="true"],
.hp-lreno-sorts .chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, #fff);
  font-weight: 650;
}
.hp-lreno-sorts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .45rem;
  margin: 0 0 .55rem;
}
.hp-lreno-sorts .chip {
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  border-radius: 999px;
  padding: .22rem .55rem;
  font-size: .8rem;
  cursor: pointer;
}
.hp-lreno-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-elev, #fff);
}
.hp-lreno-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .86rem;
  min-width: 820px;
}
.hp-lreno-table th,
.hp-lreno-table td {
  padding: .55rem .55rem;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
  text-align: left;
}
.hp-lreno-table thead th {
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--muted, #64748b);
  background: color-mix(in srgb, var(--bg) 70%, #fff);
  position: sticky;
  top: 0;
}
.hp-lreno-row.is-on {
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, #fff);
}
.hp-lreno-row.is-pack td:first-child {
  box-shadow: inset 3px 0 0 #0f766e;
}
.hp-lreno-row.is-over {
  background: color-mix(in srgb, #f59e0b 8%, #fff);
}
.hp-lreno-row.is-over td:first-child {
  box-shadow: inset 3px 0 0 #d97706;
}
.hp-lreno-name {
  display: block;
  font-weight: 650;
  font-size: .9rem;
}
.hp-lreno-hint {
  display: block;
  margin-top: .15rem;
  line-height: 1.35;
  max-width: 26rem;
}
.hp-lreno-check { display: inline-flex; align-items: center; }
.hp-lreno-cost,
.hp-lreno-lift {
  width: 6.5rem;
  max-width: 100%;
  font-variant-numeric: tabular-nums;
}
.hp-lreno-weeks-in {
  width: 3.6rem;
  font-variant-numeric: tabular-nums;
}
.hp-lreno-appeal-cell {
  white-space: nowrap;
  min-width: 7.5rem;
}
.hp-lreno-appeal {
  width: 5.5rem;
  vertical-align: middle;
}
.hp-lreno-appeal-val {
  display: inline-block;
  min-width: 1.1rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  margin-left: .25rem;
}
.hp-lreno-kind {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  padding: .15rem .4rem;
  border-radius: 999px;
  white-space: nowrap;
  background: #f1f5f9;
  color: #334155;
}
.hp-lreno-kind-quick { background: #dcfce7; color: #166534; }
.hp-lreno-kind-cosmetic { background: #e0f2fe; color: #075985; }
.hp-lreno-kind-major { background: #ffedd5; color: #9a3412; }
.hp-lreno-kind-fix { background: #fce7f3; color: #9d174d; }
.hp-lreno-kind-disclose { background: #f3e8ff; color: #6b21a8; }
.hp-lreno-dec {
  display: inline-block;
  font-size: .78rem;
  font-weight: 700;
  padding: .12rem .4rem;
  border-radius: 8px;
  background: #f1f5f9;
  color: #475569;
}
.hp-lreno-dec.is-do { background: #dcfce7; color: #166534; }
.hp-lreno-dec.is-fix { background: #fce7f3; color: #9d174d; }
.hp-lreno-dec.is-disclose { background: #f3e8ff; color: #6b21a8; }
.hp-lreno-dec.is-skip { background: #ffedd5; color: #9a3412; }
.hp-lreno-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .9rem 1rem;
  background: var(--bg-elev, #fff);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 60%, transparent);
}
.hp-lreno-triad {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin-bottom: .75rem;
}
.hp-lreno-triad-card {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .5rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-lreno-triad-card strong {
  font-size: 1.25rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.hp-lreno-triad-card.is-do { background: #f0fdf4; border-color: #86efac; }
.hp-lreno-triad-card.is-skip { background: #fffbeb; border-color: #fde68a; }
.hp-lreno-triad-card.is-disclose { background: #faf5ff; border-color: #d8b4fe; }
.hp-lreno-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  margin-bottom: .75rem;
}
.hp-lreno-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .65rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-lreno-gauge strong {
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.hp-lreno-bar-wrap { margin-bottom: .75rem; }
.hp-lreno-bar-label {
  display: flex;
  justify-content: space-between;
  margin-bottom: .25rem;
}
.hp-lreno-bar {
  height: 10px;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
}
.hp-lreno-bar-fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: #0f766e;
  transition: width .2s ease;
}
.hp-lreno-bar-fill.is-ok { background: #16a34a; }
.hp-lreno-bar-fill.is-mid { background: #d97706; }
.hp-lreno-bar-fill.is-over { background: #dc2626; }
.hp-lreno-status {
  border-radius: 12px;
  padding: .65rem .75rem;
  margin-bottom: .75rem;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-lreno-status.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-lreno-status.is-mid {
  border-color: #fde68a;
  background: #fffbeb;
}
.hp-lreno-status.is-tight {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-lreno-status-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-lreno-subh {
  margin: .85rem 0 .35rem;
  font-size: .9rem;
  font-weight: 750;
}
.hp-lreno-rank {
  margin: 0 0 .5rem;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-lreno-rank li { margin: .3rem 0; }
.hp-lreno-rank-top { font-weight: 650; }
.hp-lreno-actions {
  margin: 0 0 .5rem;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-lreno-actions li { margin: .28rem 0; }
.hp-lreno-act-do { color: #166534; }
.hp-lreno-act-fix { color: #9d174d; font-weight: 650; }
.hp-lreno-act-disclose { color: #6b21a8; }
.hp-lreno-act-skip { color: #9a3412; }
.hp-lreno-over-ul,
.hp-lreno-tips-ul {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-lreno-over-ul li,
.hp-lreno-tips-ul li { margin: .22rem 0; }
.hp-lreno-plan {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 9rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: .45rem .55rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-lreno-plan-label { display: block; margin-top: .35rem; }
.hp-lreno-nonadvice {
  margin-top: .55rem;
  font-size: .78rem;
}
.hp-lreno-faq {
  margin-top: 1rem;
}
.hp-lreno-faq > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-lreno-faq details {
  margin: .4rem 0 0;
  padding: .25rem 0 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-lreno-faq details summary {
  cursor: pointer;
  font-weight: 550;
  font-size: .88rem;
}
.hp-lreno-faq details p { margin: .35rem 0 .15rem; }
.hp-lreno-week-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-lreno-week-chips .chip {
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  border-radius: 999px;
  padding: .18rem .45rem;
  font-size: .76rem;
  cursor: pointer;
}
.hp-lreno-week-chips .chip:hover,
.hp-lreno-week-chips .chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, #fff);
}
.hp-lreno-score {
  display: inline-block;
  min-width: 2.2rem;
  font-size: .78rem;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  padding: .12rem .35rem;
  border-radius: 8px;
  background: #f1f5f9;
  color: #475569;
  text-align: center;
}
.hp-lreno-score.is-hi { background: #dcfce7; color: #166534; }
.hp-lreno-score.is-mid { background: #e0f2fe; color: #075985; }
.hp-lreno-score.is-lo { background: #ffedd5; color: #9a3412; }
.hp-lreno-score.is-disclose { background: #f3e8ff; color: #6b21a8; font-size: .7rem; }
.hp-lreno-score-cell {
  white-space: nowrap;
  min-width: 4.5rem;
}
.hp-lreno-pb {
  display: block;
  margin-top: .15rem;
  font-variant-numeric: tabular-nums;
  font-size: .72rem;
}
.hp-lreno-pb.is-hi { color: #166534; font-weight: 650; }
.hp-lreno-pb.is-mid { color: #075985; }
.hp-lreno-pb.is-lo { color: #9a3412; font-weight: 650; }
.hp-lreno-pb.is-na { color: var(--muted, #64748b); }
.hp-lreno-formula {
  margin: 0 0 .75rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, var(--bg-elev, #fff));
  display: flex;
  flex-direction: column;
  gap: .2rem;
}
.hp-lreno-formula-code {
  display: block;
  font-size: .82rem;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  word-break: break-word;
  white-space: pre-wrap;
}
.hp-lreno-scenarios {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin: 0 0 .35rem;
}
.hp-lreno-scen {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .5rem;
  display: flex;
  flex-direction: column;
  gap: .12rem;
  background: color-mix(in srgb, var(--bg) 40%, #fff);
}
.hp-lreno-scen strong {
  font-size: 1.05rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.hp-lreno-scen-tag {
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--muted, #64748b);
}
.hp-lreno-scen-apply {
  margin-top: .25rem;
  align-self: flex-start;
}
.hp-lreno-scen.is-a { border-color: #86efac; background: #f0fdf4; }
.hp-lreno-scen.is-b {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, #fff);
}
.hp-lreno-scen.is-c { border-color: #fde68a; background: #fffbeb; }
.hp-lreno-scen-note { margin: 0 0 .55rem; line-height: 1.4; }
.hp-lreno-sens-box {
  border: 1px solid #c4b5fd;
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: .55rem 0 .65rem;
  background: #f5f3ff;
}
.hp-lreno-sens-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
}
.hp-lreno-sens {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .45rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
  background: #fff;
}
.hp-lreno-sens strong {
  font-size: .98rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.hp-lreno-sens-tag {
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--muted, #64748b);
}
.hp-lreno-sens.is-lo { border-color: #fca5a5; background: #fef2f2; }
.hp-lreno-sens.is-base {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, #fff);
}
.hp-lreno-sens.is-hi { border-color: #86efac; background: #f0fdf4; }
.hp-lreno-cash-box {
  border: 1px solid #a5f3fc;
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: .55rem 0 .65rem;
  background: #ecfeff;
}
.hp-lreno-cash-box.is-pos {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-lreno-cash-box.is-neg {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-lreno-cash-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .4rem;
}
.hp-lreno-cash-grid > div {
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-lreno-cash-grid strong {
  font-size: 1rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.hp-lreno-cash-grid strong.is-pos { color: #166534; }
.hp-lreno-cash-grid strong.is-neg { color: #b91c1c; }
.hp-lreno-timeline {
  display: flex;
  flex-direction: column;
  gap: .35rem;
  margin: 0 0 .15rem;
}
.hp-lreno-tl-row {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr) auto;
  gap: .35rem .45rem;
  align-items: center;
  font-size: .78rem;
}
.hp-lreno-tl-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
}
.hp-lreno-tl-track {
  height: .45rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, #fff);
  overflow: hidden;
}
.hp-lreno-tl-fill {
  height: 100%;
  border-radius: 999px;
  background: #0f766e;
  min-width: 2px;
}
.hp-lreno-tl-fill.is-late { background: #d97706; }
.hp-lreno-tl-w {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  color: var(--muted, #64748b);
}
.hp-lreno-privacy {
  margin-top: .65rem;
  border-top: 1px solid var(--border);
  padding-top: .45rem;
}
.hp-lreno-privacy summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-lreno-privacy p { margin: .35rem 0 .1rem; }
.hp-lreno-context { margin: 0 0 .35rem; line-height: 1.4; }
.hp-lreno-rent-line { margin: 0 0 .55rem; line-height: 1.4; }
.hp-lreno-seed-hint {
  margin: 0 0 .5rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  background: #ecfeff;
  border: 1px solid #a5f3fc;
}
.hp-lreno-panel-actions { margin-top: .35rem; }
.hp-lreno-mobile-jump { display: none; }
.hp-lreno-table { min-width: 900px; }
.hp-lreno-scale,
.hp-lreno-buf-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .45rem;
  margin: 0 0 .55rem;
}
.hp-lreno-buf-chips { margin-top: .35rem; }
.hp-lreno-scale .chip,
.hp-lreno-buf-chips .chip {
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  border-radius: 999px;
  padding: .22rem .55rem;
  font-size: .8rem;
  cursor: pointer;
}
.hp-lreno-scale .chip:hover,
.hp-lreno-buf-chips .chip:hover,
.hp-lreno-buf-chips .chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, #fff);
  font-weight: 650;
}
.hp-lreno-buf-box {
  border: 1px solid #fde68a;
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: .55rem 0 .65rem;
  background: #fffbeb;
}
.hp-lreno-buf-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
}
.hp-lreno-buf-grid > div {
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-lreno-buf-grid strong {
  font-size: 1rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.hp-lreno-lightfull {
  border: 1px solid #93c5fd;
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: .55rem 0 .65rem;
  background: #eff6ff;
}
.hp-lreno-overinv {
  border: 1px solid #fca5a5;
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: .55rem 0 .65rem;
  background: #fef2f2;
}
.hp-lreno-workorder {
  margin: 0 0 .15rem;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-lreno-workorder li { margin: .28rem 0; }
.hp-lreno-wo-phase {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #0f766e;
  background: color-mix(in srgb, #0f766e 10%, #fff);
  border-radius: 6px;
  padding: .08rem .35rem;
  margin-right: .15rem;
}
@media (max-width: 900px) {
  .hp-lreno-mobile-jump { display: inline-flex; }
  .hp-lreno-scenarios { grid-template-columns: 1fr; }
  .hp-lreno-sens-grid { grid-template-columns: 1fr; }
  .hp-lreno-cash-grid { grid-template-columns: 1fr 1fr; }
  .hp-lreno-buf-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .hp-lreno-hero { grid-template-columns: 1fr; }
  .hp-lreno-hero-copy { grid-column: 1; }
  .hp-lreno-hero-mascot { grid-column: 1; grid-row: auto; justify-self: start; }
  .hp-lreno-gauges { grid-template-columns: 1fr; }
  .hp-lreno-triad { grid-template-columns: 1fr; }
  .hp-lreno-cash-grid { grid-template-columns: 1fr; }
  .hp-lreno-sens-grid { grid-template-columns: 1fr; }
  .hp-lreno-buf-grid { grid-template-columns: 1fr; }
  .hp-lreno-tl-row {
    grid-template-columns: 1fr auto;
  }
  .hp-lreno-tl-track { grid-column: 1 / -1; order: 3; }
}

/* —— Oppuss-budsjett + buffer (remodel-budsjett-buffer · remodel_budget) —— */
.hp-rmb { margin-top: .25rem; }
.hp-rmb-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-rmb-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-rmb-hero-copy { min-width: 0; }
.hp-rmb-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  color: var(--muted, #5b6470);
}
.hp-rmb-lead-bullets li { margin: .2rem 0; }
.hp-rmb-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-rmb-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rmb-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-rmb-how-list li { margin: .2rem 0; }
.hp-rmb-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  color: var(--brand);
  vertical-align: middle;
}
.hp-rmb-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .45rem;
  margin: 0 0 .65rem;
}
.hp-rmb-demos .chip {
  font-size: .82rem;
  padding: .28rem .65rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-rmb-demos .chip:hover,
.hp-rmb-demos .chip.active,
.hp-rmb-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-rmb-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-rmb-demo-note { margin: 0 0 .65rem; }
.hp-rmb-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.95fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 820px) {
  .hp-rmb-layout {
    grid-template-columns: 1fr;
    display: flex;
    flex-direction: column;
  }
  .hp-rmb-panel { order: -1; }
  .hp-rmb-hero { grid-template-columns: 1fr; }
  .hp-rmb-hero-mascot { width: 56px; height: 56px; }
}
.hp-rmb-section {
  margin: 1rem 0 .45rem;
  font-size: .95rem;
  letter-spacing: -0.01em;
}
.hp-rmb-section:first-child { margin-top: 0; }
.hp-rmb-quick-row,
.hp-rmb-packs,
.hp-rmb-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .4rem;
  margin: 0 0 .55rem;
}
.hp-rmb-quick .chip-sm,
.hp-rmb-filters .chip-sm,
.hp-rmb-packs .chip {
  font-size: .78rem;
  padding: .2rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-rmb-quick .chip-sm.active,
.hp-rmb-quick .chip-sm[aria-pressed="true"],
.hp-rmb-filters .chip-sm.active,
.hp-rmb-filters .chip-sm[aria-pressed="true"],
.hp-rmb-packs .chip.active,
.hp-rmb-packs .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  font-weight: 650;
}
.hp-rmb-lines {
  display: flex;
  flex-direction: column;
  gap: .55rem;
}
.hp-rmb-line {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem .65rem;
  background: var(--bg-elev, #fff);
  opacity: .72;
  transition: opacity .15s ease, border-color .15s ease;
}
.hp-rmb-line.is-on {
  opacity: 1;
  border-color: color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 4%, var(--bg-elev, #fff));
}
.hp-rmb-line-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .5rem;
}
.hp-rmb-line-on {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-weight: 650;
  font-size: .9rem;
  cursor: pointer;
  margin-right: .15rem;
}
.hp-rmb-line-label { user-select: none; }
.hp-rmb-pri {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  padding: .12rem .4rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  letter-spacing: .01em;
}
.hp-rmb-pri-must {
  background: color-mix(in srgb, #c45c26 14%, var(--bg-elev));
  border-color: color-mix(in srgb, #c45c26 40%, var(--border));
  color: #8a3a12;
}
.hp-rmb-pri-nice {
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-rmb-pri-later {
  background: color-mix(in srgb, var(--muted, #888) 12%, var(--bg-elev));
  opacity: .95;
}
.hp-rmb-pri-mini {
  font-size: .68rem;
  font-weight: 700;
  padding: .05rem .3rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  margin-left: .25rem;
  vertical-align: middle;
}
.hp-rmb-line-fields {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: .45rem .65rem;
  margin-top: .4rem;
  align-items: end;
}
@media (max-width: 560px) {
  .hp-rmb-line-fields { grid-template-columns: 1fr 1fr; }
  .hp-rmb-line-share { grid-column: 1 / -1; text-align: left; }
}
.hp-rmb-line-share {
  min-width: 4.5rem;
  text-align: right;
  padding-bottom: .15rem;
}
.hp-rmb-line-share strong {
  display: block;
  font-size: .92rem;
  font-variant-numeric: tabular-nums;
}
.hp-rmb-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem 1rem;
  background: var(--bg-elev, #fff);
  max-height: calc(100vh - 1.5rem);
  overflow: auto;
}
.hp-rmb-live {
  text-align: center;
  margin-bottom: .65rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid var(--border);
}
.hp-rmb-live .hp-bid-num {
  font-size: 1.65rem;
  font-weight: 750;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.hp-rmb-nonadvice-fixed {
  margin: .35rem 0 0;
  font-size: .76rem;
  opacity: .9;
}
.hp-rmb-status { margin: .35rem 0 0; font-weight: 550; }
.hp-rmb-status.is-over { color: #b42318; }
.hp-rmb-status.is-tight { color: #b54708; }
.hp-rmb-status.is-ok { color: #027a48; }
.hp-rmb-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .55rem 0 .7rem;
}
.hp-rmb-gauges .hp-gauge {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .5rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-rmb-gauges .hp-gauge strong {
  display: block;
  font-size: .95rem;
  font-variant-numeric: tabular-nums;
  margin-top: .1rem;
}
.hp-rmb-bar-wrap {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
  margin-bottom: .35rem;
}
.hp-rmb-bar { height: 100%; width: 100%; }
.hp-rmb-fill {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: 999px;
  background: var(--brand);
  transition: width .2s ease, background .15s ease;
}
.hp-rmb-fill.is-ok { background: #12b76a; }
.hp-rmb-fill.is-tight { background: #f79009; }
.hp-rmb-fill.is-over { background: #f04438; }
.hp-rmb-fill.is-low { background: color-mix(in srgb, var(--brand) 70%, #12b76a); }
.hp-rmb-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .84rem;
  margin-top: .25rem;
}
.hp-rmb-table th,
.hp-rmb-table td {
  text-align: left;
  padding: .28rem .2rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 75%, transparent);
  font-variant-numeric: tabular-nums;
}
.hp-rmb-table th {
  font-weight: 550;
  color: var(--muted, #5b6470);
  width: 55%;
}
.hp-rmb-scen-table thead th {
  font-size: .78rem;
  font-weight: 650;
}
.hp-rmb-scen-table tr.is-current {
  background: color-mix(in srgb, var(--brand) 10%, transparent);
  font-weight: 650;
}
.hp-rmb-scen-table tr.is-over td:last-child { color: #b42318; }
.hp-rmb-line-sum {
  list-style: none;
  margin: 0;
  padding: 0;
}
.hp-rmb-line-sum li {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  padding: .22rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  font-size: .84rem;
}
.hp-rmb-line-sum li strong {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.hp-rmb-tip-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  color: var(--muted, #5b6470);
}
.hp-rmb-tip-list li { margin: .25rem 0; }
.hp-rmb-faq,
.hp-rmb-privacy {
  margin-top: .85rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
}
.hp-rmb-faq > summary,
.hp-rmb-privacy > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rmb-faq details {
  margin: .4rem 0 0;
  padding: .25rem 0 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-rmb-faq details summary {
  cursor: pointer;
  font-weight: 550;
  font-size: .88rem;
}
.hp-rmb-faq details p { margin: .35rem 0 .15rem; }
.hp-rmb-formula {
  margin: .15rem 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-rmb-formula-line {
  margin: 0;
  font-weight: 650;
  font-size: .92rem;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  word-break: break-word;
}
.hp-rmb-packs-cmp { margin: .55rem 0 .7rem; }
.hp-rmb-pack-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .4rem;
}
@media (max-width: 420px) {
  .hp-rmb-pack-grid { grid-template-columns: 1fr; }
}
.hp-rmb-pack-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .15rem;
  text-align: left;
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev, #fff));
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.hp-rmb-pack-card:hover,
.hp-rmb-pack-card:focus-visible {
  border-color: var(--brand);
  outline: none;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-rmb-pack-card strong {
  font-size: .95rem;
  font-variant-numeric: tabular-nums;
}
.hp-rmb-pack-card.is-full {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
}
.hp-rmb-scen-row {
  cursor: pointer;
}
.hp-rmb-scen-row:hover td {
  background: color-mix(in srgb, var(--brand) 8%, transparent);
}
.hp-rmb-scen-row:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: -2px;
}
.hp-rmb-panel-actions { margin-top: .45rem; }
.hp-rmb-temp {
  display: inline-block;
  margin: .4rem 0 0;
  font-size: .78rem;
  font-weight: 750;
  letter-spacing: .02em;
  padding: .18rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-rmb-temp.is-ok {
  color: #027a48;
  border-color: color-mix(in srgb, #12b76a 45%, var(--border));
  background: color-mix(in srgb, #12b76a 12%, var(--bg-elev, #fff));
}
.hp-rmb-temp.is-tight {
  color: #b54708;
  border-color: color-mix(in srgb, #f79009 45%, var(--border));
  background: color-mix(in srgb, #f79009 12%, var(--bg-elev, #fff));
}
.hp-rmb-temp.is-over {
  color: #b42318;
  border-color: color-mix(in srgb, #f04438 45%, var(--border));
  background: color-mix(in srgb, #f04438 12%, var(--bg-elev, #fff));
}
.hp-rmb-empty-cta {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .4rem;
  margin-top: .15rem;
}
.hp-rmb-empty-cta .chip {
  font-size: .8rem;
  padding: .25rem .6rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-rmb-empty-cta .chip:hover {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-rmb-scale-row {
  margin: .45rem 0 .65rem;
  padding: .45rem .55rem .5rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-rmb-water {
  margin: .4rem 0 .35rem;
}
.hp-rmb-water-track {
  display: flex;
  width: 100%;
  height: 1.15rem;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--border) 55%, transparent);
  border: 1px solid var(--border);
}
.hp-rmb-wseg {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 100%;
  font-size: .62rem;
  font-weight: 650;
  color: #fff;
  overflow: hidden;
  white-space: nowrap;
}
.hp-rmb-wseg-lbl {
  padding: 0 .2rem;
  text-shadow: 0 0 2px rgba(0,0,0,.35);
}
.hp-rmb-wseg.is-have { background: #667085; }
.hp-rmb-wseg.is-sum { background: color-mix(in srgb, var(--brand) 88%, #1d4ed8); }
.hp-rmb-wseg.is-buf { background: #f79009; }
.hp-rmb-wseg.is-room { background: #12b76a; color: #052e1c; text-shadow: none; }
.hp-rmb-wseg.is-over { background: #f04438; }
.hp-rmb-water-cap { margin: .3rem 0 0; }
.hp-rmb-over-lab { color: #b42318; }
button[data-rmb-scale-fit]:disabled {
  opacity: .45;
  cursor: not-allowed;
}
@media (max-width: 560px) {
  .hp-rmb-gauges { grid-template-columns: 1fr; }
  .hp-rmb-wseg-lbl { font-size: .55rem; }
}

/* —— Nybygg-budsjett (build-budsjett-nybygg · build_budget) —— */
.hp-bb { margin-top: .25rem; }
.hp-bb-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-bb-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-bb-hero-copy { min-width: 0; }
.hp-bb-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  color: var(--muted, #5b6470);
}
.hp-bb-lead-bullets li { margin: .2rem 0; }
.hp-bb-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-bb-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-bb-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-bb-how-list li { margin: .2rem 0; }
.hp-bb-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  color: var(--brand);
  vertical-align: middle;
}
.hp-bb-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .45rem;
  margin: 0 0 .65rem;
}
.hp-bb-demos .chip {
  font-size: .82rem;
  padding: .28rem .65rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-bb-demos .chip:hover,
.hp-bb-demos .chip.active,
.hp-bb-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-bb-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-bb-demo-note { margin: 0 0 .65rem; }
.hp-bb-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.95fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 820px) {
  .hp-bb-layout {
    grid-template-columns: 1fr;
    display: flex;
    flex-direction: column;
  }
  .hp-bb-panel { order: -1; }
  .hp-bb-hero { grid-template-columns: 1fr; }
  .hp-bb-hero-mascot { width: 56px; height: 56px; }
}
.hp-bb-section {
  margin: 1rem 0 .45rem;
  font-size: .95rem;
  letter-spacing: -0.01em;
}
.hp-bb-section:first-child { margin-top: 0; }
.hp-bb-quick-row,
.hp-bb-packs,
.hp-bb-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .4rem;
  margin: 0 0 .55rem;
}
.hp-bb-quick .chip-sm,
.hp-bb-filters .chip-sm,
.hp-bb-packs .chip {
  font-size: .78rem;
  padding: .2rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-bb-quick .chip-sm.active,
.hp-bb-quick .chip-sm[aria-pressed="true"],
.hp-bb-filters .chip-sm.active,
.hp-bb-filters .chip-sm[aria-pressed="true"],
.hp-bb-packs .chip.active,
.hp-bb-packs .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  font-weight: 650;
}
.hp-bb-lines {
  display: flex;
  flex-direction: column;
  gap: .55rem;
}
.hp-bb-line {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem .65rem;
  background: var(--bg-elev, #fff);
  opacity: .72;
  transition: opacity .15s ease, border-color .15s ease;
}
.hp-bb-line.is-on {
  opacity: 1;
  border-color: color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 4%, var(--bg-elev, #fff));
}
.hp-bb-line-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .5rem;
}
.hp-bb-line-on {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-weight: 650;
  font-size: .9rem;
  cursor: pointer;
  margin-right: .15rem;
}
.hp-bb-line-label { user-select: none; }
.hp-bb-pri {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  padding: .12rem .4rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  letter-spacing: .01em;
}
.hp-bb-pri-must {
  background: color-mix(in srgb, #c45c26 14%, var(--bg-elev));
  border-color: color-mix(in srgb, #c45c26 40%, var(--border));
  color: #8a3a12;
}
.hp-bb-pri-nice {
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-bb-pri-later {
  background: color-mix(in srgb, var(--muted, #888) 12%, var(--bg-elev));
  opacity: .95;
}
.hp-bb-pri-mini {
  font-size: .68rem;
  font-weight: 700;
  padding: .05rem .3rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  margin-left: .25rem;
  vertical-align: middle;
}
.hp-bb-line-fields {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: .45rem .65rem;
  margin-top: .4rem;
  align-items: end;
}
@media (max-width: 560px) {
  .hp-bb-line-fields { grid-template-columns: 1fr 1fr; }
  .hp-bb-line-share { grid-column: 1 / -1; text-align: left; }
}
.hp-bb-line-share {
  min-width: 4.5rem;
  text-align: right;
  padding-bottom: .15rem;
}
.hp-bb-line-share strong {
  display: block;
  font-size: .92rem;
  font-variant-numeric: tabular-nums;
}
.hp-bb-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem 1rem;
  background: var(--bg-elev, #fff);
  max-height: calc(100vh - 1.5rem);
  overflow: auto;
}
.hp-bb-live {
  text-align: center;
  margin-bottom: .65rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid var(--border);
}
.hp-bb-live .hp-bid-num {
  font-size: 1.65rem;
  font-weight: 750;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.hp-bb-nonadvice-fixed {
  margin: .35rem 0 0;
  font-size: .76rem;
  opacity: .9;
}
.hp-bb-status { margin: .35rem 0 0; font-weight: 550; }
.hp-bb-status.is-over { color: #b42318; }
.hp-bb-status.is-tight { color: #b54708; }
.hp-bb-status.is-ok { color: #027a48; }
.hp-bb-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .55rem 0 .7rem;
}
.hp-bb-gauges .hp-gauge {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .5rem;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-bb-gauges .hp-gauge strong {
  display: block;
  font-size: .95rem;
  font-variant-numeric: tabular-nums;
  margin-top: .1rem;
}
.hp-bb-bar-wrap {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
  margin-bottom: .35rem;
}
.hp-bb-bar { height: 100%; width: 100%; }
.hp-bb-fill {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: 999px;
  background: var(--brand);
  transition: width .2s ease, background .15s ease;
}
.hp-bb-fill.is-ok { background: #12b76a; }
.hp-bb-fill.is-tight { background: #f79009; }
.hp-bb-fill.is-over { background: #f04438; }
.hp-bb-fill.is-low { background: color-mix(in srgb, var(--brand) 70%, #12b76a); }
.hp-bb-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .84rem;
  margin-top: .25rem;
}
.hp-bb-table th,
.hp-bb-table td {
  text-align: left;
  padding: .28rem .2rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 75%, transparent);
  font-variant-numeric: tabular-nums;
}
.hp-bb-table th {
  font-weight: 550;
  color: var(--muted, #5b6470);
  width: 55%;
}
.hp-bb-scen-table thead th {
  font-size: .78rem;
  font-weight: 650;
}
.hp-bb-scen-table tr.is-current {
  background: color-mix(in srgb, var(--brand) 10%, transparent);
  font-weight: 650;
}
.hp-bb-scen-table tr.is-over td:last-child { color: #b42318; }
.hp-bb-line-sum {
  list-style: none;
  margin: 0;
  padding: 0;
}
.hp-bb-line-sum li {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  padding: .22rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  font-size: .84rem;
}
.hp-bb-line-sum li strong {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.hp-bb-tip-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  color: var(--muted, #5b6470);
}
.hp-bb-tip-list li { margin: .25rem 0; }
.hp-bb-formula {
  margin: .15rem 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-bb-formula-line {
  margin: 0;
  font-weight: 650;
  font-size: .92rem;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  word-break: break-word;
}
.hp-bb-packs-cmp { margin: .55rem 0 .7rem; }
.hp-bb-pack-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .4rem;
}
@media (max-width: 420px) {
  .hp-bb-pack-grid { grid-template-columns: 1fr; }
}
.hp-bb-pack-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .15rem;
  text-align: left;
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev, #fff));
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.hp-bb-pack-card:hover,
.hp-bb-pack-card:focus-visible {
  border-color: var(--brand);
  outline: none;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-bb-pack-card strong {
  font-size: .95rem;
  font-variant-numeric: tabular-nums;
}
.hp-bb-pack-card.is-full {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
}
.hp-bb-scen-row {
  cursor: pointer;
}
.hp-bb-scen-row:hover td {
  background: color-mix(in srgb, var(--brand) 8%, transparent);
}
.hp-bb-scen-row:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: -2px;
}
.hp-bb-panel-actions { margin-top: .45rem; }
.hp-bb-scale-row {
  margin: .45rem 0 .65rem;
  padding: .45rem .55rem .5rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-bb-water {
  margin: .4rem 0 .35rem;
}
.hp-bb-water-track {
  display: flex;
  width: 100%;
  height: 1.15rem;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--border) 55%, transparent);
  border: 1px solid var(--border);
}
.hp-bb-wseg {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 100%;
  font-size: .62rem;
  font-weight: 650;
  color: #fff;
  overflow: hidden;
  white-space: nowrap;
}
.hp-bb-wseg-lbl {
  padding: 0 .2rem;
  text-shadow: 0 0 2px rgba(0,0,0,.35);
}
.hp-bb-wseg.is-have { background: #667085; }
.hp-bb-wseg.is-sum { background: color-mix(in srgb, var(--brand) 88%, #1d4ed8); }
.hp-bb-wseg.is-buf { background: #f79009; }
.hp-bb-wseg.is-room { background: #12b76a; color: #052e1c; text-shadow: none; }
.hp-bb-wseg.is-over { background: #f04438; }
.hp-bb-water-cap { margin: .3rem 0 0; }
.hp-bb-over-lab { color: #b42318; }
button[data-bb-scale-fit]:disabled {
  opacity: .45;
  cursor: not-allowed;
}
.hp-bb-upsell a { font-weight: 600; }
.hp-bb-faq,
.hp-bb-privacy {
  margin-top: .85rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
}
@media (max-width: 560px) {
  .hp-bb-gauges { grid-template-columns: 1fr; }
  .hp-bb-wseg-lbl { font-size: .55rem; }
}
.hp-bb-faq > summary,
.hp-bb-privacy > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-bb-faq details {
  margin: .4rem 0 0;
  padding: .25rem 0 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-bb-faq details summary {
  cursor: pointer;
  font-weight: 550;
  font-size: .88rem;
}
.hp-bb-faq details p { margin: .35rem 0 .15rem; }

/* Temperatur, kostnadssentre, snapshot, kr/m²-bånd */
.hp-bb-live-top {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  flex-wrap: wrap;
}
.hp-bb-temp {
  display: inline-block;
  font-size: .72rem;
  font-weight: 750;
  letter-spacing: .03em;
  text-transform: uppercase;
  padding: .12rem .45rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  vertical-align: middle;
}
.hp-bb-temp.is-ok {
  background: color-mix(in srgb, #12b76a 16%, var(--bg-elev));
  border-color: color-mix(in srgb, #12b76a 45%, var(--border));
  color: #027a48;
}
.hp-bb-temp.is-tight {
  background: color-mix(in srgb, #f79009 16%, var(--bg-elev));
  border-color: color-mix(in srgb, #f79009 45%, var(--border));
  color: #b54708;
}
.hp-bb-temp.is-over {
  background: color-mix(in srgb, #f04438 16%, var(--bg-elev));
  border-color: color-mix(in srgb, #f04438 45%, var(--border));
  color: #b42318;
}
.hp-bb-temp.is-empty {
  background: color-mix(in srgb, var(--muted, #888) 12%, var(--bg-elev));
  color: var(--muted, #5b6470);
}
.hp-bb-kvm-band {
  margin: .45rem 0 .65rem;
  padding: .4rem .55rem .45rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev, #fff));
}
.hp-bb-kvm-band.is-lav {
  border-color: color-mix(in srgb, #12b76a 35%, var(--border));
}
.hp-bb-kvm-band.is-mid {
  border-color: color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-bb-kvm-band.is-hoy {
  border-color: color-mix(in srgb, #f79009 40%, var(--border));
}
.hp-bb-cats {
  margin: .45rem 0 .7rem;
}
.hp-bb-cat-bar {
  display: flex;
  width: 100%;
  height: .7rem;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--border) 50%, transparent);
  margin-bottom: .4rem;
}
.hp-bb-cseg {
  display: block;
  height: 100%;
  min-width: 2px;
}
.hp-bb-cseg.is-tomt { background: #667085; }
.hp-bb-cseg.is-skall { background: #1d4ed8; }
.hp-bb-cseg.is-teknikk { background: #0f766e; }
.hp-bb-cseg.is-innred { background: #7c3aed; }
.hp-bb-cseg.is-soft { background: #b54708; }
.hp-bb-cseg.is-fase2 { background: #98a2b3; }
.hp-bb-cat-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.hp-bb-cat-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .4rem;
  padding: .18rem 0;
  font-size: .82rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
}
.hp-bb-cat-list li strong {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.hp-bb-cat-dot {
  display: inline-block;
  width: .55rem;
  height: .55rem;
  border-radius: 999px;
  margin-right: .35rem;
  flex-shrink: 0;
  vertical-align: middle;
}
.hp-bb-cat-dot-tomt_grunn { background: #667085; }
.hp-bb-cat-dot-skall { background: #1d4ed8; }
.hp-bb-cat-dot-teknikk { background: #0f766e; }
.hp-bb-cat-dot-innred { background: #7c3aed; }
.hp-bb-cat-dot-soft { background: #b54708; }
.hp-bb-cat-dot-fase2 { background: #98a2b3; }
.hp-bb-snap {
  margin: .45rem 0 .65rem;
  padding: .45rem .55rem .5rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev, #fff));
}
button[data-bb-undo]:disabled,
button[data-bb-snap-cmp]:disabled {
  opacity: .45;
  cursor: not-allowed;
}

/* —— Tiltaks-prioritet / remodel_roi (remodel-roi-tiltak) —— */
.hp-rroi-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-rroi-hero-mascot {
  border-radius: 14px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, #fff);
}
.hp-rroi-hero-copy { min-width: 0; grid-column: 2; }
.hp-rroi-lead-bullets {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-rroi-lead-bullets li { margin: .15rem 0; }
.hp-rroi-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  background: color-mix(in srgb, var(--bg) 55%, var(--bg-elev, #fff));
}
.hp-rroi-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-rroi-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-rroi-how-list li { margin: .2rem 0; }
.hp-rroi-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .5rem;
  margin-bottom: .65rem;
}
.hp-rroi-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 750;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
  border: 1px solid #fcd34d;
}
.hp-rroi-demo-note {
  margin: 0 0 .85rem;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-rroi-demos .chip {
  font-size: .82rem;
  font-weight: 600;
}
.hp-rroi-demos .chip:hover,
.hp-rroi-demos .chip[aria-pressed="true"] {
  border-color: var(--brand, #0f766e);
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, #fff);
}
.hp-rroi-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-rroi-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .95fr);
  gap: 1rem 1.25rem;
  align-items: start;
}
@media (max-width: 960px) {
  .hp-rroi-layout { grid-template-columns: 1fr; }
  .hp-rroi-hero { grid-template-columns: auto 1fr; }
}
.hp-rroi-section {
  font-size: 1.05rem;
  font-weight: 700;
  margin: 1rem 0 .5rem;
  letter-spacing: -0.01em;
}
.hp-rroi-main .hp-rroi-section:first-child { margin-top: 0; }
.hp-rroi-packs,
.hp-rroi-filters,
.hp-rroi-scale-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .45rem;
  margin: 0 0 .55rem;
}
.hp-rroi-scale-row {
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--border) 80%, transparent);
  background: color-mix(in srgb, var(--bg) 60%, #fff);
}
.hp-rroi-empty-ctas { margin-top: .45rem; }
.hp-rroi-lightfull {
  margin: 0 0 .65rem;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid #fcd34d;
  background: #fffbeb;
}
.hp-rroi-workorder {
  margin: 0 0 .15rem;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-rroi-workorder li {
  margin: .2rem 0;
  cursor: pointer;
  border-radius: 6px;
  padding: .05rem .15rem;
}
.hp-rroi-workorder li:hover {
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, transparent);
}
.hp-rroi-workorder .hp-rroi-rank-top {
  font-weight: 650;
}
.hp-rroi-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-elev, #fff);
}
.hp-rroi-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
  font-size: .86rem;
}
.hp-rroi-table th,
.hp-rroi-table td {
  padding: .45rem .5rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  vertical-align: top;
  text-align: left;
}
.hp-rroi-table thead th {
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--muted, #5b6470);
  background: color-mix(in srgb, var(--bg) 70%, #fff);
  position: sticky;
  top: 0;
  z-index: 1;
}
.hp-rroi-row.is-on {
  background: color-mix(in srgb, var(--brand, #0f766e) 5%, transparent);
}
.hp-rroi-row.is-pack td:first-child {
  box-shadow: inset 3px 0 0 #16a34a;
}
.hp-rroi-row.is-over {
  background: color-mix(in srgb, #fbbf24 10%, transparent);
}
.hp-rroi-row.is-over td:first-child {
  box-shadow: inset 3px 0 0 #d97706;
}
.hp-rroi-name {
  display: block;
  font-weight: 650;
  line-height: 1.25;
}
.hp-rroi-hint {
  display: block;
  margin-top: .15rem;
  line-height: 1.3;
  max-width: 22rem;
}
.hp-rroi-check { display: inline-flex; align-items: center; }
.hp-rroi-cost {
  width: 7.2rem;
  max-width: 100%;
}
.hp-rroi-weeks-in {
  width: 3.6rem;
}
.hp-rroi-util-cell {
  white-space: nowrap;
  min-width: 7.5rem;
}
.hp-rroi-util {
  width: 5.5rem;
  vertical-align: middle;
}
.hp-rroi-util-val {
  display: inline-block;
  min-width: 1.1rem;
  font-weight: 700;
  margin-left: .2rem;
  font-variant-numeric: tabular-nums;
}
.hp-rroi-kind {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  padding: .12rem .4rem;
  border-radius: 999px;
  white-space: nowrap;
}
.hp-rroi-kind-must { background: #fee2e2; color: #991b1b; }
.hp-rroi-kind-comfort { background: #dbeafe; color: #1e40af; }
.hp-rroi-kind-energy { background: #d1fae5; color: #065f46; }
.hp-rroi-kind-cosmetic { background: #f3e8ff; color: #6b21a8; }
.hp-rroi-kind-major { background: #ffedd5; color: #9a3412; }
.hp-rroi-kind-later { background: #e5e7eb; color: #374151; }
.hp-rroi-dec {
  display: inline-block;
  font-size: .75rem;
  font-weight: 700;
  padding: .12rem .4rem;
  border-radius: 8px;
  background: #f3f4f6;
  color: #4b5563;
  white-space: nowrap;
}
.hp-rroi-dec.is-do { background: #dcfce7; color: #166534; }
.hp-rroi-dec.is-must { background: #fee2e2; color: #991b1b; }
.hp-rroi-dec.is-skip { background: #fef3c7; color: #92400e; }
.hp-rroi-dec.is-later { background: #e5e7eb; color: #374151; }
.hp-rroi-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem 1rem 1rem;
  background: var(--bg-elev, #fff);
  box-shadow: 0 1px 2px color-mix(in srgb, #000 6%, transparent);
}
.hp-rroi-empty { margin: 0; }
.hp-rroi-triad {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin: 0 0 .75rem;
}
.hp-rroi-triad-card {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .45rem;
  text-align: center;
}
.hp-rroi-triad-card strong {
  display: block;
  font-size: 1.25rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}
.hp-rroi-triad-card.is-do { border-color: #86efac; background: #f0fdf4; }
.hp-rroi-triad-card.is-skip { border-color: #fde68a; background: #fffbeb; }
.hp-rroi-triad-card.is-later { border-color: #d1d5db; background: #f9fafb; }
.hp-rroi-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: 0 0 .75rem;
}
.hp-rroi-gauge {
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  border-radius: 10px;
  padding: .4rem .5rem;
  background: color-mix(in srgb, var(--bg) 50%, #fff);
}
.hp-rroi-gauge strong {
  display: block;
  font-size: 1.02rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.25;
}
.hp-rroi-bar-wrap { margin: 0 0 .75rem; }
.hp-rroi-bar-label {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  margin-bottom: .25rem;
}
.hp-rroi-bar {
  height: .55rem;
  border-radius: 999px;
  background: #e5e7eb;
  overflow: hidden;
}
.hp-rroi-bar-fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  transition: width .2s ease;
  background: #16a34a;
}
.hp-rroi-bar-fill.is-ok { background: #16a34a; }
.hp-rroi-bar-fill.is-mid { background: #d97706; }
.hp-rroi-bar-fill.is-over { background: #dc2626; }
.hp-rroi-water {
  margin: 0 0 .75rem;
  padding: .45rem .5rem .5rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-rroi-water-label {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: .5rem;
  margin-bottom: .3rem;
}
.hp-rroi-water-track {
  display: flex;
  width: 100%;
  height: 1.15rem;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--border) 55%, transparent);
  border: 1px solid var(--border);
}
.hp-rroi-wseg {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 100%;
  font-size: .62rem;
  font-weight: 650;
  color: #fff;
  overflow: hidden;
  white-space: nowrap;
}
.hp-rroi-wseg-lbl {
  padding: 0 .2rem;
  text-shadow: 0 0 2px rgba(0,0,0,.35);
}
.hp-rroi-wseg.is-pack { background: color-mix(in srgb, var(--brand, #0f766e) 88%, #1d4ed8); }
.hp-rroi-wseg.is-buf { background: #f79009; }
.hp-rroi-wseg.is-room { background: #12b76a; color: #052e1c; text-shadow: none; }
.hp-rroi-wseg.is-over { background: #f04438; }
.hp-rroi-water-legend { line-height: 1.35; }
.hp-rroi-safety {
  margin: 0 0 .75rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid #fca5a5;
  background: #fef2f2;
}
.hp-rroi-safety .hp-rroi-subh { color: #991b1b; }
.hp-rroi-status {
  border-radius: 10px;
  padding: .5rem .65rem;
  margin: 0 0 .55rem;
  border: 1px solid #bbf7d0;
  background: #f0fdf4;
}
.hp-rroi-status.is-mid {
  border-color: #fde68a;
  background: #fffbeb;
}
.hp-rroi-status.is-tight {
  border-color: #fecaca;
  background: #fef2f2;
}
.hp-rroi-status-title {
  margin: 0 0 .15rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-rroi-context {
  margin: 0 0 .55rem;
  line-height: 1.4;
}
.hp-rroi-subh {
  font-size: .9rem;
  font-weight: 700;
  margin: .7rem 0 .3rem;
}
.hp-rroi-rank {
  margin: 0 0 .5rem;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-rroi-rank li { margin: .2rem 0; }
.hp-rroi-rank-top { font-weight: 600; }
.hp-rroi-actions {
  margin: 0 0 .5rem;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-rroi-actions li { margin: .2rem 0; }
.hp-rroi-act-do { color: #166534; }
.hp-rroi-act-must { color: #991b1b; font-weight: 600; }
.hp-rroi-act-skip { color: #92400e; }
.hp-rroi-act-later { color: #4b5563; }
.hp-rroi-over {
  margin: .5rem 0;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-rroi-over-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-rroi-tips {
  margin: .55rem 0;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: color-mix(in srgb, var(--bg) 60%, #fff);
  border: 1px solid var(--border);
}
.hp-rroi-tips-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-rroi-tips-ul li { margin: .2rem 0; }
.hp-rroi-plan {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 8rem;
}
.hp-rroi-plan-label { display: block; margin: .35rem 0 .2rem; }
.hp-rroi-nonadvice {
  margin: .55rem 0 0;
  padding-top: .4rem;
  border-top: 1px dashed var(--border);
}
.hp-rroi-seed-hint {
  margin: 0 0 .5rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  background: #ecfeff;
  border: 1px solid #a5f3fc;
}
.hp-rroi-panel-actions { margin-top: .35rem; }
.hp-rroi-faq {
  margin-top: .85rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
}
.hp-rroi-faq > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rroi-faq details {
  margin: .4rem 0 0;
  padding: .25rem 0 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-rroi-faq details summary {
  cursor: pointer;
  font-weight: 550;
  font-size: .88rem;
}
.hp-rroi-faq details p { margin: .35rem 0 .15rem; }
.hp-rroi-privacy {
  margin-top: .55rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
}
.hp-rroi-privacy > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .88rem;
}
.hp-rroi-privacy p { margin: .35rem 0 .1rem; }
.hp-rroi-budget-chips,
.hp-rroi-week-chips,
.hp-rroi-buf-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-rroi-score {
  display: inline-block;
  font-size: .78rem;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  padding: .1rem .35rem;
  border-radius: 8px;
  background: #f3f4f6;
  color: #4b5563;
  min-width: 2.2rem;
  text-align: center;
}
.hp-rroi-score.is-hi { background: #dcfce7; color: #166534; }
.hp-rroi-score.is-mid { background: #fef3c7; color: #92400e; }
.hp-rroi-score.is-lo { background: #fee2e2; color: #991b1b; }
.hp-rroi-score.is-later { background: #e5e7eb; color: #374151; font-size: .7rem; }
.hp-rroi-row.is-flash {
  outline: 2px solid var(--brand, #0f766e);
  outline-offset: -2px;
  transition: outline-color .3s ease;
}
.hp-rroi-formel {
  margin: 0 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 25%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, #fff);
}
.hp-rroi-formel code {
  display: block;
  font-size: .78rem;
  line-height: 1.35;
  word-break: break-word;
  margin-top: .2rem;
  white-space: pre-wrap;
}
.hp-rroi-scenarios {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin: 0 0 .35rem;
}
.hp-rroi-scen {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .45rem .5rem;
  display: flex;
  flex-direction: column;
  gap: .15rem;
  background: color-mix(in srgb, var(--bg) 45%, #fff);
}
.hp-rroi-scen strong {
  font-size: 1rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}
.hp-rroi-scen-tag {
  font-size: .72rem;
  font-weight: 750;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: var(--muted, #5b6470);
}
.hp-rroi-scen.is-a { border-color: #fecaca; background: #fef2f2; }
.hp-rroi-scen.is-b { border-color: #86efac; background: #f0fdf4; }
.hp-rroi-scen.is-c { border-color: #93c5fd; background: #eff6ff; }
.hp-rroi-scen .btn { margin-top: .25rem; align-self: flex-start; }
.hp-rroi-scen-note { margin: 0 0 .55rem; line-height: 1.35; }
.hp-rroi-buf-box {
  margin: 0 0 .65rem;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid #a5f3fc;
  background: #ecfeff;
}
.hp-rroi-buf-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .35rem;
}
.hp-rroi-buf-grid strong {
  display: block;
  font-size: .95rem;
  font-variant-numeric: tabular-nums;
}
.hp-rroi-timeline {
  display: flex;
  flex-direction: column;
  gap: .35rem;
  margin: 0 0 .15rem;
}
.hp-rroi-tl-row {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr) auto;
  gap: .35rem .45rem;
  align-items: center;
  font-size: .8rem;
}
.hp-rroi-tl-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
}
.hp-rroi-tl-track {
  height: .45rem;
  border-radius: 999px;
  background: #e5e7eb;
  overflow: hidden;
}
.hp-rroi-tl-bar {
  height: 100%;
  border-radius: 999px;
  background: #0d9488;
  min-width: 2px;
}
.hp-rroi-tl-bar.is-must { background: #dc2626; }
.hp-rroi-tl-w {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  color: var(--muted, #5b6470);
  white-space: nowrap;
}
.hp-rroi-rank li[data-rroi-rank-id] {
  cursor: pointer;
  border-radius: 6px;
  padding: .05rem .15rem;
}
.hp-rroi-rank li[data-rroi-rank-id]:hover {
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, transparent);
}
.hp-rroi-mobile-jump { display: none; }
.hp-rroi-table { min-width: 860px; }
@media (max-width: 960px) {
  .hp-rroi-scenarios { grid-template-columns: 1fr; }
  .hp-rroi-buf-grid { grid-template-columns: 1fr; }
  .hp-rroi-mobile-jump { display: inline-flex; }
}
@media (max-width: 560px) {
  .hp-rroi-hero { grid-template-columns: 1fr; }
  .hp-rroi-hero-copy { grid-column: 1; }
  .hp-rroi-hero-mascot { grid-column: 1; grid-row: auto; justify-self: start; }
  .hp-rroi-panel { position: static; }
  .hp-rroi-cost { width: 6.2rem; }
  .hp-rroi-triad { grid-template-columns: 1fr; }
  .hp-rroi-gauges { grid-template-columns: 1fr; }
  .hp-rroi-tl-row {
    grid-template-columns: 1fr auto;
  }
  .hp-rroi-tl-track { grid-column: 1 / -1; order: 3; }
  .hp-rroi-table { min-width: 720px; }
}

/* —— Tilbud-sammenlign / remodel_quotes (remodel-tilbud-sammenlign) —— */
.hp-rq { margin-top: .25rem; }
.hp-rq-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-rq-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-rq-hero-copy { min-width: 0; }
.hp-rq-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  color: var(--muted, #5b6470);
}
.hp-rq-lead-bullets li { margin: .2rem 0; }
.hp-rq-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-rq-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rq-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-rq-how-list li { margin: .2rem 0; }
.hp-rq-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  color: var(--brand);
  vertical-align: middle;
}
.hp-rq-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .45rem;
  margin: 0 0 .65rem;
}
.hp-rq-demos .chip {
  font-size: .82rem;
  padding: .28rem .65rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-rq-demos .chip:hover,
.hp-rq-demos .chip.active,
.hp-rq-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-rq-demo-note {
  margin: 0 0 .75rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-rq-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .9fr);
  gap: 1rem 1.15rem;
  align-items: start;
}
.hp-rq-section {
  font-size: 1.02rem;
  font-weight: 700;
  margin: 1rem 0 .45rem;
}
.hp-rq-main .hp-rq-section:first-child { margin-top: 0; }
.hp-rq-quotes {
  display: grid;
  gap: .75rem;
}
.hp-rq-quote {
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .7rem .8rem .8rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--bg));
}
.hp-rq-quote.is-off {
  opacity: .55;
}
.hp-rq-quote-on {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-weight: 650;
  margin-bottom: .5rem;
  cursor: pointer;
}
.hp-rq-checkline {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: .9rem;
  cursor: pointer;
  margin-top: 1.35rem;
}
.hp-rq-dims {
  display: grid;
  gap: .35rem;
  margin: .55rem 0 .4rem;
  padding: .45rem .5rem;
  border-radius: 10px;
  border: 1px dashed var(--border);
  background: color-mix(in srgb, var(--bg) 55%, #fff);
}
.hp-rq-dim {
  display: grid;
  grid-template-columns: minmax(7rem, 1fr) 1fr auto;
  gap: .35rem .55rem;
  align-items: center;
  font-size: .84rem;
}
.hp-rq-dim input[type="range"] { width: 100%; }
.hp-rq-score-field {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .35rem .55rem;
  align-items: center;
  margin: .35rem 0;
}
.hp-rq-score-label { grid-column: 1 / -1; }
.hp-rq-score-val { font-variant-numeric: tabular-nums; min-width: 2.2rem; text-align: right; }
.hp-rq-eff-live {
  margin: .25rem 0 0;
  font-size: .82rem;
}
.hp-rq-scope-list,
.hp-rq-flags {
  list-style: none;
  margin: 0 0 .5rem;
  padding: 0;
  display: grid;
  gap: .3rem;
}
.hp-rq-scope-list li label,
.hp-rq-flags li label {
  display: flex;
  align-items: flex-start;
  gap: .4rem;
  font-size: .9rem;
  cursor: pointer;
}
.hp-rq-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: .85rem .9rem 1rem;
  background: var(--bg-elev, #fff);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-rq-live {
  margin-bottom: .65rem;
  padding-bottom: .55rem;
  border-bottom: 1px dashed var(--border);
}
.hp-rq-live .hp-bid-num {
  font-size: 1.65rem;
  font-weight: 750;
  letter-spacing: -0.02em;
  line-height: 1.15;
}
.hp-rq-nonadvice-fixed {
  margin: .35rem 0 0;
  font-size: .78rem !important;
}
.hp-rq-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .55rem 0 .65rem;
}
.hp-rq-gauges .hp-gauge {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .5rem;
  background: color-mix(in srgb, var(--bg) 60%, #fff);
}
.hp-rq-gauges .hp-gauge strong {
  display: block;
  font-size: .95rem;
  margin-top: .1rem;
}
.hp-rq-bar-wrap { margin: .25rem 0 .35rem; }
.hp-rq-bar {
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, #fff);
  overflow: hidden;
}
.hp-rq-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--brand) 75%, #22c55e), var(--brand));
  max-width: 100%;
  transition: width .2s ease;
}
.hp-rq-rank {
  margin: 0 0 .55rem;
  padding-left: 1.2rem;
  font-size: .86rem;
}
.hp-rq-rank li { margin: .2rem 0; }
.hp-rq-rank-top { font-weight: 650; }
.hp-rq-matrix-scroll {
  overflow-x: auto;
  margin-bottom: .55rem;
  border: 1px solid var(--border);
  border-radius: 10px;
}
.hp-rq-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .8rem;
  min-width: 420px;
}
.hp-rq-table th,
.hp-rq-table td {
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
  padding: .35rem .45rem;
  text-align: left;
  vertical-align: top;
}
.hp-rq-table thead th {
  background: color-mix(in srgb, var(--bg) 55%, #fff);
  font-weight: 650;
  position: sticky;
  top: 0;
}
.hp-rq-table th[scope="row"] {
  font-weight: 600;
  white-space: nowrap;
  background: color-mix(in srgb, var(--bg) 40%, #fff);
}
.hp-rq-gaps {
  margin: .5rem 0;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
}
.hp-rq-gaps-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-rq-tips {
  margin: .55rem 0;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: color-mix(in srgb, var(--bg) 60%, #fff);
  border: 1px solid var(--border);
}
.hp-rq-tip-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-rq-tip-list li { margin: .2rem 0; }
.hp-rq-sum-label { display: block; margin: .35rem 0 .2rem; }
.hp-rq-summary {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 7rem;
}
.hp-rq-seed-hint {
  margin: .45rem 0 0;
  padding: .4rem .55rem;
  border-radius: 10px;
  background: #ecfeff;
  border: 1px solid #a5f3fc;
}
.hp-rq-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-top: .5rem;
}
.hp-rq-card-actions .chip.active,
.hp-rq-card-actions .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev, #fff));
  font-weight: 650;
}
.hp-rq-scope-progress {
  margin: 0 0 .55rem;
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 55%, #fff);
}
.hp-rq-fill-scope {
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--brand) 60%, #38bdf8),
    var(--brand)
  );
}
.hp-rq-flag-count {
  display: inline-block;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  margin-left: .25rem;
}
.hp-rq-next-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .4rem;
  align-items: start;
}
.hp-rq-clarity {
  margin: .55rem 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, #fff);
}
.hp-rq-clarity.is-high {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 8%, #fff);
}
.hp-rq-clarity.is-mid {
  border-color: color-mix(in srgb, #ca8a04 45%, var(--border));
  background: color-mix(in srgb, #ca8a04 8%, #fff);
}
.hp-rq-clarity.is-low {
  border-color: color-mix(in srgb, #dc2626 35%, var(--border));
  background: color-mix(in srgb, #dc2626 6%, #fff);
}
.hp-rq-tempbar {
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, #fff);
  overflow: hidden;
  margin: .2rem 0 .3rem;
}
.hp-rq-tempfill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #f59e0b, #22c55e);
  max-width: 100%;
  transition: width .2s ease;
}
.hp-rq-tempbar.is-low .hp-rq-tempfill {
  background: linear-gradient(90deg, #ef4444, #f59e0b);
}
.hp-rq-tempbar.is-mid .hp-rq-tempfill {
  background: linear-gradient(90deg, #f59e0b, #eab308);
}
.hp-rq-tempbar.is-high .hp-rq-tempfill {
  background: linear-gradient(90deg, #22c55e, #16a34a);
}
.hp-rq-fill.is-over {
  background: linear-gradient(90deg, #f59e0b, #ef4444);
}
.hp-rq-pick {
  margin: .55rem 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev, #fff));
}
.hp-rq-pick-line {
  margin: 0 0 .4rem;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rq-pick-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
}
.hp-rq-pick-chips .chip.active {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 16%, #fff);
  font-weight: 650;
}
.hp-rq-delta {
  font-size: .78rem;
  font-weight: 600;
  color: var(--muted, #5b6470);
}
.hp-rq-delta.is-best {
  color: #15803d;
}
.hp-rq-rank li.is-prefer {
  background: color-mix(in srgb, var(--brand) 10%, transparent);
  border-radius: 6px;
  padding-left: .2rem;
}
.hp-rq-rank-pref {
  font-size: .72rem !important;
  padding: .08rem .35rem !important;
  vertical-align: middle;
  margin-left: .25rem;
}
.hp-rq-table td.hp-rq-best {
  background: color-mix(in srgb, #22c55e 14%, #fff);
  font-weight: 650;
}
.hp-rq-table th.is-prefer {
  background: color-mix(in srgb, var(--brand) 12%, #fff);
}
.hp-rq-gauges {
  grid-template-columns: 1fr 1fr;
}
.hp-rq-draft-box {
  margin: .65rem 0;
  padding: .5rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 55%, #fff);
}
.hp-rq-draft {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 6rem;
}
.hp-rq-faq,
.hp-rq-privacy {
  margin-top: .85rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
}
.hp-rq-faq > summary,
.hp-rq-privacy > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rq-faq details {
  margin: .4rem 0 0;
  padding: .25rem 0 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-rq-faq details summary {
  cursor: pointer;
  font-weight: 550;
  font-size: .88rem;
}
.hp-rq-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 900px) {
  .hp-rq-layout { grid-template-columns: 1fr; }
  .hp-rq-panel { position: static; }
}
@media (max-width: 560px) {
  .hp-rq-hero { grid-template-columns: 1fr; }
  .hp-rq-dim { grid-template-columns: 1fr; }
  .hp-rq-gauges { grid-template-columns: 1fr; }
  .hp-rq-checkline { margin-top: .35rem; }
  .hp-rq-next-row { grid-template-columns: 1fr; }
  .hp-rq-bar-row { grid-template-columns: 1fr; }
}

/* Card status chips */
.hp-rq-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin: .4rem 0 .15rem;
  min-height: 1.2rem;
}
.hp-rq-chip {
  display: inline-block;
  font-size: .72rem;
  font-weight: 650;
  letter-spacing: .01em;
  padding: .12rem .4rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 55%, #fff);
  color: var(--text, #1a1a1a);
  line-height: 1.3;
}
.hp-rq-chip.is-ok {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 10%, #fff);
  color: #166534;
}
.hp-rq-chip.is-warn {
  border-color: color-mix(in srgb, #ca8a04 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 12%, #fff);
  color: #92400e;
}
.hp-rq-chip.is-danger {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #ef4444 10%, #fff);
  color: #991b1b;
}
.hp-rq-chip.is-prefer {
  border-color: color-mix(in srgb, var(--brand) 50%, var(--border));
  background: color-mix(in srgb, var(--brand) 14%, #fff);
  color: var(--brand);
}
.hp-rq-chip.is-price {
  font-variant-numeric: tabular-nums;
  border-color: color-mix(in srgb, var(--brand) 30%, var(--border));
}
.hp-rq-chip.is-muted {
  opacity: .75;
  font-weight: 550;
}

/* Epler/pærer LFL risk */
.hp-rq-lfl {
  margin: .55rem 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, #fff);
}
.hp-rq-lfl.is-high {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 7%, #fff);
}
.hp-rq-lfl.is-mid {
  border-color: color-mix(in srgb, #ca8a04 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, #fff);
}
.hp-rq-lfl.is-low {
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
  background: color-mix(in srgb, #16a34a 7%, #fff);
}
.hp-rq-lfl-bar {
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, #fff);
  overflow: hidden;
  margin: .2rem 0 .3rem;
}
.hp-rq-lfl-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #22c55e, #f59e0b);
  max-width: 100%;
  transition: width .2s ease;
}
.hp-rq-lfl-bar.is-low .hp-rq-lfl-fill {
  background: linear-gradient(90deg, #16a34a, #22c55e);
}
.hp-rq-lfl-bar.is-mid .hp-rq-lfl-fill {
  background: linear-gradient(90deg, #eab308, #f59e0b);
}
.hp-rq-lfl-bar.is-high .hp-rq-lfl-fill {
  background: linear-gradient(90deg, #f59e0b, #ef4444);
}

/* Visual price bars */
.hp-rq-bars {
  margin: .55rem 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 55%, #fff);
}
.hp-rq-bars-list {
  display: grid;
  gap: .4rem;
}
.hp-rq-bar-row {
  display: grid;
  grid-template-columns: minmax(4.5rem, 7rem) 1fr minmax(4.5rem, auto);
  gap: .35rem .45rem;
  align-items: center;
  font-size: .8rem;
}
.hp-rq-bar-row.is-prefer .hp-rq-bar-name {
  font-weight: 700;
  color: var(--brand);
}
.hp-rq-bar-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
}
.hp-rq-bar-track {
  display: block;
  height: 12px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 65%, #fff);
  overflow: hidden;
}
.hp-rq-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--brand) 70%, #38bdf8),
    var(--brand)
  );
  max-width: 100%;
  min-width: 2px;
  transition: width .2s ease;
}
.hp-rq-bar-fill.is-over {
  background: linear-gradient(90deg, #f59e0b, #ef4444);
}
.hp-rq-bar-val {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  text-align: right;
  white-space: nowrap;
}
.hp-rq-bar-val .muted {
  font-weight: 500;
  font-size: .72rem;
  margin-left: .15rem;
}
.hp-rq-gauges {
  grid-template-columns: 1fr 1fr;
}


/* —— Tilbud-sammenlign upgrades: live formel, buffer, hopp —— */
.hp-rq-formula {
  margin: .55rem 0 .45rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border, #cbd5e1) 80%, transparent);
  background: color-mix(in srgb, var(--bg-elev, #f8fafc) 88%, #e0f2fe);
}
.hp-rq-formula-line {
  margin: 0;
  font-size: .88rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.35;
  word-break: break-word;
}
.hp-rq-buffer {
  margin: .35rem 0 .55rem;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #f59e0b 45%, var(--border, #cbd5e1));
  background: color-mix(in srgb, #fffbeb 70%, var(--bg-elev, #fff));
}
.hp-rq-buffer-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin: .15rem 0 .1rem;
}
.hp-rq-buffer-chips .chip.active,
.hp-rq-buffer-chips .chip[aria-pressed="true"] {
  background: color-mix(in srgb, #f59e0b 22%, var(--bg-elev, #fff));
  border-color: #f59e0b;
  font-weight: 650;
}
.hp-rq-scope-list li.is-hop {
  outline: 2px solid #0ea5e9;
  outline-offset: 2px;
  border-radius: 8px;
  background: color-mix(in srgb, #e0f2fe 55%, var(--bg-elev, #fff));
  transition: background .2s ease;
}
@media (max-width: 720px) {
  .hp-rq-formula-line { font-size: .82rem; }
}

/* —— Søknad/nabovarsel (remodel-tillatelse-sjekk · remodel_permit) —— */
.hp-rtp { margin-top: .25rem; }
.hp-rtp-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-rtp-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-rtp-hero-copy { min-width: 0; }
.hp-rtp-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  color: var(--muted, #5b6470);
}
.hp-rtp-lead-bullets li { margin: .2rem 0; }
.hp-rtp-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-rtp-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rtp-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-rtp-how-list li { margin: .2rem 0; }
.hp-rtp-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 18%, var(--bg-elev, #fff));
  color: #92400e;
}
.hp-rtp-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  margin: 0 0 .45rem;
}
.hp-rtp-demos .chip {
  font-size: .82rem;
  cursor: pointer;
}
.hp-rtp-demos .chip:hover,
.hp-rtp-demos .chip.active,
.hp-rtp-demos .chip[aria-pressed="true"] {
  border-color: var(--brand, #0f766e);
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, var(--bg-elev, #fff));
}
.hp-rtp-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-rtp-demo-note { margin: 0 0 .65rem; }
.hp-rtp-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .9fr);
  gap: 1rem 1.25rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-rtp-layout {
    grid-template-columns: 1fr;
  }
  .hp-rtp-panel { order: -1; }
  .hp-rtp-hero { grid-template-columns: 1fr; }
  .hp-rtp-hero-mascot { width: 56px; height: 56px; }
}
.hp-rtp-section {
  margin: 1.1rem 0 .5rem;
  font-size: 1.05rem;
  font-weight: 700;
}
.hp-rtp-section:first-child { margin-top: 0; }
.hp-rtp-tr-list,
.hp-rtp-rf-list,
.hp-rtp-cov-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .35rem;
}
.hp-rtp-tr-row {
  display: flex;
  align-items: flex-start;
  gap: .35rem;
  padding: .4rem .5rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-elev, #fff);
}
.hp-rtp-tr-row:has(input:checked) {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, var(--bg-elev, #fff));
}
.hp-rtp-tr-item,
.hp-rtp-rf-item {
  display: flex;
  align-items: flex-start;
  gap: .45rem;
  flex: 1;
  min-width: 0;
  cursor: pointer;
  font-size: .9rem;
}
.hp-rtp-rf-item {
  padding: .45rem .55rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-elev, #fff);
}
.hp-rtp-rf-item:has(input:checked) {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, var(--bg-elev, #fff));
}
.hp-rtp-tr-label {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem .45rem;
}
.hp-rtp-lvl {
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .35rem;
  border-radius: 999px;
}
.hp-rtp-lvl-high {
  background: color-mix(in srgb, #dc2626 16%, var(--bg-elev, #fff));
  color: #991b1b;
}
.hp-rtp-lvl-mid {
  background: color-mix(in srgb, #f59e0b 18%, var(--bg-elev, #fff));
  color: #92400e;
}
.hp-rtp-cov-row {
  padding: .4rem .5rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-elev, #fff);
}
.hp-rtp-cov-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .4rem .65rem;
}
.hp-rtp-cov-label { flex: 1; min-width: 12rem; }
.hp-rtp-st {
  min-width: 8.5rem;
  font-size: .86rem;
}
.hp-rtp-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem 1rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 4%);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-rtp-empty { margin: 0; }
.hp-rtp-live {
  margin-bottom: .65rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-rtp-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .78rem;
}
.hp-rtp-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
  margin: .55rem 0 .65rem;
}
.hp-rtp-gauges .hp-gauge {
  padding: .4rem .5rem;
  border-radius: 10px;
  background: color-mix(in srgb, var(--bg) 55%, var(--bg-elev, #fff));
  border: 1px solid color-mix(in srgb, var(--border) 75%, transparent);
}
.hp-rtp-gauges .hp-gauge strong {
  display: block;
  font-size: .95rem;
  margin-top: .1rem;
}
.hp-rtp-readiness {
  margin: .5rem 0 .65rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-rtp-ready-title {
  margin: 0 0 .2rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-rtp-readiness.is-ok {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 10%, var(--bg-elev, #fff));
}
.hp-rtp-readiness.is-check,
.hp-rtp-readiness.is-mid {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev, #fff));
}
.hp-rtp-readiness.is-missing,
.hp-rtp-readiness.is-high {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 9%, var(--bg-elev, #fff));
}
.hp-rtp-readiness.is-low:not(.is-missing) {
  border-color: color-mix(in srgb, #0f766e 35%, var(--border));
}
.hp-rtp-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-rtp-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #64748b;
  transition: width .2s ease;
}
.hp-rtp-fill.is-ok { background: #16a34a; }
.hp-rtp-fill.is-mid { background: #f59e0b; }
.hp-rtp-fill.is-low { background: #dc2626; }
.hp-rtp-signal-list,
.hp-rtp-alert-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-rtp-signal-list li,
.hp-rtp-alert-list li { margin: .2rem 0; }
.hp-rtp-signals,
.hp-rtp-alerts,
.hp-rtp-next {
  margin: .55rem 0;
}
.hp-rtp-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.35;
  resize: vertical;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .45rem .55rem;
  background: var(--bg, #fafafa);
}
.hp-rtp-privacy {
  margin-top: 1rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .65rem;
  font-size: .86rem;
}
.hp-rtp-privacy summary { cursor: pointer; font-weight: 600; }
.hp-rtp-faq details {
  margin: .4rem 0 0;
  padding: .25rem 0 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-rtp-faq details summary {
  cursor: pointer;
  font-weight: 550;
  font-size: .88rem;
}
.hp-rtp-faq details p { margin: .35rem 0 .15rem; }
.hp-rtp-filter-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .45rem;
  margin: 0 0 .55rem;
}
.hp-rtp-filter-bar .chip,
.hp-rtp-draft-tabs .chip {
  font-size: .78rem;
  cursor: pointer;
}
.hp-rtp-filter-bar .chip.is-on,
.hp-rtp-filter-bar .chip[aria-pressed="true"],
.hp-rtp-draft-tabs .chip.is-on,
.hp-rtp-draft-tabs .chip[aria-selected="true"],
.hp-rtp-quick-st .chip.is-on {
  border-color: var(--brand, #0f766e);
  background: color-mix(in srgb, var(--brand, #0f766e) 14%, var(--bg-elev, #fff));
  font-weight: 650;
}
.hp-rtp-chip-n {
  display: inline-block;
  min-width: 1.1em;
  margin-left: .15rem;
  font-variant-numeric: tabular-nums;
  opacity: .85;
}
.hp-rtp-quick-actions { margin: .1rem 0 .5rem; }
.hp-rtp-quick-st {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  margin-top: .35rem;
  padding-left: .1rem;
}
.hp-rtp-quick-st .chip-xs,
.chip.chip-xs {
  font-size: .72rem;
  padding: .12rem .4rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
  line-height: 1.2;
}
.hp-rtp-cov-row.is-flash,
.hp-rtp-tr-row.is-flash {
  outline: 2px solid color-mix(in srgb, var(--brand, #0f766e) 70%, #f59e0b);
  outline-offset: 2px;
  animation: hp-rtp-flash .9s ease;
}
@keyframes hp-rtp-flash {
  0% { background: color-mix(in srgb, #f59e0b 22%, var(--bg-elev, #fff)); }
  100% { background: var(--bg-elev, #fff); }
}
.hp-rtp-tempbar {
  height: .45rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
  margin: .15rem 0 .55rem;
}
.hp-rtp-tempfill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #64748b;
  transition: width .22s ease, background .2s ease;
}
.hp-rtp-tempfill.is-low { background: #0f766e; }
.hp-rtp-tempfill.is-mid { background: #f59e0b; }
.hp-rtp-tempfill.is-high { background: #dc2626; }
.hp-rtp-hulls { margin: .55rem 0; }
.hp-rtp-hull-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .28rem;
}
.hp-rtp-hull-btn {
  display: block;
  width: 100%;
  text-align: left;
  font-size: .82rem;
  padding: .35rem .5rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
  cursor: pointer;
  color: inherit;
}
.hp-rtp-hull-btn:hover {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, var(--bg-elev, #fff));
}
.hp-rtp-draft-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin: .55rem 0 .15rem;
}
.hp-rtp-suggest-hint {
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, var(--bg-elev, #fff));
  font-size: .84rem;
}
.hp-rtp-formula {
  margin: .5rem 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--border) 80%, var(--brand, #0f766e));
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev, #fff));
}
.hp-rtp-formula-line {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  word-break: break-word;
}
.hp-rtp-port {
  margin: .55rem 0 .65rem;
  padding: .5rem .6rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-rtp-port-title {
  margin: 0 0 .3rem;
  font-weight: 700;
  font-size: .9rem;
}
.hp-rtp-port-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .2rem;
}
.hp-rtp-port-item {
  font-size: .82rem;
  padding: .2rem .35rem;
  border-radius: 6px;
}
.hp-rtp-port-item.is-ok {
  color: #166534;
  background: color-mix(in srgb, #16a34a 10%, transparent);
}
.hp-rtp-port-item.is-hot {
  color: #991b1b;
  background: color-mix(in srgb, #dc2626 10%, transparent);
}
.hp-rtp-port-item.is-open {
  color: var(--muted, #5b6470);
}
.hp-rtp-port.is-go {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 8%, var(--bg-elev, #fff));
}
.hp-rtp-port.is-wait {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev, #fff));
}
.hp-rtp-port.is-stop {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 8%, var(--bg-elev, #fff));
}
.hp-rtp-subject {
  width: 100%;
  font-size: .86rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg, #fafafa);
  margin-bottom: .15rem;
}
.hp-rtp-cov-row.is-prio {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, #f59e0b 25%, transparent);
}
.hp-rtp-gauges {
  grid-template-columns: 1fr 1fr;
}
@media (min-width: 420px) {
  .hp-rtp-gauges { grid-template-columns: 1fr 1fr 1fr; }
}
@media (max-width: 560px) {
  .hp-rtp-panel { position: static; }
  .hp-rtp-gauges { grid-template-columns: 1fr 1fr; }
  .hp-rtp-cov-top { flex-direction: column; align-items: stretch; }
  .hp-rtp-st { width: 100%; }
  .hp-rtp-filter-bar .btn { width: 100%; }
}

/* —— Rehab-tidslinje (remodel_timeline / remodel-tidslinje-rehab) —— */
.hp-rmt { display: grid; gap: 1rem; }
.hp-rmt-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
}
.hp-rmt-hero-mascot {
  border-radius: 14px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
.hp-rmt-hero-copy { min-width: 0; grid-column: 2; }
.hp-rmt-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-rmt-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .75rem;
  background: var(--bg-elev);
}
.hp-rmt-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rmt-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-rmt-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
}
.hp-rmt-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #e0e7ff;
  color: #3730a3;
  vertical-align: middle;
}
.hp-rmt-demo-note {
  margin: .15rem 0 0;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
}
.hp-rmt-layout {
  display: grid;
  grid-template-columns: 1fr minmax(240px, 320px);
  gap: 1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-rmt-layout { grid-template-columns: 1fr; }
  .hp-rmt-panel { position: static; }
}
.hp-rmt-section {
  font-size: 1.02rem;
  margin: 1rem 0 .55rem;
  font-weight: 700;
}
.hp-rmt-section:first-child { margin-top: 0; }
.hp-rmt-quick-dates {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .45rem;
  align-items: center;
  margin: .15rem 0 .55rem;
}
.hp-rmt-filter {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .45rem;
  align-items: center;
  margin: .15rem 0 .55rem;
}
.hp-rmt-filter .chip.is-on,
.hp-rmt-filter [aria-pressed="true"] {
  background: color-mix(in srgb, var(--brand) 18%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  font-weight: 700;
}
.hp-rmt-filter-n {
  font-size: .72rem;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  opacity: .85;
  margin-left: .15rem;
}
.hp-rmt-livebox {
  border: 1px solid #c7d2fe;
  background: #eef2ff;
  border-radius: 12px;
  padding: .55rem .75rem;
  margin: 0 0 .85rem;
}
.hp-rmt-live-line {
  margin: 0;
  font-weight: 650;
  font-size: .9rem;
  line-height: 1.4;
}
.hp-rmt-row.is-flash {
  outline: 2px solid color-mix(in srgb, var(--brand) 70%, #6366f1);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand) 20%, transparent);
}
.hp-rmt-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: .35rem 0 .75rem;
}
.hp-rmt-tab {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}
.hp-rmt-tab.is-on,
.hp-rmt-tab[aria-selected="true"] {
  background: color-mix(in srgb, var(--brand) 18%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  font-weight: 700;
}
.hp-rmt-tab-pct {
  font-size: .72rem;
  font-variant-numeric: tabular-nums;
  opacity: .8;
  font-weight: 700;
}
.hp-rmt-phase-head {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1rem;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: .55rem;
}
.hp-rmt-phase-help { margin: 0; flex: 1 1 12rem; }
.hp-rmt-phase-date-lab {
  display: grid;
  gap: .2rem;
  font-size: .86rem;
}
.hp-rmt-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-rmt-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: var(--card, #fff);
  transition: border-color .15s, background .15s;
}
.hp-rmt-row.is-critical { border-left: 3px solid #d97706; }
.hp-rmt-row.is-gap {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-rmt-row.is-ok {
  border-color: #86efac;
  background: #f7fdf9;
}
.hp-rmt-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
}
.hp-rmt-on {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  flex: 1 1 12rem;
  min-width: 0;
  cursor: pointer;
}
.hp-rmt-on input { margin-top: .2rem; flex: 0 0 auto; }
.hp-rmt-label {
  font-size: .92rem;
  font-weight: 600;
  line-height: 1.35;
  min-width: 0;
}
.hp-rmt-crit-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #ffedd5;
  color: #9a3412;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-rmt-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
  min-height: 36px;
}
.hp-rmt-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .95rem;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-rmt-gauges {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .55rem;
  margin-bottom: .75rem;
}
.hp-rmt-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  background: var(--card, #fff);
  display: grid;
  gap: .15rem;
}
.hp-rmt-gauge-gaps strong { color: #b45309; }
.hp-rmt-gauge strong {
  font-size: 1.25rem;
  font-variant-numeric: tabular-nums;
}
.hp-rmt-temp {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
  display: grid;
  gap: .15rem;
  background: var(--card, #fff);
}
.hp-rmt-temp strong {
  font-size: 1.2rem;
  font-weight: 800;
  letter-spacing: .01em;
}
.hp-rmt-temp.is-klar {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-rmt-temp.is-klar strong { color: #15803d; }
.hp-rmt-temp.is-sjekk {
  border-color: #fcd34d;
  background: #fffbeb;
}
.hp-rmt-temp.is-sjekk strong { color: #b45309; }
.hp-rmt-temp.is-mangler {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-rmt-temp.is-mangler strong { color: #b91c1c; }
/* Riving-klarhet port */
.hp-rmt-gate {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
  display: grid;
  gap: .2rem;
  background: var(--card, #fff);
}
.hp-rmt-gate strong {
  font-size: 1.15rem;
  font-weight: 800;
}
.hp-rmt-gate.is-open {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-rmt-gate.is-open strong { color: #15803d; }
.hp-rmt-gate.is-sjekk {
  border-color: #fcd34d;
  background: #fffbeb;
}
.hp-rmt-gate.is-sjekk strong { color: #b45309; }
.hp-rmt-gate.is-stopp {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-rmt-gate.is-stopp strong { color: #b91c1c; }
.hp-rmt-gate-ul {
  margin: .25rem 0 0;
  padding-left: 0;
  list-style: none;
  display: grid;
  gap: .2rem;
}
/* Kost-skinne */
.hp-rmt-cost {
  border: 1px solid #c7d2fe;
  background: #eef2ff;
  border-radius: 12px;
  padding: .5rem .7rem;
  margin-bottom: .75rem;
  display: grid;
  gap: .1rem;
}
.hp-rmt-cost-line {
  margin: 0;
  font-weight: 700;
  font-size: .92rem;
  font-variant-numeric: tabular-nums;
}
/* Mini-Gantt */
.hp-rmt-gantt {
  margin: 0 0 .85rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .65rem;
  background: var(--bg-elev);
}
.hp-rmt-gantt-cap { margin: 0 0 .4rem; }
.hp-rmt-gantt-track {
  position: relative;
  height: 9.2rem;
  border-radius: 8px;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--border) 55%, transparent) 1px, transparent 1px);
  background-size: 12.5% 100%;
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-rmt-gantt-bar {
  position: absolute;
  height: 1.25rem;
  border: 0;
  border-radius: 7px;
  padding: .15rem .3rem;
  font: inherit;
  color: #0f172a;
  background: color-mix(in srgb, var(--brand) 28%, #e2e8f0);
  cursor: pointer;
  text-align: left;
  overflow: hidden;
  display: flex;
  align-items: center;
  min-width: 1.5rem;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brand) 25%, transparent);
}
.hp-rmt-gantt-bar:nth-child(1) { top: .3rem; }
.hp-rmt-gantt-bar:nth-child(2) { top: 1.55rem; }
.hp-rmt-gantt-bar:nth-child(3) { top: 2.8rem; }
.hp-rmt-gantt-bar:nth-child(4) { top: 4.05rem; }
.hp-rmt-gantt-bar:nth-child(5) { top: 5.3rem; }
.hp-rmt-gantt-bar:nth-child(6) { top: 6.55rem; }
.hp-rmt-gantt-bar:nth-child(7) { top: 7.8rem; }
.hp-rmt-gantt-bar.is-done {
  background: color-mix(in srgb, #16a34a 35%, #ecfdf5);
  box-shadow: inset 0 0 0 1px #86efac;
}
.hp-rmt-gantt-bar.is-gap {
  background: color-mix(in srgb, #ea580c 28%, #fff7ed);
  box-shadow: inset 0 0 0 1px #fdba74;
}
.hp-rmt-gantt-bar.is-part {
  background: color-mix(in srgb, #2563eb 28%, #eff6ff);
  box-shadow: inset 0 0 0 1px #93c5fd;
}
.hp-rmt-gantt-bar.is-overlap {
  outline: 2px solid #dc2626;
  outline-offset: -1px;
  z-index: 2;
}
.hp-rmt-gantt-bar:hover {
  filter: brightness(0.97);
  z-index: 3;
}
.hp-rmt-gantt-lab {
  font-size: .62rem;
  font-weight: 750;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.hp-rmt-formula {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .65rem;
  margin: 0 0 .75rem;
  background: var(--bg-elev);
}
.hp-rmt-formula summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .88rem;
}
.hp-rmt-gaps-list {
  border: 1px solid #fed7aa;
  background: #fff7ed;
  border-radius: 12px;
  padding: .5rem .7rem;
  margin: 0 0 .75rem;
}
.hp-rmt-gaps-ul {
  margin: 0;
  padding-left: 0;
  list-style: none;
  display: grid;
  gap: .25rem;
}
.hp-rmt-gap-btn {
  border: 0;
  background: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: left;
  font-size: .84rem;
  font-weight: 600;
  line-height: 1.35;
}
.hp-rmt-gap-btn:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
  color: var(--brand);
}
.hp-rmt-seeds {
  margin: .75rem 0;
  padding: .55rem .7rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--brand) 5%, var(--card, #fff));
}
.hp-rmt-rail { margin: 0 0 .85rem; }
.hp-rmt-rail-cap { margin: 0 0 .4rem; }
.hp-rmt-rail-track {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
}
.hp-rmt-rail-node {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  gap: 0 .35rem;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .35rem .5rem;
  background: var(--card, #fff);
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
  min-width: 6.5rem;
  flex: 1 1 6.5rem;
  max-width: 9rem;
}
.hp-rmt-rail-node:hover {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
}
.hp-rmt-rail-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #94a3b8;
  grid-row: 1 / span 2;
}
.hp-rmt-rail-node.is-done .hp-rmt-rail-dot { background: #16a34a; }
.hp-rmt-rail-node.is-gap .hp-rmt-rail-dot { background: #ea580c; }
.hp-rmt-rail-node.is-part .hp-rmt-rail-dot { background: #2563eb; }
.hp-rmt-rail-lab {
  font-size: .72rem;
  font-weight: 700;
  line-height: 1.2;
  grid-column: 2;
}
.hp-rmt-rail-dt {
  font-size: .68rem;
  opacity: .8;
  font-variant-numeric: tabular-nums;
  grid-column: 2;
}
.hp-rmt-rail-pct { display: none; }
.hp-rmt-bars { display: grid; gap: .4rem; margin-bottom: .85rem; }
.hp-rmt-bar-row {
  display: grid;
  grid-template-columns: 8.5rem 1fr;
  gap: .45rem;
  align-items: center;
}
.hp-rmt-bar-lab {
  border: 0;
  background: none;
  padding: 0;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hp-rmt-bar-lab:hover { color: var(--brand); }
.hp-rmt-bar {
  height: 8px;
  border-radius: 99px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-rmt-bar-fill {
  display: block;
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--brand), color-mix(in srgb, var(--brand) 55%, #3aa6a0));
  border-radius: 99px;
  transition: width .2s ease;
}
.hp-rmt-next {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
  background: color-mix(in srgb, var(--brand) 6%, var(--card, #fff));
}
.hp-rmt-next-btn {
  display: block;
  width: 100%;
  border: 0;
  background: none;
  padding: 0;
  margin: 0;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.hp-rmt-next-btn:hover .hp-rmt-next-title {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hp-rmt-next-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-rmt-sched-btn {
  border: 0;
  background: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: left;
}
.hp-rmt-sched-btn:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hp-rmt-warn {
  border: 1px solid #fca5a5;
  background: #fff7f7;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-rmt-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-rmt-schedule { margin-bottom: .75rem; }
.hp-rmt-schedule-ol {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  line-height: 1.45;
}
.hp-rmt-commit-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  min-height: 10rem;
}
.hp-rmt-nonadvice {
  margin-top: .65rem;
  font-size: .78rem !important;
}
.hp-rmt-faq details {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .7rem;
  margin: .4rem 0;
  background: var(--bg-elev);
}
.hp-rmt-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rmt-faq details p { margin: .35rem 0 .15rem; }
.hp-rmt-links { margin: .85rem 0; }
.hp-rmt-link-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .5rem;
}
.hp-rmt-link-grid a {
  font-size: .8rem;
  font-weight: 650;
  padding: .25rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  text-decoration: none;
  color: inherit;
}
.hp-rmt-link-grid a:hover {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
@media (max-width: 560px) {
  .hp-rmt-hero {
    grid-template-columns: 1fr;
  }
  .hp-rmt-hero-mascot { width: 56px; height: 56px; }
  .hp-rmt-hero-copy { grid-column: 1; }
  .hp-rmt-gauges { grid-template-columns: 1fr; }
  .hp-rmt-bar-row { grid-template-columns: 1fr; gap: .2rem; }
  .hp-rmt-rail-node { max-width: none; flex: 1 1 45%; }
}
@media (min-width: 901px) {
  .hp-rmt-hero {
    grid-template-columns: 72px 1fr;
  }
  .hp-rmt-gauges { grid-template-columns: repeat(2, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .hp-rmt-bar-fill { transition: none; }
  .hp-rmt-row { transition: none; }
  .hp-rmt-row.is-flash { transition: none; }
}

/* —— Bo under arbeid (remodel_live / remodel-bo-under-arbeid) —— */
.hp-rlv { display: grid; gap: 1rem; }
.hp-rlv-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
}
.hp-rlv-date-quick,
.hp-rlv-zone-presets,
.hp-rlv-cost-scen,
.hp-rlv-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .45rem;
  align-items: center;
  margin: .25rem 0 .55rem;
}
.hp-rlv-date-quick-wrap { margin-top: .15rem; }
.hp-rlv-zone-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin: 0 0 .65rem;
}
.hp-rlv-zchip {
  display: inline-block;
  font-size: .75rem;
  font-weight: 650;
  padding: .18rem .45rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-rlv-zchip.is-work { border-color: #fca5a5; background: #fff7f7; color: #991b1b; }
.hp-rlv-zchip.is-live { border-color: #86efac; background: #f7fdf9; color: #166534; }
.hp-rlv-zchip.is-buffer { border-color: #fcd34d; background: #fffbeb; color: #92400e; }
.hp-rlv-zchip.is-store { border-color: #c4b5fd; background: #f5f3ff; color: #5b21b6; }
.hp-rlv-filter-n {
  font-size: .72rem;
  font-variant-numeric: tabular-nums;
  opacity: .85;
  font-weight: 700;
}
.hp-rlv-filters .chip.is-on,
.hp-rlv-cost-scen .chip.is-on {
  background: color-mix(in srgb, var(--brand) 18%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  font-weight: 700;
}
.hp-rlv-row.is-flash,
.hp-rlv-func-row.is-flash {
  outline: 2px solid color-mix(in srgb, var(--brand) 70%, #f59e0b);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand) 18%, transparent);
  transition: outline .2s, box-shadow .2s;
}
.hp-rlv-bar-jump {
  background: none;
  border: 0;
  padding: 0;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hp-rlv-bar-jump:hover { color: var(--brand); }
.hp-rlv-next-btn {
  display: block;
  width: 100%;
  background: none;
  border: 0;
  padding: 0;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.hp-rlv-next-btn:hover .hp-rlv-next-title { text-decoration: underline; }
.hp-rlv-gauge-cd.is-soon {
  border-color: #fcd34d;
  background: #fffbeb;
}
.hp-rlv-gauge-cd.is-now {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-rlv-gauge-cd.is-past {
  border-color: #86efac;
  background: #f7fdf9;
}
.hp-rlv-subsection {
  font-size: .95rem;
  font-weight: 700;
  margin: 1rem 0 .35rem;
}
.hp-rlv-partner-box {
  margin-top: .85rem;
  padding: .65rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-rlv-draft-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  min-height: 6rem;
}
.hp-rlv-seed-note {
  margin: .35rem 0 0;
  padding: .4rem .65rem;
  border-radius: 8px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
}
.hp-rlv-seeds { margin-top: .5rem; }
.hp-rlv-hero-mascot {
  border-radius: 14px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
.hp-rlv-hero-copy { min-width: 0; grid-column: 2; }
.hp-rlv-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-rlv-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .75rem;
  background: var(--bg-elev);
}
.hp-rlv-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rlv-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-rlv-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
}
.hp-rlv-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #e0e7ff;
  color: #3730a3;
  vertical-align: middle;
}
.hp-rlv-demo-note {
  margin: .15rem 0 0;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
}
.hp-rlv-layout {
  display: grid;
  grid-template-columns: 1fr minmax(240px, 320px);
  gap: 1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-rlv-layout { grid-template-columns: 1fr; }
  .hp-rlv-panel { position: static; }
}
.hp-rlv-section {
  font-size: 1.02rem;
  margin: 1rem 0 .55rem;
  font-weight: 700;
}
.hp-rlv-section:first-child { margin-top: 0; }
.hp-rlv-zones {
  display: grid;
  gap: .4rem;
  margin-bottom: .35rem;
}
.hp-rlv-zone-row {
  display: grid;
  grid-template-columns: 1fr minmax(7.5rem, 9rem);
  gap: .5rem;
  align-items: center;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-rlv-zone-row.is-work {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-rlv-zone-row.is-live {
  border-color: #86efac;
  background: #f7fdf9;
}
.hp-rlv-zone-row.is-buffer {
  border-color: #fcd34d;
  background: #fffbeb;
}
.hp-rlv-zone-row.is-store {
  border-color: #c4b5fd;
  background: #f5f3ff;
}
.hp-rlv-zone-label {
  font-size: .9rem;
  font-weight: 600;
}
.hp-rlv-zone-sel {
  font: inherit;
  font-size: .88rem;
  padding: .35rem .45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
}
.hp-rlv-zone-sum { margin: .25rem 0 .5rem; }
.hp-rlv-funcs {
  list-style: none;
  margin: 0 0 .5rem;
  padding: 0;
  display: grid;
  gap: .5rem;
}
.hp-rlv-func-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .65rem;
  background: var(--card, #fff);
}
.hp-rlv-func-row.is-critical { border-left: 3px solid #d97706; }
.hp-rlv-func-row.is-ok {
  border-color: #86efac;
  background: #f7fdf9;
}
.hp-rlv-func-row.is-temp {
  border-color: #fcd34d;
  background: #fffbeb;
}
.hp-rlv-func-row.is-risk {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-rlv-func-top {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: center;
  justify-content: space-between;
}
.hp-rlv-func-label {
  font-size: .9rem;
  font-weight: 600;
  flex: 1 1 10rem;
  min-width: 0;
}
.hp-rlv-func-st {
  font: inherit;
  font-size: .85rem;
  padding: .3rem .4rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  max-width: 12rem;
}
.hp-rlv-func-note {
  width: 100%;
  margin-top: .35rem;
  font-size: .86rem;
  min-height: 34px;
}
.hp-rlv-crit-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #ffedd5;
  color: #9a3412;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-rlv-formula {
  margin: .35rem 0 .75rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: var(--surface-2, rgba(0,0,0,.03));
}
.hp-rlv-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: .35rem 0 .75rem;
}
.hp-rlv-tab {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}
.hp-rlv-tab.is-on,
.hp-rlv-tab[aria-selected="true"] {
  background: color-mix(in srgb, var(--brand) 18%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  font-weight: 700;
}
.hp-rlv-tab-pct {
  font-size: .72rem;
  font-variant-numeric: tabular-nums;
  opacity: .8;
  font-weight: 700;
}
.hp-rlv-phase-help { margin: 0 0 .5rem; }
.hp-rlv-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-rlv-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: var(--card, #fff);
  transition: border-color .15s, background .15s;
}
.hp-rlv-row.is-critical { border-left: 3px solid #d97706; }
.hp-rlv-row.is-gap {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-rlv-row.is-ok {
  border-color: #86efac;
  background: #f7fdf9;
}
.hp-rlv-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
}
.hp-rlv-on {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  flex: 1 1 12rem;
  min-width: 0;
  cursor: pointer;
}
.hp-rlv-on input { margin-top: .2rem; flex: 0 0 auto; }
.hp-rlv-label {
  font-size: .92rem;
  font-weight: 600;
  line-height: 1.35;
  min-width: 0;
}
.hp-rlv-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
  min-height: 36px;
}
.hp-rlv-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .95rem;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-rlv-gauges {
  display: grid;
  grid-template-columns: 1fr;
  gap: .55rem;
  margin-bottom: .75rem;
}
.hp-rlv-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  background: var(--card, #fff);
  display: grid;
  gap: .15rem;
}
.hp-rlv-gauge-main.is-green {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-rlv-gauge-main.is-lime {
  border-color: #bef264;
  background: #f7fee7;
}
.hp-rlv-gauge-main.is-yellow {
  border-color: #fcd34d;
  background: #fffbeb;
}
.hp-rlv-gauge-main.is-red {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-rlv-bars {
  display: grid;
  gap: .4rem;
  margin-bottom: .75rem;
}
.hp-rlv-bar-row {
  display: grid;
  grid-template-columns: minmax(5rem, 7.5rem) 1fr;
  gap: .4rem;
  align-items: center;
}
.hp-rlv-bar {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-rlv-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--brand);
  transition: width .2s ease;
}
.hp-rlv-next {
  margin: .55rem 0 .75rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
}
.hp-rlv-next-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .95rem;
}
.hp-rlv-cost-box {
  margin: 0 0 .75rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-rlv-warn {
  margin: 0 0 .75rem;
  padding: .5rem .65rem;
  border-radius: 12px;
  border: 1px solid #fca5a5;
  background: #fff7f7;
}
.hp-rlv-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
  line-height: 1.4;
}
.hp-rlv-func-sum { margin-bottom: .75rem; }
.hp-rlv-func-sum-ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .3rem;
  font-size: .84rem;
}
.hp-rlv-fl {
  padding: .3rem .45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--card, #fff);
}
.hp-rlv-fl.is-ok { border-color: #86efac; background: #f7fdf9; }
.hp-rlv-fl.is-temp { border-color: #fcd34d; background: #fffbeb; }
.hp-rlv-fl.is-risk { border-color: #fca5a5; background: #fff7f7; }
.hp-rlv-commit-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  min-height: 10rem;
}
.hp-rlv-nonadvice {
  margin-top: .65rem;
  font-size: .78rem !important;
}
.hp-rlv-privacy {
  margin-top: .85rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .65rem;
  background: var(--bg-elev);
}
.hp-rlv-privacy summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .88rem;
}
.hp-rlv-faq details {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .7rem;
  margin: .4rem 0;
  background: var(--bg-elev);
}
.hp-rlv-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rlv-faq details p { margin: .35rem 0 .15rem; }
.hp-rlv-links { margin: .85rem 0; }
.hp-rlv-link-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .5rem;
}
.hp-rlv-link-grid a {
  font-size: .8rem;
  font-weight: 650;
  padding: .25rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  text-decoration: none;
  color: inherit;
}
.hp-rlv-link-grid a:hover {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
@media (max-width: 560px) {
  .hp-rlv-hero { grid-template-columns: 1fr; }
  .hp-rlv-hero-mascot { width: 56px; height: 56px; }
  .hp-rlv-hero-copy { grid-column: 1; }
  .hp-rlv-zone-row { grid-template-columns: 1fr; }
  .hp-rlv-bar-row { grid-template-columns: 1fr; gap: .2rem; }
}
@media (min-width: 901px) {
  .hp-rlv-hero { grid-template-columns: 72px 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-rlv-bar-fill { transition: none; }
  .hp-rlv-row { transition: none; }
}

/* —— Kvalitetskontroll (remodel_qc / remodel-kvalitetskontroll) —— */
.hp-rqc { display: grid; gap: 1rem; }
.hp-rqc-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
}
.hp-rqc-hero-mascot {
  border-radius: 14px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
.hp-rqc-hero-copy { min-width: 0; grid-column: 2; }
.hp-rqc-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-rqc-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .75rem;
  background: var(--bg-elev);
}
.hp-rqc-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rqc-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-rqc-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
}
.hp-rqc-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #e0e7ff;
  color: #3730a3;
  vertical-align: middle;
}
.hp-rqc-demo-note {
  margin: .15rem 0 0;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
}
.hp-rqc-layout {
  display: grid;
  grid-template-columns: 1fr minmax(240px, 320px);
  gap: 1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-rqc-layout { grid-template-columns: 1fr; }
}
.hp-rqc-section {
  font-size: 1.02rem;
  font-weight: 750;
  margin: 1.1rem 0 .5rem;
}
.hp-rqc-main .hp-rqc-section:first-child { margin-top: 0; }
.hp-rqc-gate-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-bottom: .4rem;
}
.hp-rqc-tab.is-on {
  background: color-mix(in srgb, var(--brand) 18%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  font-weight: 700;
}
.hp-rqc-tab-pct {
  display: inline-block;
  margin-left: .25rem;
  font-size: .72rem;
  font-weight: 800;
  opacity: .85;
}
.hp-rqc-tab-av {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.1rem;
  height: 1.1rem;
  margin-left: .2rem;
  padding: 0 .28rem;
  border-radius: 999px;
  font-size: .65rem;
  font-weight: 800;
  background: #fee2e2;
  color: #991b1b;
  vertical-align: middle;
}
.hp-rqc-filters,
.hp-rqc-av-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem .4rem;
  align-items: center;
  margin-bottom: .55rem;
}
.hp-rqc-filters .chip.is-on,
.hp-rqc-av-filters .chip.is-on {
  background: color-mix(in srgb, var(--brand) 16%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  font-weight: 700;
}
.hp-rqc-phase {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .65rem .75rem .75rem;
  background: var(--bg-elev);
}
.hp-rqc-phase-help { margin: 0 0 .5rem; }
.hp-rqc-photo-row {
  margin: 0 0 .55rem;
  padding: .35rem .5rem;
  border-radius: 8px;
  background: color-mix(in srgb, var(--brand) 6%, var(--bg));
  border: 1px dashed color-mix(in srgb, var(--brand) 25%, var(--border));
}
.hp-rqc-photo-lab {
  display: flex;
  align-items: center;
  gap: .45rem;
  font-size: .88rem;
  font-weight: 600;
  cursor: pointer;
}
.hp-rqc-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .45rem;
}
.hp-rqc-row {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .55rem .5rem;
  background: var(--bg);
  transition: border-color .12s ease, background .12s ease;
}
.hp-rqc-row.is-critical {
  border-left: 3px solid color-mix(in srgb, var(--brand) 55%, #64748b);
}
.hp-rqc-row.is-st-ok {
  border-color: #86efac;
  background: color-mix(in srgb, #dcfce7 40%, var(--bg));
}
.hp-rqc-row.is-st-note {
  border-color: #fcd34d;
  background: color-mix(in srgb, #fef9c3 45%, var(--bg));
}
.hp-rqc-row.is-st-avvik {
  border-color: #fca5a5;
  background: color-mix(in srgb, #fee2e2 50%, var(--bg));
}
.hp-rqc-row.is-st-na {
  opacity: .72;
  border-style: dashed;
}
.hp-rqc-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-rqc-row-bottom {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .35rem;
  align-items: center;
  margin-top: .35rem;
}
.hp-rqc-label {
  flex: 1 1 12rem;
  font-size: .9rem;
  line-height: 1.35;
  font-weight: 550;
}
.hp-rqc-crit-badge {
  display: inline-block;
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .06rem .28rem;
  border-radius: 4px;
  margin-right: .25rem;
  background: #fef3c7;
  color: #92400e;
  vertical-align: middle;
}
.hp-rqc-status-wrap { flex: 0 0 auto; }
.hp-rqc-status {
  min-width: 8.5rem;
  font-size: .85rem;
  padding: .28rem .4rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-rqc-note {
  width: 100%;
  min-width: 0;
  margin-top: 0;
  font-size: .84rem;
  padding: .3rem .45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
}
.hp-rqc-log-btn { white-space: nowrap; }
.hp-rqc-av-form { margin-top: .25rem; }
.hp-rqc-av-list { display: grid; gap: .45rem; }
.hp-rqc-av-item {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .6rem;
  background: var(--bg-elev);
}
.hp-rqc-av-item.is-open { border-left: 3px solid #f59e0b; }
.hp-rqc-av-item.is-open.is-hoy { border-left-color: #dc2626; background: color-mix(in srgb, #fef2f2 70%, var(--bg-elev)); }
.hp-rqc-av-item.is-fixed { border-left: 3px solid #16a34a; opacity: .92; }
.hp-rqc-av-item-top {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .5rem;
  align-items: center;
  justify-content: space-between;
}
.hp-rqc-av-badges { display: flex; flex-wrap: wrap; gap: .25rem; }
.hp-rqc-av-badge {
  font-size: .68rem;
  font-weight: 750;
  padding: .08rem .32rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-rqc-av-badge.sev-hoy { background: #fee2e2; color: #991b1b; border-color: #fecaca; }
.hp-rqc-av-badge.sev-mid { background: #ffedd5; color: #9a3412; border-color: #fed7aa; }
.hp-rqc-av-badge.sev-lav { background: #f1f5f9; color: #334155; }
.hp-rqc-av-badge.st-open { background: #fef3c7; color: #92400e; }
.hp-rqc-av-badge.st-fix { background: #dcfce7; color: #166534; }
.hp-rqc-av-meta { margin: .25rem 0 .35rem; }
.hp-rqc-av-actions { display: flex; flex-wrap: wrap; gap: .3rem; }
.hp-rqc-draft-box {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .6rem;
  margin-bottom: .65rem;
  background: color-mix(in srgb, var(--brand) 5%, var(--bg));
}

.hp-rqc-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem 1rem;
  background: var(--bg-elev);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-rqc-gauges {
  display: grid;
  grid-template-columns: 1fr;
  gap: .45rem;
  margin-bottom: .65rem;
}
.hp-rqc-gauge {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .55rem;
  background: var(--bg);
  display: grid;
  gap: .1rem;
}
.hp-rqc-gauge strong { font-size: 1.05rem; line-height: 1.25; }
.hp-rqc-gauge-main.is-ok { border-color: #86efac; background: color-mix(in srgb, #dcfce7 55%, var(--bg)); }
.hp-rqc-gauge-main.is-mid { border-color: #fcd34d; background: color-mix(in srgb, #fef9c3 55%, var(--bg)); }
.hp-rqc-gauge-main.is-warm { border-color: #fdba74; background: color-mix(in srgb, #ffedd5 55%, var(--bg)); }
.hp-rqc-gauge-main.is-hot { border-color: #fca5a5; background: color-mix(in srgb, #fee2e2 55%, var(--bg)); }
.hp-rqc-gauge-main.is-unknown { border-color: var(--border); }
.hp-rqc-tempbar-wrap { margin: 0 0 .75rem; }
.hp-rqc-tempbar {
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-rqc-tempfill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #94a3b8;
  transition: width .2s ease, background .2s ease;
}
.hp-rqc-tempbar.is-ok .hp-rqc-tempfill { background: #22c55e; }
.hp-rqc-tempbar.is-mid .hp-rqc-tempfill { background: #eab308; }
.hp-rqc-tempbar.is-warm .hp-rqc-tempfill { background: #f97316; }
.hp-rqc-tempbar.is-hot .hp-rqc-tempfill { background: #ef4444; }
.hp-rqc-tempbar.is-unknown .hp-rqc-tempfill { background: #94a3b8; }
.hp-rqc-gate-box {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .6rem;
  margin-bottom: .75rem;
  background: var(--bg);
}
.hp-rqc-gate-box.is-ok { border-color: #86efac; }
.hp-rqc-gate-box.is-mid { border-color: #fcd34d; }
.hp-rqc-gate-box.is-warm { border-color: #fdba74; }
.hp-rqc-gate-box.is-hot { border-color: #fca5a5; }
.hp-rqc-gate-ready {
  margin: 0;
  font-weight: 750;
  font-size: 1rem;
  line-height: 1.3;
}
.hp-rqc-bars { display: grid; gap: .35rem; margin-bottom: .75rem; }
.hp-rqc-bar-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(70px, 42%);
  gap: .35rem .5rem;
  align-items: center;
}
.hp-rqc-bar {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 65%, var(--bg));
  overflow: hidden;
}
.hp-rqc-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 70%, #64748b);
  transition: width .18s ease;
}
.hp-rqc-bar.has-avvik .hp-rqc-bar-fill { background: #f97316; }
.hp-rqc-next {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .6rem;
  margin-bottom: .65rem;
  background: color-mix(in srgb, var(--brand) 6%, var(--bg));
}
.hp-rqc-next-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .95rem;
}
.hp-rqc-warn {
  border: 1px solid #fecaca;
  border-radius: 10px;
  padding: .5rem .6rem;
  margin-bottom: .65rem;
  background: #fef2f2;
}
.hp-rqc-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
  line-height: 1.4;
}
.hp-rqc-av-sum,
.hp-rqc-photo-sum {
  margin-bottom: .65rem;
}
.hp-rqc-av-sum-ul {
  margin: 0;
  padding-left: 1.05rem;
  font-size: .84rem;
  line-height: 1.4;
}
.hp-rqc-av-sum-ul li.is-open { font-weight: 600; }
.hp-rqc-av-sum-ul li.is-fixed { opacity: .75; }
.hp-rqc-links { margin-bottom: .65rem; }
.hp-rqc-link-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .5rem;
}
.hp-rqc-link-grid a {
  font-size: .8rem;
  font-weight: 650;
  padding: .25rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg);
  text-decoration: none;
  color: inherit;
}
.hp-rqc-link-grid a:hover {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 10%, var(--bg));
}
.hp-rqc-commit-text {
  width: 100%;
  font-size: .8rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .5rem .55rem;
  background: var(--bg);
  resize: vertical;
}
.hp-rqc-nonadvice {
  margin: .5rem 0 0;
  font-size: .78rem;
  line-height: 1.35;
}
.hp-rqc-privacy {
  margin-top: 1rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .65rem;
  background: var(--bg-elev);
}
.hp-rqc-privacy summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .88rem;
}
.hp-rqc-faq details {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .7rem;
  margin-bottom: .4rem;
  background: var(--bg-elev);
}
.hp-rqc-faq summary {
  cursor: pointer;
  font-weight: 650;
}
@media (max-width: 560px) {
  .hp-rqc-hero { grid-template-columns: 1fr; }
  .hp-rqc-hero-mascot { width: 56px; height: 56px; }
  .hp-rqc-hero-copy { grid-column: 1; }
  .hp-rqc-bar-row { grid-template-columns: 1fr; gap: .2rem; }
  .hp-rqc-panel { position: static; }
  .hp-rqc-row-bottom { grid-template-columns: 1fr; }
}
@media (min-width: 901px) {
  .hp-rqc-hero { grid-template-columns: 72px 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-rqc-bar-fill { transition: none; }
  .hp-rqc-tempfill { transition: none; }
  .hp-rqc-row { transition: none; }
}


/* —— Kvalitetsmilepæler nybygg (build_qc / build-kvalitet-milepel) ——
   Reuses .hp-rqc-* layout tokens; root also has .hp-bqc for targeting. */
.hp-bqc.hp-rqc { /* same layout as remodel QC */ }
.hp-bqc .hp-rqc-gate-tabs { gap: .3rem; }
.hp-bqc .hp-rqc-tab { font-size: .82rem; }
@media (max-width: 560px) {
  .hp-bqc .hp-rqc-tab { font-size: .78rem; }
}
/* —— Fukt-risiko før oppuss (remodel_fukt) —— */
.hp-rmf { margin-top: .25rem; }
.hp-rmf-hero {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-rmf-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 14px;
  object-fit: cover;
}
.hp-rmf-hero-copy { min-width: 0; }
.hp-rmf-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.1rem;
}
.hp-rmf-lead-bullets li { margin: .2rem 0; }
.hp-rmf-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 10px;
  padding: .45rem .7rem;
  background: var(--surface-2, #f8fafc);
}
.hp-rmf-how summary {
  cursor: pointer;
  font-weight: 650;
}
.hp-rmf-how-list {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
}
.hp-rmf-how-list li { margin: .2rem 0; }
.hp-rmf-demo-badge {
  display: inline-block;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
  vertical-align: middle;
}
.hp-rmf-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .5rem;
}
.hp-rmf-demos .chip { font-weight: 600; }
.hp-rmf-demos .chip:hover,
.hp-rmf-demos .chip.active,
.hp-rmf-demos .chip[aria-pressed="true"] {
  outline: 2px solid var(--accent, #0d9488);
  outline-offset: 1px;
}
.hp-rmf-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-rmf-demo-note { margin: 0 0 .65rem; }
.hp-rmf-layout {
  display: grid;
  grid-template-columns: 1fr minmax(260px, 340px);
  gap: 1rem 1.25rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-rmf-layout {
    grid-template-columns: 1fr;
  }
  .hp-rmf-panel { order: -1; }
  .hp-rmf-hero { grid-template-columns: 1fr; }
  .hp-rmf-hero-mascot { width: 56px; height: 56px; }
}
.hp-rmf-section {
  margin: 1.1rem 0 .45rem;
  font-size: 1.05rem;
  font-weight: 700;
}
.hp-rmf-section:first-child { margin-top: 0; }
.hp-rmf-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .65rem 0 .35rem;
}
.hp-rmf-status-filters { margin-top: .15rem; }
.hp-rmf-filter-bar .chip.is-on,
.hp-rmf-filter-bar .chip[aria-pressed="true"] {
  outline: 2px solid var(--accent, #0d9488);
  outline-offset: 1px;
  font-weight: 650;
}
.hp-rmf-focus-hint {
  margin: .45rem 0 .25rem;
  padding: .45rem .6rem;
  border-radius: 10px;
  background: #ecfeff;
  border: 1px solid #a5f3fc;
}
.hp-rmf-quick-actions { align-items: center; }
.hp-rmf-cat {
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 12px;
  padding: .65rem .75rem .5rem;
  margin: 0 0 .65rem;
  background: var(--surface, #fff);
}
.hp-rmf-cat.is-focus-zone {
  border-color: #67e8f9;
  box-shadow: 0 0 0 1px rgba(6, 182, 212, .25);
}
.hp-rmf-cat-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .35rem;
  align-items: baseline;
}
.hp-rmf-cat-title {
  margin: 0;
  font-size: .98rem;
  font-weight: 700;
}
.hp-rmf-cat-bar {
  height: 6px;
  border-radius: 999px;
  background: #e5e7eb;
  overflow: hidden;
  margin: .35rem 0 .4rem;
}
.hp-rmf-cat-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #94a3b8;
  transition: width .2s ease;
}
.hp-rmf-cat-bar[data-level="ok"] .hp-rmf-cat-bar-fill { background: #34d399; }
.hp-rmf-cat-bar[data-level="mid"] .hp-rmf-cat-bar-fill { background: #fbbf24; }
.hp-rmf-cat-bar[data-level="low"] .hp-rmf-cat-bar-fill { background: #94a3b8; }
.hp-rmf-cat-bar[data-level="hot"] .hp-rmf-cat-bar-fill { background: #f87171; }
.hp-rmf-cat-help { margin: .2rem 0 .45rem; }
.hp-rmf-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .45rem;
}
.hp-rmf-row {
  border: 1px solid var(--border, #e8eaee);
  border-radius: 10px;
  padding: .45rem .55rem;
  background: var(--surface-2, #fafbfc);
  transition: border-color .15s ease, background .15s ease;
}
.hp-rmf-row.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-rmf-row.is-note {
  border-color: #7dd3fc;
  background: #f0f9ff;
}
.hp-rmf-row.is-red {
  border-color: #fca5a5;
  background: #fef2f2;
}
.hp-rmf-row.is-deal {
  border-color: #f87171;
  background: #fee2e2;
  box-shadow: inset 3px 0 0 #dc2626;
}
.hp-rmf-row.is-na {
  opacity: .72;
  border-style: dashed;
}
.hp-rmf-row.is-unchecked {
  border-color: #e8eaee;
}
.hp-rmf-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  justify-content: space-between;
  align-items: flex-start;
}
.hp-rmf-row-label {
  flex: 1 1 12rem;
  min-width: 0;
  font-weight: 600;
  font-size: .92rem;
}
.hp-rmf-weight-badge {
  display: inline-block;
  margin-left: .35rem;
  font-size: .68rem;
  font-weight: 700;
  padding: .08rem .32rem;
  border-radius: 999px;
  background: #e0f2fe;
  color: #075985;
  vertical-align: middle;
}
.hp-rmf-status-wrap { flex: 0 0 auto; }
.hp-rmf-status {
  min-width: 9.5rem;
  max-width: 100%;
  font-size: .88rem;
}
.hp-rmf-note {
  width: 100%;
  margin-top: .35rem;
  font-size: .88rem;
  padding: .35rem .45rem;
  border-radius: 8px;
  border: 1px solid var(--border, #e5e7eb);
}
.hp-rmf-rf-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .35rem;
}
.hp-rmf-rf-item {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  padding: .4rem .5rem;
  border-radius: 8px;
  border: 1px solid transparent;
  cursor: pointer;
}
.hp-rmf-rf-item:has(input:checked) {
  background: #fef2f2;
  border-color: #fecaca;
}
.hp-rmf-privacy {
  margin-top: .85rem;
  font-size: .9rem;
}
.hp-rmf-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: var(--surface, #fff);
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}
.hp-rmf-empty p { margin: 0; }
.hp-rmf-live {
  margin-bottom: .65rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid var(--border, #eef0f3);
}
.hp-rmf-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .78rem;
}
.hp-rmf-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .5rem 0 .65rem;
}
.hp-rmf-gauges .hp-gauge {
  display: grid;
  gap: .1rem;
  padding: .4rem .45rem;
  border-radius: 10px;
  background: var(--surface-2, #f8fafc);
  border: 1px solid var(--border, #eef0f3);
}
.hp-rmf-gauges .hp-gauge strong {
  font-size: 1.05rem;
}
.hp-rmf-tempbar {
  height: 8px;
  border-radius: 999px;
  background: #e5e7eb;
  overflow: hidden;
  margin: 0 0 .65rem;
}
.hp-rmf-tempfill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #34d399, #fbbf24, #f87171);
  transition: width .2s ease;
}
.hp-rmf-tempbar[data-level="low"] .hp-rmf-tempfill {
  background: #34d399;
}
.hp-rmf-tempbar[data-level="mid"] .hp-rmf-tempfill {
  background: #fbbf24;
}
.hp-rmf-tempbar[data-level="high"] .hp-rmf-tempfill {
  background: #f87171;
}
.hp-rmf-readiness {
  padding: .5rem .55rem;
  border-radius: 10px;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  margin-bottom: .55rem;
}
.hp-rmf-readiness[data-level="mid"] {
  background: #fffbeb;
  border-color: #fde68a;
}
.hp-rmf-readiness[data-level="high"] {
  background: #fef2f2;
  border-color: #fecaca;
}
.hp-rmf-ready-title {
  margin: 0 0 .2rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-rmf-gate {
  padding: .5rem .55rem;
  border-radius: 10px;
  background: var(--surface-2, #f8fafc);
  border: 1px solid var(--border, #e5e7eb);
  margin-bottom: .55rem;
}
.hp-rmf-gate[data-level="ok"] {
  background: #f0fdf4;
  border-color: #bbf7d0;
}
.hp-rmf-gate[data-level="mid"] {
  background: #fffbeb;
  border-color: #fde68a;
}
.hp-rmf-gate[data-level="high"] {
  background: #fef2f2;
  border-color: #fecaca;
}
.hp-rmf-gate[data-level="low"] {
  background: #f8fafc;
}
.hp-rmf-gate-title {
  margin: 0 0 .2rem;
  font-weight: 700;
  font-size: .92rem;
}
.hp-rmf-gate-ul {
  margin: .35rem 0 0;
  padding-left: 1.05rem;
  font-size: .86rem;
}
.hp-rmf-gate-ul li { margin: .12rem 0; }
.hp-rmf-buf-suggest {
  margin: 0 0 .55rem;
  padding: .5rem .55rem;
  border-radius: 10px;
  background: #faf5ff;
  border: 1px solid #e9d5ff;
}
.hp-rmf-counts {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin: 0 0 .55rem;
}
.hp-rmf-pill {
  display: inline-block;
  font-size: .75rem;
  font-weight: 650;
  padding: .18rem .45rem;
  border-radius: 999px;
  background: #f1f5f9;
  color: #334155;
}
.hp-rmf-pill-ok { background: #dcfce7; color: #166534; }
.hp-rmf-pill-note { background: #e0f2fe; color: #075985; }
.hp-rmf-pill-red { background: #fee2e2; color: #991b1b; }
.hp-rmf-pill-deal { background: #fecaca; color: #7f1d1d; }
.hp-rmf-pill-open { background: #f1f5f9; color: #475569; }
.hp-rmf-warn {
  margin: 0 0 .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
}
.hp-rmf-warn-ul {
  margin: 0;
  padding-left: 1.05rem;
  font-size: .88rem;
}
.hp-rmf-warn-ul li { margin: .15rem 0; }
.hp-rmf-next {
  margin: 0 0 .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: var(--surface-2, #f8fafc);
}
.hp-rmf-commit-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.35;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  border-radius: 8px;
  border: 1px solid var(--border, #e5e7eb);
  padding: .45rem .5rem;
  resize: vertical;
  background: #fafafa;
}
.hp-rmf-faq {
  border-top: 1px solid var(--border, #eef0f3);
  padding-top: .75rem;
}
.hp-rmf-faq details {
  margin: .35rem 0;
  padding: .35rem 0;
}
.hp-rmf-faq summary {
  cursor: pointer;
  font-weight: 650;
}
@media (max-width: 560px) {
  .hp-rmf-hero { grid-template-columns: 1fr; }
  .hp-rmf-status { min-width: 0; width: 100%; }
  .hp-rmf-panel { position: static; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-rmf-tempfill,
  .hp-rmf-cat-bar-fill { transition: none; }
  .hp-rmf-row { transition: none; }
}

/* —— El-oppgradering (remodel_el) —— */
.hp-rel { margin-top: .25rem; }
.hp-rel-hero {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-rel-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 14px;
  object-fit: cover;
}
.hp-rel-hero-copy { min-width: 0; }
.hp-rel-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.1rem;
}
.hp-rel-lead-bullets li { margin: .2rem 0; }
.hp-rel-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 10px;
  padding: .45rem .7rem;
  background: var(--surface-2, #f8fafc);
}
.hp-rel-how summary {
  cursor: pointer;
  font-weight: 650;
}
.hp-rel-how-list {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
}
.hp-rel-how-list li { margin: .2rem 0; }
.hp-rel-demo-badge {
  display: inline-block;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
  vertical-align: middle;
}
.hp-rel-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .5rem;
}
.hp-rel-demos .chip { font-weight: 600; }
.hp-rel-demos .chip:hover,
.hp-rel-demos .chip.active,
.hp-rel-demos .chip[aria-pressed="true"],
.hp-rel-packs .chip:hover {
  outline: 2px solid var(--accent, #0d9488);
  outline-offset: 1px;
}
.hp-rel-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-rel-demo-note { margin: 0 0 .65rem; }
.hp-rel-packs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-rel-layout {
  display: grid;
  grid-template-columns: 1fr minmax(260px, 340px);
  gap: 1rem 1.25rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-rel-layout { grid-template-columns: 1fr; }
  .hp-rel-panel { order: -1; }
  .hp-rel-hero { grid-template-columns: 1fr; }
  .hp-rel-hero-mascot { width: 56px; height: 56px; }
}
.hp-rel-section {
  margin: 1.1rem 0 .45rem;
  font-size: 1.05rem;
  font-weight: 700;
}
.hp-rel-section:first-child { margin-top: 0; }
.hp-rel-sg-list,
.hp-rel-ob-list,
.hp-rel-rf-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .4rem;
}
.hp-rel-sg-row {
  display: flex;
  gap: .35rem;
  align-items: flex-start;
  justify-content: space-between;
  border: 1px solid var(--border, #e8eaee);
  border-radius: 10px;
  padding: .4rem .5rem;
  background: var(--surface-2, #fafbfc);
  transition: border-color .15s ease, background .15s ease;
}
.hp-rel-sg-row.is-on {
  border-color: #99f6e4;
  background: #f0fdfa;
  box-shadow: inset 3px 0 0 #0d9488;
}
.hp-rel-sg-item {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  flex: 1 1 auto;
  min-width: 0;
  cursor: pointer;
}
.hp-rel-sg-label { font-size: .92rem; font-weight: 600; line-height: 1.35; }
.hp-rel-lvl {
  display: inline-block;
  margin-left: .35rem;
  font-size: .68rem;
  font-weight: 700;
  padding: .08rem .32rem;
  border-radius: 999px;
  vertical-align: middle;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.hp-rel-lvl-high { background: #fee2e2; color: #991b1b; }
.hp-rel-lvl-mid { background: #fef3c7; color: #92400e; }
.hp-rel-lvl-low { background: #e0f2fe; color: #075985; }
.hp-rel-ob-row {
  border: 1px solid var(--border, #e8eaee);
  border-radius: 10px;
  padding: .45rem .55rem;
  background: var(--surface-2, #fafbfc);
  transition: border-color .15s ease, background .15s ease;
}
.hp-rel-ob-row.is-ok {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-rel-ob-row.is-warn {
  border-color: #fde68a;
  background: #fffbeb;
}
.hp-rel-ob-row.is-bad {
  border-color: #fca5a5;
  background: #fef2f2;
  box-shadow: inset 3px 0 0 #dc2626;
}
.hp-rel-ob-row.is-na {
  opacity: .72;
  border-style: dashed;
}
.hp-rel-ob-row.is-open {
  border-color: #e8eaee;
}
.hp-rel-ob-top {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  justify-content: space-between;
  align-items: flex-start;
}
.hp-rel-ob-label {
  flex: 1 1 12rem;
  min-width: 0;
  font-weight: 600;
  font-size: .92rem;
}
.hp-rel-st-wrap { flex: 0 0 auto; }
.hp-rel-st {
  min-width: 9.5rem;
  max-width: 100%;
  font-size: .88rem;
}
.hp-rel-rf-item {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  padding: .4rem .5rem;
  border-radius: 8px;
  border: 1px solid transparent;
  cursor: pointer;
}
.hp-rel-rf-item:has(input:checked) {
  background: #fef2f2;
  border-color: #fecaca;
}
.hp-rel-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 12px;
  margin: .35rem 0 .65rem;
}
.hp-rel-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 720px;
  font-size: .88rem;
}
.hp-rel-table th,
.hp-rel-table td {
  padding: .4rem .45rem;
  border-bottom: 1px solid var(--border, #eef0f3);
  vertical-align: top;
  text-align: left;
}
.hp-rel-table thead th {
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #64748b;
  background: var(--surface-2, #f8fafc);
  position: sticky;
  top: 0;
}
.hp-rel-row.is-on { background: color-mix(in srgb, #0d9488 4%, transparent); }
.hp-rel-row.is-pack td:first-child {
  box-shadow: inset 3px 0 0 #16a34a;
}
.hp-rel-row.is-over {
  opacity: .88;
}
.hp-rel-row.is-over td:first-child {
  box-shadow: inset 3px 0 0 #f59e0b;
}
.hp-rel-name {
  display: block;
  font-weight: 650;
  line-height: 1.3;
}
.hp-rel-hint {
  display: block;
  margin-top: .15rem;
  line-height: 1.3;
}
.hp-rel-check { display: inline-flex; align-items: center; }
.hp-rel-cost { min-width: 5.5rem; max-width: 7rem; }
.hp-rel-weeks-in { width: 3.5rem; }
.hp-rel-kind {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  padding: .12rem .35rem;
  border-radius: 999px;
  white-space: nowrap;
}
.hp-rel-kind-must { background: #fee2e2; color: #991b1b; }
.hp-rel-kind-load { background: #e0e7ff; color: #3730a3; }
.hp-rel-kind-comfort { background: #dbeafe; color: #1e40af; }
.hp-rel-kind-rehab { background: #ffedd5; color: #9a3412; }
.hp-rel-kind-safety { background: #d1fae5; color: #065f46; }
.hp-rel-kind-doc { background: #e0f2fe; color: #075985; }
.hp-rel-kind-later { background: #e5e7eb; color: #374151; }
.hp-rel-dec {
  display: inline-block;
  font-size: .75rem;
  font-weight: 700;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  white-space: nowrap;
}
.hp-rel-dec.is-do { background: #dcfce7; color: #166534; }
.hp-rel-dec.is-must { background: #fee2e2; color: #991b1b; }
.hp-rel-dec.is-skip { background: #fef3c7; color: #92400e; }
.hp-rel-dec.is-later { background: #e5e7eb; color: #374151; }
.hp-rel-dec.is-doc { background: #dbeafe; color: #1e40af; }
.hp-rel-privacy {
  margin-top: .85rem;
  font-size: .9rem;
}
.hp-rel-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: var(--surface, #fff);
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}
.hp-rel-empty p { margin: 0; }
.hp-rel-live {
  margin-bottom: .65rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid var(--border, #eef0f3);
}
.hp-rel-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .78rem;
}
.hp-rel-tempbar {
  height: 8px;
  border-radius: 999px;
  background: #e5e7eb;
  overflow: hidden;
  margin: .4rem 0 .45rem;
}
.hp-rel-tempfill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #34d399, #fbbf24, #f87171);
  transition: width .2s ease;
}
.hp-rel-tempbar[data-level="low"] .hp-rel-tempfill { background: #34d399; }
.hp-rel-tempbar[data-level="mid"] .hp-rel-tempfill { background: #fbbf24; }
.hp-rel-tempbar[data-level="high"] .hp-rel-tempfill { background: #f87171; }
.hp-rel-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .5rem 0 .65rem;
}
.hp-rel-gauges .hp-gauge {
  display: grid;
  gap: .1rem;
  padding: .4rem .45rem;
  border-radius: 10px;
  background: var(--surface-2, #f8fafc);
  border: 1px solid var(--border, #eef0f3);
}
.hp-rel-gauges .hp-gauge strong { font-size: 1.05rem; }
.hp-rel-triad {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin: 0 0 .55rem;
}
.hp-rel-triad-card {
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 10px;
  padding: .4rem .45rem;
  display: grid;
  gap: .1rem;
  background: var(--surface-2, #f8fafc);
}
.hp-rel-triad-card strong {
  font-size: 1.1rem;
}
.hp-rel-triad-card.is-do { border-color: #86efac; background: #f0fdf4; }
.hp-rel-triad-card.is-skip { border-color: #fde68a; background: #fffbeb; }
.hp-rel-triad-card.is-later { border-color: #d1d5db; background: #f9fafb; }
.hp-rel-readiness {
  padding: .5rem .55rem;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  margin-bottom: .55rem;
}
.hp-rel-readiness[data-level="low"] {
  background: #f0fdf4;
  border-color: #bbf7d0;
}
.hp-rel-readiness[data-level="mid"] {
  background: #fffbeb;
  border-color: #fde68a;
}
.hp-rel-readiness[data-level="high"] {
  background: #fef2f2;
  border-color: #fecaca;
}
.hp-rel-ready-title {
  margin: 0 0 .2rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-rel-bar-wrap { margin: 0 0 .55rem; }
.hp-rel-bar {
  height: 8px;
  border-radius: 999px;
  background: #e5e7eb;
  overflow: hidden;
}
.hp-rel-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #34d399;
  transition: width .2s ease;
}
.hp-rel-subh {
  margin: .55rem 0 .35rem;
  font-size: .95rem;
  font-weight: 700;
}
.hp-rel-rank {
  margin: 0 0 .45rem;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-rel-rank li { margin: .2rem 0; }
.hp-rel-rank-top { font-weight: 650; }
.hp-rel-alerts {
  margin: 0 0 .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
}
.hp-rel-alert-list {
  margin: 0;
  padding-left: 1.05rem;
  font-size: .88rem;
}
.hp-rel-alert-list li { margin: .15rem 0; }
.hp-rel-next {
  margin: 0 0 .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: var(--surface-2, #f8fafc);
}
.hp-rel-commit { margin-top: .35rem; }
.hp-rel-commit-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.35;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  border-radius: 8px;
  border: 1px solid var(--border, #e5e7eb);
  padding: .45rem .5rem;
  resize: vertical;
  background: #fafafa;
}
.hp-rel-faq {
  border-top: 1px solid var(--border, #eef0f3);
  padding-top: .75rem;
}
.hp-rel-faq details {
  margin: .35rem 0;
  padding: .35rem 0;
}
.hp-rel-faq summary {
  cursor: pointer;
  font-weight: 650;
}
@media (max-width: 560px) {
  .hp-rel-hero { grid-template-columns: 1fr; }
  .hp-rel-st { min-width: 0; width: 100%; }
  .hp-rel-panel { position: static; }
  .hp-rel-triad { grid-template-columns: 1fr; }
  .hp-rel-table { min-width: 680px; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-rel-tempfill,
  .hp-rel-fill { transition: none; }
}

/* —— Dokumentasjon rehab (remodel_docs / remodel-dokumentasjon-rehab) —— */
.hp-rdoc { margin-top: .25rem; }
.hp-rdoc-hero {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-rdoc-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 14px;
  object-fit: cover;
}
.hp-rdoc-hero-copy { min-width: 0; }
.hp-rdoc-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.1rem;
}
.hp-rdoc-lead-bullets li { margin: .2rem 0; }
.hp-rdoc-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 10px;
  padding: .45rem .7rem;
  background: var(--surface-2, #f8fafc);
}
.hp-rdoc-how summary { cursor: pointer; font-weight: 650; }
.hp-rdoc-how-list {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
}
.hp-rdoc-how-list li { margin: .2rem 0; }
.hp-rdoc-demo-badge {
  display: inline-block;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
  vertical-align: middle;
}
.hp-rdoc-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .5rem;
}
.hp-rdoc-demos .chip { font-weight: 600; }
.hp-rdoc-demos .chip:hover,
.hp-rdoc-demos .chip[aria-pressed="true"] {
  outline: 2px solid var(--accent, #0d9488);
  outline-offset: 1px;
}
.hp-rdoc-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-rdoc-demo-note { margin: 0 0 .65rem; }
.hp-rdoc-layout {
  display: grid;
  grid-template-columns: 1fr minmax(260px, 340px);
  gap: 1rem 1.25rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-rdoc-layout { grid-template-columns: 1fr; }
  .hp-rdoc-panel { position: static; }
}
.hp-rdoc-section {
  margin: 1.1rem 0 .55rem;
  font-size: 1.05rem;
  font-weight: 700;
}
.hp-rdoc-cat-tabs,
.hp-rdoc-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-rdoc-tab .hp-rdoc-tab-pct {
  display: inline-block;
  margin-left: .25rem;
  font-size: .72rem;
  font-weight: 700;
  opacity: .8;
}
.hp-rdoc-tab.is-on {
  outline: 2px solid var(--accent, #0d9488);
  outline-offset: 1px;
}
.hp-rdoc-fc {
  font-weight: 700;
  font-size: .72rem;
  opacity: .85;
  margin-left: .1rem;
}
.hp-rdoc-smart {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: 0 0 .45rem;
}
.hp-rdoc-smart-hint {
  margin: 0 0 .55rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: #f0f9ff;
  border: 1px solid #bae6fd;
}
.hp-rdoc-phase-help { margin: 0 0 .45rem; }
.hp-rdoc-row.hp-rdoc-flash {
  outline: 2px solid var(--accent, #0d9488);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent, #0d9488) 22%, transparent);
}
.hp-rdoc-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .45rem;
}
.hp-rdoc-row {
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 10px;
  padding: .5rem .6rem;
  background: #fff;
  transition: border-color .15s ease, background .15s ease;
}
.hp-rdoc-row.is-critical {
  border-left: 3px solid #f59e0b;
}
.hp-rdoc-row.is-st-arkivert {
  background: #f0fdf4;
  border-color: #bbf7d0;
}
.hp-rdoc-row.is-st-delvis {
  background: #fffbeb;
  border-color: #fde68a;
}
.hp-rdoc-row.is-st-mangler {
  background: #fff;
}
.hp-rdoc-row.is-st-na {
  opacity: .72;
  background: #f8fafc;
}
.hp-rdoc-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-rdoc-label {
  flex: 1 1 12rem;
  font-weight: 600;
  font-size: .92rem;
  line-height: 1.35;
}
.hp-rdoc-crit-badge {
  display: inline-block;
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .08rem .3rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
  margin-right: .25rem;
  vertical-align: middle;
}
.hp-rdoc-status-wrap { flex: 0 0 auto; }
.hp-rdoc-status {
  min-width: 8.5rem;
  font-size: .88rem;
}
.hp-rdoc-row-bottom { margin-top: .35rem; }
.hp-rdoc-note {
  width: 100%;
  font-size: .85rem;
  border-radius: 8px;
  border: 1px solid var(--border, #e5e7eb);
  padding: .35rem .45rem;
}
.hp-rdoc-pay-form { margin-bottom: .25rem; }
.hp-rdoc-pay-list {
  display: grid;
  gap: .4rem;
  margin: .35rem 0 .5rem;
}
.hp-rdoc-pay-item {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .75rem;
  justify-content: space-between;
  align-items: flex-start;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 10px;
  padding: .45rem .55rem;
  background: var(--surface-2, #f8fafc);
}
.hp-rdoc-pay-item-main {
  display: grid;
  gap: .1rem;
  min-width: 0;
  flex: 1 1 12rem;
}
.hp-rdoc-pay-item-note { display: block; }
.hp-rdoc-pay-item-side {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
}
.hp-rdoc-pay-amt {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.hp-rdoc-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}
.hp-rdoc-empty { margin: 0; }
.hp-rdoc-gauges {
  display: grid;
  grid-template-columns: 1fr;
  gap: .45rem;
  margin: 0 0 .65rem;
}
.hp-rdoc-gauge {
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 10px;
  padding: .45rem .55rem;
  background: var(--surface-2, #f8fafc);
  display: grid;
  gap: .1rem;
}
.hp-rdoc-gauge-main strong { font-size: 1.1rem; }
.hp-rdoc-gauge-main.is-lav { background: #ecfdf5; border-color: #a7f3d0; }
.hp-rdoc-gauge-main.is-avklar { background: #fffbeb; border-color: #fde68a; }
.hp-rdoc-gauge-main.is-hoy { background: #fff7ed; border-color: #fed7aa; }
.hp-rdoc-tempbar-wrap { margin: 0 0 .65rem; }
.hp-rdoc-tempbar {
  height: 10px;
  border-radius: 999px;
  background: #e5e7eb;
  overflow: hidden;
}
.hp-rdoc-tempfill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #94a3b8;
  transition: width .2s ease, background .2s ease;
}
.hp-rdoc-tempbar.is-lav .hp-rdoc-tempfill { background: #10b981; }
.hp-rdoc-tempbar.is-avklar .hp-rdoc-tempfill { background: #f59e0b; }
.hp-rdoc-tempbar.is-hoy .hp-rdoc-tempfill { background: #f97316; }
.hp-rdoc-pay-sum {
  margin: 0 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: #f0f9ff;
  border: 1px solid #bae6fd;
}
.hp-rdoc-pay-total {
  margin: 0;
  font-weight: 700;
  font-size: 1.05rem;
}
.hp-rdoc-bars {
  display: grid;
  gap: .35rem;
  margin: 0 0 .65rem;
}
.hp-rdoc-bar-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(80px, 1.2fr);
  gap: .35rem;
  align-items: center;
}
.hp-rdoc-bar {
  height: 8px;
  border-radius: 999px;
  background: #e5e7eb;
  overflow: hidden;
}
.hp-rdoc-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #64748b;
  transition: width .2s ease;
}
.hp-rdoc-bar.is-low .hp-rdoc-bar-fill { background: #f97316; }
.hp-rdoc-bar.is-mid .hp-rdoc-bar-fill { background: #f59e0b; }
.hp-rdoc-bar.is-high .hp-rdoc-bar-fill { background: #10b981; }
.hp-rdoc-next {
  margin: 0 0 .65rem;
  padding: .5rem .55rem;
  border-radius: 10px;
  background: var(--surface-2, #f8fafc);
  border: 1px solid var(--border, #e5e7eb);
}
.hp-rdoc-next-title {
  margin: 0 0 .2rem;
  font-weight: 700;
}
.hp-rdoc-warn {
  margin: 0 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
}
.hp-rdoc-warn-ul {
  margin: 0;
  padding-left: 1.05rem;
  font-size: .88rem;
  list-style: none;
  padding-left: 0;
}
.hp-rdoc-warn-ul li { margin: .2rem 0; }
.hp-rdoc-jump-btn {
  display: block;
  width: 100%;
  text-align: left;
  background: transparent;
  border: 0;
  padding: .2rem .15rem;
  font: inherit;
  font-size: .88rem;
  color: inherit;
  cursor: pointer;
  border-radius: 6px;
}
.hp-rdoc-jump-btn:hover,
.hp-rdoc-jump-btn:focus-visible {
  background: color-mix(in srgb, var(--accent, #0d9488) 12%, #fff);
  outline: none;
}
.hp-rdoc-phase-hint {
  margin: 0 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid var(--border, #e5e7eb);
}
.hp-rdoc-folder {
  margin: 0 0 .65rem;
}
.hp-rdoc-folder-pre {
  margin: 0;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: #0f172a;
  color: #e2e8f0;
  font-size: .72rem;
  line-height: 1.4;
  overflow-x: auto;
  white-space: pre;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}
.hp-rdoc-draft-box {
  margin: 0 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid var(--border, #e5e7eb);
}
.hp-rdoc-links { margin: 0 0 .55rem; }
.hp-rdoc-link-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .55rem;
  font-size: .88rem;
}
.hp-rdoc-commit { margin-top: .35rem; }
.hp-rdoc-commit-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.35;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  border-radius: 8px;
  border: 1px solid var(--border, #e5e7eb);
  padding: .45rem .5rem;
  resize: vertical;
  background: #fafafa;
}
.hp-rdoc-nonadvice {
  margin: .5rem 0 0;
  font-size: .78rem;
}
.hp-rdoc-privacy {
  margin-top: .85rem;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 10px;
  padding: .4rem .6rem;
  background: var(--surface-2, #f8fafc);
}
.hp-rdoc-privacy summary { cursor: pointer; font-weight: 650; }
.hp-rdoc-faq {
  border-top: 1px solid var(--border, #eef0f3);
  padding-top: .75rem;
}
.hp-rdoc-faq details {
  margin: .35rem 0;
  padding: .35rem 0;
}
.hp-rdoc-faq summary { cursor: pointer; font-weight: 650; }
@media (max-width: 560px) {
  .hp-rdoc-hero { grid-template-columns: 1fr; }
  .hp-rdoc-status { min-width: 0; width: 100%; }
  .hp-rdoc-bar-row { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-rdoc-tempfill,
  .hp-rdoc-bar-fill { transition: none; }
}


/* —— Støy & nabo (remodel-nabovarsel-stoy · remodel_noise) —— */
.hp-rns { margin-top: .25rem; }
.hp-rns-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-rns-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-rns-hero-copy { min-width: 0; }
.hp-rns-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  color: var(--muted, #5b6470);
}
.hp-rns-lead-bullets li { margin: .2rem 0; }
.hp-rns-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-rns-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rns-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-rns-how-list li { margin: .2rem 0; }
.hp-rns-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 18%, var(--bg-elev, #fff));
  color: #92400e;
}
.hp-rns-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  margin: 0 0 .45rem;
}
.hp-rns-demos .chip { font-size: .82rem; cursor: pointer; }
.hp-rns-demos .chip:hover,
.hp-rns-demos .chip.active,
.hp-rns-demos .chip[aria-pressed="true"] {
  border-color: var(--brand, #0f766e);
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, var(--bg-elev, #fff));
}
.hp-rns-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-rns-demo-note { margin: 0 0 .65rem; }
.hp-rns-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .9fr);
  gap: 1rem 1.25rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-rns-layout { grid-template-columns: 1fr; }
  .hp-rns-panel { order: -1; }
  .hp-rns-hero { grid-template-columns: 1fr; }
  .hp-rns-hero-mascot { width: 56px; height: 56px; }
}
.hp-rns-section {
  margin: 1.1rem 0 .5rem;
  font-size: 1.05rem;
  font-weight: 700;
}
.hp-rns-section:first-child { margin-top: 0; }
.hp-rns-who-list,
.hp-rns-rf-list,
.hp-rns-cov-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .35rem;
}
.hp-rns-who-list > li {
  display: flex;
  align-items: flex-start;
  gap: .35rem;
}
.hp-rns-who-item,
.hp-rns-rf-item {
  display: flex;
  align-items: flex-start;
  gap: .45rem;
  flex: 1;
  min-width: 0;
  cursor: pointer;
  font-size: .9rem;
  padding: .45rem .55rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-elev, #fff);
}
.hp-rns-who-item:has(input:checked),
.hp-rns-rf-item:has(input:checked) {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, var(--bg-elev, #fff));
}
.hp-rns-cov-row {
  padding: .4rem .5rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-elev, #fff);
}
.hp-rns-cov-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .4rem .65rem;
}
.hp-rns-cov-label { flex: 1; min-width: 12rem; }
.hp-rns-st { min-width: 8.5rem; font-size: .86rem; }
.hp-rns-sev-val {
  display: inline-block;
  margin-left: .35rem;
  font-weight: 700;
  min-width: 1.2rem;
}
.hp-rns-ph-list { display: grid; gap: .4rem; margin-top: .55rem; }
.hp-rns-ph-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .5rem;
  padding: .5rem .6rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-elev, #fff);
}
.hp-rns-ph-main { min-width: 0; flex: 1; }
.hp-rns-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem 1rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 4%);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-rns-live {
  margin-bottom: .65rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-rns-nonadvice-fixed { margin: .25rem 0 0; font-size: .78rem; }
.hp-rns-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
  margin: .55rem 0 .65rem;
}
.hp-rns-gauges .hp-gauge {
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: var(--bg-elev, #fff);
  display: grid;
  gap: .1rem;
}
.hp-rns-gauges .hp-gauge strong { font-size: 1.05rem; }
.hp-rns-readiness {
  margin: .5rem 0 .65rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-rns-readiness[data-level="ok"] {
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
  background: color-mix(in srgb, #16a34a 8%, var(--bg-elev, #fff));
}
.hp-rns-readiness[data-level="check"] {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev, #fff));
}
.hp-rns-readiness[data-level="missing"] {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 8%, var(--bg-elev, #fff));
}
.hp-rns-ready-title { margin: 0 0 .2rem; font-weight: 700; }
.hp-rns-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-rns-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--brand, #0f766e) 80%, #0ea5e9), var(--brand, #0f766e));
  transition: width .2s ease;
}
.hp-rns-hours-box,
.hp-rns-ph-panel,
.hp-rns-alerts,
.hp-rns-next {
  margin: .65rem 0;
  padding: .5rem .55rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: var(--bg-elev, #fff);
}
.hp-rns-ph-sum,
.hp-rns-alert-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-rns-ph-sum li,
.hp-rns-alert-list li { margin: .2rem 0; }
.hp-rns-commit { margin-top: .65rem; }
.hp-rns-commit-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.35;
  resize: vertical;
  min-height: 6rem;
}
.hp-rns-privacy {
  margin-top: .85rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .6rem;
}
.hp-rns-faq details {
  margin: .35rem 0;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .65rem;
  background: var(--bg-elev, #fff);
}
.hp-rns-faq summary { cursor: pointer; font-weight: 600; }
.hp-rns-presets {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-rns-presets .chip { font-size: .8rem; cursor: pointer; }
.hp-rns-presets .chip:hover,
.hp-rns-presets .chip.active {
  border-color: var(--brand, #0f766e);
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, var(--bg-elev, #fff));
}
.hp-rns-filter-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-rns-filter-row .chip { font-size: .8rem; cursor: pointer; }
.hp-rns-filter-row .chip.active,
.hp-rns-filter-row .chip[aria-pressed="true"] {
  border-color: var(--brand, #0f766e);
  background: color-mix(in srgb, var(--brand, #0f766e) 14%, var(--bg-elev, #fff));
  font-weight: 650;
}
.hp-rns-fc {
  display: inline-block;
  min-width: 1.1rem;
  margin-left: .15rem;
  font-variant-numeric: tabular-nums;
  opacity: .85;
}
.hp-rns-st-cluster {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  justify-content: flex-end;
}
.hp-rns-quick-st {
  display: inline-flex;
  flex-wrap: wrap;
  gap: .2rem;
}
.hp-rns-quick-st .chip-xs {
  font-size: .72rem;
  padding: .12rem .35rem;
  line-height: 1.2;
  cursor: pointer;
  min-width: 1.6rem;
  text-align: center;
}
.hp-rns-quick-st .chip-xs.active,
.hp-rns-quick-st .chip-xs[aria-pressed="true"] {
  border-color: var(--brand, #0f766e);
  background: color-mix(in srgb, var(--brand, #0f766e) 16%, var(--bg-elev, #fff));
  font-weight: 700;
}
.hp-rns-cov-row.is-ok {
  border-color: color-mix(in srgb, #16a34a 35%, var(--border));
  background: color-mix(in srgb, #16a34a 6%, var(--bg-elev, #fff));
}
.hp-rns-cov-row.is-warn {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 7%, var(--bg-elev, #fff));
}
.hp-rns-cov-row.is-bad {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 7%, var(--bg-elev, #fff));
}
.hp-rns-cov-row.is-open {
  border-style: dashed;
}
.hp-rns-cov-row.is-na { opacity: .72; }
.hp-rns-cov-row.hp-rns-flash {
  outline: 2px solid var(--brand, #0f766e);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand, #0f766e) 18%, transparent);
}
.hp-rns-timeline {
  margin: .65rem 0;
  padding: .5rem .55rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: var(--bg-elev, #fff);
}
.hp-rns-tl-track {
  position: relative;
  height: 2.4rem;
  border-radius: 8px;
  background:
    repeating-linear-gradient(
      90deg,
      color-mix(in srgb, var(--border) 55%, transparent) 0,
      color-mix(in srgb, var(--border) 55%, transparent) 1px,
      transparent 1px,
      transparent 10%
    ),
    color-mix(in srgb, var(--bg) 70%, var(--bg-elev, #fff));
  overflow: hidden;
}
.hp-rns-tl-bar {
  position: absolute;
  top: .35rem;
  height: 1.7rem;
  border-radius: 6px;
  display: flex;
  align-items: center;
  padding: 0 .3rem;
  font-size: .68rem;
  font-weight: 650;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background: color-mix(in srgb, var(--brand, #0f766e) 35%, #e2e8f0);
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 45%, transparent);
}
.hp-rns-tl-bar.sev-1,
.hp-rns-tl-bar.sev-2 {
  background: color-mix(in srgb, #22c55e 28%, #e2e8f0);
  border-color: color-mix(in srgb, #16a34a 40%, transparent);
}
.hp-rns-tl-bar.sev-3 {
  background: color-mix(in srgb, #f59e0b 32%, #e2e8f0);
  border-color: color-mix(in srgb, #d97706 45%, transparent);
}
.hp-rns-tl-bar.sev-4,
.hp-rns-tl-bar.sev-5 {
  background: color-mix(in srgb, #ef4444 34%, #e2e8f0);
  border-color: color-mix(in srgb, #dc2626 50%, transparent);
}
.hp-rns-subject {
  width: 100%;
  font-size: .86rem;
  padding: .4rem .5rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg-elev, #fff);
}
.hp-rns-seed-row { margin-bottom: .15rem; }
.hp-rns-ph-row[data-sev="5"],
.hp-rns-ph-row[data-sev="4"] {
  border-color: color-mix(in srgb, #dc2626 28%, var(--border));
}
.hp-rns-ph-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  flex-shrink: 0;
}
.hp-rns-formula {
  margin: .55rem 0 .65rem;
  padding: .5rem .55rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: var(--bg-elev, #fff);
}
.hp-rns-formula-line {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  word-break: break-word;
}
.hp-rns-tempbar {
  height: .45rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
  margin: 0 0 .55rem;
}
.hp-rns-tempfill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #22c55e, #f59e0b 55%, #ef4444);
  transition: width .2s ease;
}
.hp-rns-tempbar[data-temp="low"] .hp-rns-tempfill {
  background: #22c55e;
}
.hp-rns-tempbar[data-temp="mid"] .hp-rns-tempfill {
  background: linear-gradient(90deg, #f59e0b, #f97316);
}
.hp-rns-tempbar[data-temp="high"] .hp-rns-tempfill {
  background: linear-gradient(90deg, #f97316, #dc2626);
}
.hp-rns-cov-row.is-prio {
  box-shadow: inset 3px 0 0 var(--brand, #0f766e);
}
.hp-rns-presets [data-rns-suggest-hint]:not([hidden]) {
  font-size: .8rem;
  max-width: 100%;
}
.hp-rns-countdown {
  margin: 0 0 .65rem;
  padding: .5rem .6rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: var(--bg-elev, #fff);
}
.hp-rns-countdown strong {
  display: block;
  font-size: 1.15rem;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
}
.hp-rns-countdown.is-ok {
  border-color: color-mix(in srgb, #16a34a 35%, var(--border));
  background: color-mix(in srgb, #16a34a 6%, var(--bg-elev, #fff));
}
.hp-rns-countdown.is-soon {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 9%, var(--bg-elev, #fff));
}
.hp-rns-countdown.is-today {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 8%, var(--bg-elev, #fff));
}
.hp-rns-countdown.is-past {
  border-color: color-mix(in srgb, #64748b 40%, var(--border));
  background: color-mix(in srgb, #64748b 8%, var(--bg-elev, #fff));
}
.hp-rns-ph-row.is-editing {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand, #0f766e) 14%, transparent);
}
.hp-rns-editing-tag {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .05rem .35rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand, #0f766e) 16%, var(--bg-elev, #fff));
  color: var(--brand, #0f766e);
  vertical-align: middle;
}
.hp-rns-live .hp-bid-num[data-out="ready_badge"] {
  letter-spacing: .01em;
}
@media (prefers-reduced-motion: reduce) {
  .hp-rns-fill,
  .hp-rns-tempfill { transition: none; }
  .hp-rns-cov-row.hp-rns-flash { box-shadow: none; }
}

/* —— Sluttbefaring (remodel_slutt / remodel-sluttbefaring) —— */
.hp-rsb { display: grid; gap: 1rem; }
.hp-rsb-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
}
.hp-rsb-hero-mascot {
  border-radius: 14px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
.hp-rsb-hero-copy { min-width: 0; grid-column: 2; }
.hp-rsb-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-rsb-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .75rem;
  background: var(--bg-elev);
}
.hp-rsb-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-rsb-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-rsb-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
}
.hp-rsb-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #e0e7ff;
  color: #3730a3;
  vertical-align: middle;
}
.hp-rsb-demo-note {
  margin: .15rem 0 0;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
}
.hp-rsb-layout {
  display: grid;
  grid-template-columns: 1fr minmax(240px, 320px);
  gap: 1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-rsb-layout { grid-template-columns: 1fr; }
}
.hp-rsb-section {
  font-size: 1.02rem;
  font-weight: 750;
  margin: 1.1rem 0 .5rem;
}
.hp-rsb-main .hp-rsb-section:first-child { margin-top: 0; }
.hp-rsb-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-bottom: .4rem;
}
.hp-rsb-tab.is-on {
  background: color-mix(in srgb, var(--brand) 18%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  font-weight: 700;
}
.hp-rsb-tab-pct {
  display: inline-block;
  margin-left: .25rem;
  font-size: .72rem;
  font-weight: 800;
  opacity: .85;
}
.hp-rsb-filters,
.hp-rsb-mg-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .35rem 0 .5rem;
}
.hp-rsb-filters .chip.is-on,
.hp-rsb-mg-filters .chip.is-on {
  background: color-mix(in srgb, var(--brand) 16%, var(--bg-elev));
  font-weight: 700;
}
.hp-rsb-phase {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .65rem .75rem .75rem;
  background: var(--bg);
  margin-bottom: .5rem;
}
.hp-rsb-phase-help { margin: 0 0 .5rem; }
.hp-rsb-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .4rem;
}
.hp-rsb-row {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .55rem;
  background: var(--bg-elev);
  transition: border-color .15s ease, background .15s ease;
}
.hp-rsb-row.is-critical {
  border-left: 3px solid color-mix(in srgb, var(--brand) 55%, #64748b);
}
.hp-rsb-row.is-st-ok {
  border-color: #86efac;
  background: color-mix(in srgb, #dcfce7 40%, var(--bg-elev));
}
.hp-rsb-row.is-st-note {
  border-color: #fcd34d;
  background: color-mix(in srgb, #fef9c3 40%, var(--bg-elev));
}
.hp-rsb-row.is-st-mangler {
  border-color: #fca5a5;
  background: color-mix(in srgb, #fee2e2 45%, var(--bg-elev));
}
.hp-rsb-row.is-st-na { opacity: .72; }
.hp-rsb-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .55rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-rsb-label {
  flex: 1 1 12rem;
  font-size: .9rem;
  line-height: 1.35;
  font-weight: 550;
}
.hp-rsb-crit-badge {
  display: inline-block;
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .06rem .28rem;
  border-radius: 4px;
  background: color-mix(in srgb, var(--brand) 18%, #e2e8f0);
  margin-right: .25rem;
  vertical-align: middle;
}
.hp-rsb-status-wrap { flex: 0 0 auto; }
.hp-rsb-status {
  min-width: 8.5rem;
  font-size: .86rem;
}
.hp-rsb-row-bottom {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-top: .35rem;
  align-items: center;
}
.hp-rsb-note {
  flex: 1 1 12rem;
  font-size: .86rem;
  padding: .3rem .45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-rsb-mg-form { margin-bottom: .25rem; }
.hp-rsb-mg-list { display: grid; gap: .4rem; }
.hp-rsb-mg-item {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .55rem;
  background: var(--bg-elev);
}
.hp-rsb-mg-item.is-open { border-color: #fdba74; }
.hp-rsb-mg-item.is-hoy { border-color: #fca5a5; background: color-mix(in srgb, #fee2e2 35%, var(--bg-elev)); }
.hp-rsb-mg-item.is-fixed { opacity: .78; }
.hp-rsb-mg-item-top {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  justify-content: space-between;
  align-items: flex-start;
}
.hp-rsb-mg-badges { display: flex; flex-wrap: wrap; gap: .25rem; }
.hp-rsb-mg-badge {
  font-size: .68rem;
  font-weight: 750;
  padding: .08rem .32rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-rsb-mg-badge.sev-hoy { background: #fee2e2; border-color: #fca5a5; }
.hp-rsb-mg-badge.sev-mid { background: #ffedd5; border-color: #fdba74; }
.hp-rsb-mg-badge.sev-lav { background: #f1f5f9; }
.hp-rsb-mg-badge.st-open { background: #fff7ed; }
.hp-rsb-mg-badge.st-fixed { background: #dcfce7; border-color: #86efac; }
.hp-rsb-mg-meta { margin: .25rem 0 .35rem; }
.hp-rsb-mg-actions { display: flex; flex-wrap: wrap; gap: .3rem; }
.hp-rsb-privacy {
  margin-top: 1rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .65rem;
}
.hp-rsb-privacy summary { cursor: pointer; font-weight: 650; font-size: .9rem; }

.hp-rsb-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem 1rem;
  background: var(--bg-elev);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-rsb-gauges {
  display: grid;
  grid-template-columns: 1fr;
  gap: .45rem;
  margin-bottom: .65rem;
}
.hp-rsb-gauge {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .55rem;
  background: var(--bg);
  display: grid;
  gap: .1rem;
}
.hp-rsb-gauge strong { font-size: 1.05rem; line-height: 1.25; }
.hp-rsb-gauge-main.is-ok { border-color: #86efac; background: color-mix(in srgb, #dcfce7 55%, var(--bg)); }
.hp-rsb-gauge-main.is-mid { border-color: #fcd34d; background: color-mix(in srgb, #fef9c3 55%, var(--bg)); }
.hp-rsb-gauge-main.is-warm { border-color: #fdba74; background: color-mix(in srgb, #ffedd5 55%, var(--bg)); }
.hp-rsb-gauge-main.is-hot { border-color: #fca5a5; background: color-mix(in srgb, #fee2e2 55%, var(--bg)); }
.hp-rsb-gauge-main.is-unknown { border-color: var(--border); }
.hp-rsb-tempbar-wrap { margin: 0 0 .75rem; }
.hp-rsb-tempbar {
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-rsb-tempfill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #94a3b8;
  transition: width .2s ease, background .2s ease;
}
.hp-rsb-tempbar.is-ok .hp-rsb-tempfill { background: #22c55e; }
.hp-rsb-tempbar.is-mid .hp-rsb-tempfill { background: #eab308; }
.hp-rsb-tempbar.is-warm .hp-rsb-tempfill { background: #f97316; }
.hp-rsb-tempbar.is-hot .hp-rsb-tempfill { background: #ef4444; }
.hp-rsb-tempbar.is-unknown .hp-rsb-tempfill { background: #94a3b8; }
.hp-rsb-ready-box {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .6rem;
  margin-bottom: .75rem;
  background: var(--bg);
}
.hp-rsb-ready-box.is-ok { border-color: #86efac; }
.hp-rsb-ready-box.is-mid { border-color: #fcd34d; }
.hp-rsb-ready-box.is-warm { border-color: #fdba74; }
.hp-rsb-ready-box.is-hot { border-color: #fca5a5; }
.hp-rsb-ready {
  margin: 0;
  font-weight: 750;
  font-size: 1rem;
  line-height: 1.3;
}
.hp-rsb-countdown {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .55rem;
  margin-bottom: .65rem;
  background: var(--bg);
  display: grid;
  gap: .1rem;
}
.hp-rsb-bars { display: grid; gap: .35rem; margin-bottom: .75rem; }
.hp-rsb-bar-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(70px, 42%);
  gap: .35rem .5rem;
  align-items: center;
}
.hp-rsb-bar {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 65%, var(--bg));
  overflow: hidden;
}
.hp-rsb-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand) 70%, #64748b);
  transition: width .18s ease;
}
.hp-rsb-bar.has-mg .hp-rsb-bar-fill { background: #f97316; }
.hp-rsb-money,
.hp-rsb-next {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .6rem;
  margin-bottom: .65rem;
  background: color-mix(in srgb, var(--brand) 6%, var(--bg));
}
.hp-rsb-next-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .95rem;
}
.hp-rsb-warn {
  border: 1px solid #fecaca;
  border-radius: 10px;
  padding: .5rem .6rem;
  margin-bottom: .65rem;
  background: #fef2f2;
}
.hp-rsb-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
  line-height: 1.4;
}
.hp-rsb-mg-sum { margin-bottom: .65rem; }
.hp-rsb-mg-sum-ul {
  margin: 0;
  padding-left: 1.05rem;
  font-size: .84rem;
  line-height: 1.4;
}
.hp-rsb-mg-sum-ul li.is-open { font-weight: 600; }
.hp-rsb-mg-sum-ul li.is-fixed { opacity: .75; }
.hp-rsb-links { margin-bottom: .65rem; }
.hp-rsb-link-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .5rem;
}
.hp-rsb-link-grid a {
  font-size: .8rem;
  font-weight: 650;
  padding: .25rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg);
  text-decoration: none;
  color: inherit;
}
.hp-rsb-link-grid a:hover {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
}
.hp-rsb-draft-box {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .6rem;
  margin-bottom: .65rem;
  background: color-mix(in srgb, var(--brand) 5%, var(--bg));
}
.hp-rsb-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  border-radius: 8px;
  border: 1px solid var(--border);
  padding: .45rem .5rem;
  resize: vertical;
  background: #fafafa;
}
.hp-rsb-nonadvice {
  margin: .5rem 0 0;
  font-size: .78rem;
}
.hp-rsb-faq {
  border-top: 1px solid var(--border, #eef0f3);
  padding-top: .75rem;
}
.hp-rsb-faq details {
  margin: .35rem 0;
  padding: .35rem 0;
}
.hp-rsb-faq summary {
  cursor: pointer;
  font-weight: 650;
}
.hp-rsb-date-q {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .3rem;
}
.hp-rsb-room-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .3rem;
}
.hp-rsb-fc {
  font-weight: 700;
  opacity: .8;
  font-size: .78em;
}
.hp-rsb-row.is-hopp {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, #38bdf8);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 20%, transparent);
}
.hp-rsb-mg-item.is-overdue {
  border-color: #f87171;
  background: color-mix(in srgb, #fee2e2 50%, var(--bg-elev));
}
.hp-rsb-mg-badge.is-od {
  background: #fee2e2;
  border-color: #fca5a5;
  color: #991b1b;
}
.hp-rsb-mg-badge.foto-ja {
  background: #dcfce7;
  border-color: #86efac;
}
.hp-rsb-mg-badge.foto-nei {
  background: #fff7ed;
  border-color: #fdba74;
}
.hp-rsb-hold {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .6rem;
  margin-bottom: .65rem;
  background: color-mix(in srgb, #fef9c3 35%, var(--bg));
}
.hp-rsb-hold-line {
  margin: 0;
  font-weight: 750;
  font-size: .95rem;
}
.hp-rsb-hull {
  margin-bottom: .65rem;
}
.hp-rsb-hull-ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .25rem;
}
.hp-rsb-hull-btn {
  display: block;
  width: 100%;
  text-align: left;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg);
  padding: .35rem .5rem;
  font-size: .82rem;
  cursor: pointer;
  line-height: 1.35;
}
.hp-rsb-hull-btn:hover {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg));
}
.hp-rsb-hull-item.is-crit .hp-rsb-hull-btn {
  border-left: 3px solid color-mix(in srgb, var(--brand) 55%, #64748b);
}
.hp-rsb-bar-label {
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
}
.hp-rsb-bar-label:hover {
  text-decoration: underline;
  color: var(--brand, #0f766e);
}
.hp-rsb-mg-sum-ul li.is-od { color: #b91c1c; }
@media (max-width: 560px) {
  .hp-rsb-hero { grid-template-columns: 1fr; }
  .hp-rsb-hero-copy { grid-column: 1; }
  .hp-rsb-panel { position: static; }
  .hp-rsb-status { min-width: 0; width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-rsb-tempfill,
  .hp-rsb-bar-fill,
  .hp-rsb-row { transition: none; }
}

/* —— Tomt-sjekk (build_tomt / build-tomt-sjekk) —— */
.hp-bts { margin-top: .25rem; }
.hp-bts-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-bts-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 14px;
  object-fit: cover;
}
.hp-bts-hero-copy { min-width: 0; }
.hp-bts-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.1rem;
}
.hp-bts-lead-bullets li { margin: .2rem 0; }
.hp-bts-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 10px;
  padding: .55rem .75rem;
  background: var(--surface-2, #f8fafc);
}
.hp-bts-how summary {
  cursor: pointer;
  font-weight: 600;
}
.hp-bts-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
}
.hp-bts-how-list li { margin: .2rem 0; }
.hp-bts-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .1rem .4rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
  vertical-align: middle;
}
.hp-bts-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: 0 0 .5rem;
}
.hp-bts-demos .chip { cursor: pointer; }
.hp-bts-demos .chip:hover,
.hp-bts-demos .chip.active,
.hp-bts-demos .chip[aria-pressed="true"] {
  outline: 2px solid var(--accent, #0d9488);
}
.hp-bts-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-bts-demo-note { margin: 0 0 .65rem; }
.hp-bts-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, .9fr);
  gap: 1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-bts-layout {
    grid-template-columns: 1fr;
  }
  .hp-bts-panel { order: -1; }
  .hp-bts-hero { grid-template-columns: 1fr; }
  .hp-bts-hero-mascot { width: 56px; height: 56px; }
}
.hp-bts-section {
  font-size: 1.05rem;
  margin: 1.1rem 0 .45rem;
}
.hp-bts-section:first-child { margin-top: 0; }
.hp-bts-zone {
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 10px;
  padding: .35rem .65rem .5rem;
  margin: 0 0 .55rem;
  background: var(--surface, #fff);
}
.hp-bts-zone-sum {
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  align-items: baseline;
  font-weight: 600;
  list-style: none;
}
.hp-bts-zone-sum::-webkit-details-marker { display: none; }
.hp-bts-zone-meta { font-weight: 500; white-space: nowrap; }
.hp-bts-cov-list,
.hp-bts-rf-list {
  list-style: none;
  margin: .4rem 0 0;
  padding: 0;
  display: grid;
  gap: .35rem;
}
.hp-bts-cov-row {
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 8px;
  padding: .4rem .55rem;
  background: var(--surface-2, #f8fafc);
}
.hp-bts-cov-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  justify-content: space-between;
  align-items: center;
}
.hp-bts-cov-label { flex: 1 1 12rem; min-width: 0; }
.hp-bts-st-wrap select {
  min-width: 9.5rem;
  max-width: 100%;
}
.hp-bts-rf-item {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid transparent;
}
.hp-bts-rf-item:has(input:checked) {
  background: #fef2f2;
  border-color: #fecaca;
}
.hp-bts-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 12px;
  padding: .85rem;
  background: var(--surface, #fff);
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}
.hp-bts-live {
  margin-bottom: .65rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid var(--border, #e2e8f0);
}
.hp-bts-nonadvice-fixed { color: #64748b; }
.hp-bts-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .55rem 0;
}
.hp-bts-gauges .hp-gauge {
  padding: .4rem .5rem;
  border-radius: 8px;
  background: var(--surface-2, #f8fafc);
  border: 1px solid var(--border, #e2e8f0);
}
.hp-bts-money {
  margin: .5rem 0;
  padding: .5rem .6rem;
  border-radius: 8px;
  background: #f0fdfa;
  border: 1px solid #99f6e4;
}
.hp-bts-readiness {
  margin: .55rem 0;
  padding: .55rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border, #e2e8f0);
  background: #f8fafc;
}
.hp-bts-readiness.is-ok { background: #ecfdf5; border-color: #a7f3d0; }
.hp-bts-readiness.is-check { background: #fffbeb; border-color: #fde68a; }
.hp-bts-readiness.is-missing { background: #fef2f2; border-color: #fecaca; }
.hp-bts-readiness.is-high { box-shadow: inset 3px 0 0 #dc2626; }
.hp-bts-readiness.is-mid { box-shadow: inset 3px 0 0 #d97706; }
.hp-bts-readiness.is-low { box-shadow: inset 3px 0 0 #059669; }
.hp-bts-ready-title {
  margin: 0 0 .2rem;
  font-weight: 700;
}
.hp-bts-bar {
  height: .55rem;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
}
.hp-bts-fill {
  display: block;
  height: 100%;
  background: #94a3b8;
  border-radius: 999px;
  transition: width .2s ease;
}
.hp-bts-fill.is-ok { background: #10b981; }
.hp-bts-fill.is-mid { background: #f59e0b; }
.hp-bts-fill.is-low { background: #ef4444; }
.hp-bts-zone-sum-list,
.hp-bts-alert-list,
.hp-bts-hull-list {
  margin: 0;
  padding-left: 0;
  list-style: none;
}
.hp-bts-zone-sum-list li,
.hp-bts-alert-list li,
.hp-bts-hull-list li { margin: .2rem 0; }
.hp-bts-alert-list { padding-left: 1.1rem; list-style: disc; }
.hp-bts-zone-jump,
.hp-bts-hull-jump {
  display: block;
  width: 100%;
  text-align: left;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 8px;
  background: var(--surface-2, #f8fafc);
  padding: .35rem .5rem;
  font-size: .84rem;
  cursor: pointer;
  color: inherit;
}
.hp-bts-zone-jump:hover,
.hp-bts-hull-jump:hover {
  border-color: var(--accent, #0d9488);
  background: color-mix(in srgb, var(--accent, #0d9488) 8%, #fff);
}
.hp-bts-next {
  margin: .65rem 0;
  padding: .5rem .6rem;
  border-radius: 8px;
  background: var(--surface-2, #f8fafc);
}
.hp-bts-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .8rem;
  line-height: 1.4;
  resize: vertical;
  border-radius: 8px;
  border: 1px solid var(--border, #e2e8f0);
  padding: .5rem .6rem;
  background: #f8fafc;
}
.hp-bts-privacy {
  margin-top: 1rem;
  font-size: .9rem;
}
.hp-bts-faq {
  border-top: 1px solid var(--border, #e2e8f0);
  padding-top: .75rem;
}
.hp-bts-faq details {
  margin: .35rem 0;
}
.hp-bts-faq summary {
  cursor: pointer;
  font-weight: 600;
}
/* Filters + quick actions */
.hp-bts-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: 0 0 .4rem;
}
.hp-bts-filter-bar .chip {
  font-size: .78rem;
  cursor: pointer;
}
.hp-bts-filter-bar .chip.is-on,
.hp-bts-filter-bar .chip[aria-pressed="true"] {
  border-color: var(--accent, #0d9488);
  background: color-mix(in srgb, var(--accent, #0d9488) 12%, #fff);
  font-weight: 650;
}
.hp-bts-filter-n {
  display: inline-block;
  min-width: 1.1em;
  margin-left: .15rem;
  font-variant-numeric: tabular-nums;
  opacity: .85;
}
.hp-bts-quick-actions { margin-bottom: .55rem; }
/* Row status paint */
.hp-bts-cov-row.is-ok {
  border-color: color-mix(in srgb, #10b981 40%, var(--border, #e2e8f0));
  background: color-mix(in srgb, #10b981 7%, #fff);
}
.hp-bts-cov-row.is-warn {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border, #e2e8f0));
  background: color-mix(in srgb, #f59e0b 8%, #fff);
}
.hp-bts-cov-row.is-bad {
  border-color: color-mix(in srgb, #ef4444 45%, var(--border, #e2e8f0));
  background: color-mix(in srgb, #ef4444 8%, #fff);
}
.hp-bts-cov-row.is-open {
  border-style: dashed;
}
.hp-bts-cov-row.is-na { opacity: .62; }
.hp-bts-cov-row.is-flash {
  outline: 2px solid var(--accent, #0d9488);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent, #0d9488) 25%, transparent);
}
/* Status pills */
.hp-bts-counts {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin: .45rem 0 .55rem;
}
.hp-bts-pill {
  display: inline-block;
  font-size: .75rem;
  font-weight: 650;
  padding: .2rem .45rem;
  border-radius: 999px;
  border: 1px solid var(--border, #e2e8f0);
  background: #f8fafc;
}
.hp-bts-pill-ok { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.hp-bts-pill-warn { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.hp-bts-pill-bad { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.hp-bts-pill-open { background: #f1f5f9; border-color: #cbd5e1; color: #334155; }
.hp-bts-pill-rf { background: #fff1f2; border-color: #fecdd3; color: #9f1239; }
.hp-bts-hull {
  margin: .55rem 0;
  padding: .5rem .55rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, #f59e0b 40%, var(--border, #e2e8f0));
  background: color-mix(in srgb, #f59e0b 6%, #fff);
}
@media (prefers-reduced-motion: reduce) {
  .hp-bts-fill { transition: none; }
  .hp-bts-cov-row.is-flash { box-shadow: none; }
}

/* —— Reguleringsplan-intro (build-reguleringsplan · build_regplan) —— */
.hp-brp { margin-top: .25rem; }
.hp-brp-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-brp-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-brp-hero-copy { min-width: 0; }
.hp-brp-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  color: var(--muted, #5b6470);
}
.hp-brp-lead-bullets li { margin: .2rem 0; }
.hp-brp-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-brp-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-brp-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-brp-how-list li { margin: .2rem 0; }
.hp-brp-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 18%, var(--bg-elev, #fff));
  color: #92400e;
}
.hp-brp-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  margin: 0 0 .45rem;
}
.hp-brp-demos .chip {
  font-size: .82rem;
  cursor: pointer;
}
.hp-brp-demos .chip:hover,
.hp-brp-demos .chip.active,
.hp-brp-demos .chip[aria-pressed="true"] {
  border-color: var(--brand, #0f766e);
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, var(--bg-elev, #fff));
}
.hp-brp-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-brp-demo-note { margin: 0 0 .65rem; }
.hp-brp-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .9fr);
  gap: 1rem 1.25rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-brp-layout {
    grid-template-columns: 1fr;
  }
  .hp-brp-panel { order: -1; }
  .hp-brp-hero { grid-template-columns: 1fr; }
  .hp-brp-hero-mascot { width: 56px; height: 56px; }
}
.hp-brp-section {
  margin: 1.1rem 0 .5rem;
  font-size: 1.05rem;
  font-weight: 700;
}
.hp-brp-section:first-child { margin-top: 0; }
.hp-brp-rf-list,
.hp-brp-cov-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .35rem;
}
.hp-brp-rf-item {
  display: flex;
  align-items: flex-start;
  gap: .45rem;
  padding: .45rem .55rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-elev, #fff);
  cursor: pointer;
  font-size: .9rem;
}
.hp-brp-rf-item:has(input:checked) {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 8%, var(--bg-elev, #fff));
}
.hp-brp-cov-row {
  padding: .4rem .5rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-elev, #fff);
  transition: box-shadow .2s ease, border-color .15s ease, background .15s ease;
}
.hp-brp-cov-row.is-ok {
  border-color: color-mix(in srgb, #16a34a 35%, var(--border));
  background: color-mix(in srgb, #16a34a 5%, var(--bg-elev, #fff));
}
.hp-brp-cov-row.is-warn {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 6%, var(--bg-elev, #fff));
}
.hp-brp-cov-row.is-bad {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 7%, var(--bg-elev, #fff));
}
.hp-brp-cov-row.is-open {
  border-style: dashed;
}
.hp-brp-cov-row.is-na {
  opacity: .72;
}
.hp-brp-cov-row.is-flash {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand, #0f766e) 45%, transparent);
  border-color: var(--brand, #0f766e);
}
.hp-brp-cov-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .4rem .65rem;
}
.hp-brp-cov-label { flex: 1; min-width: 12rem; }
.hp-brp-st {
  min-width: 8.5rem;
  font-size: .86rem;
}
.hp-brp-filter-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .4rem;
  margin: 0 0 .35rem;
}
.hp-brp-filter-bar .chip {
  font-size: .8rem;
  cursor: pointer;
}
.hp-brp-filter-bar .chip.is-on,
.hp-brp-filter-bar .chip[aria-pressed="true"] {
  border-color: var(--brand, #0f766e);
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, var(--bg-elev, #fff));
  font-weight: 650;
}
.hp-brp-filter-n {
  display: inline-block;
  min-width: 1.1em;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  margin-left: .15rem;
}
.hp-brp-quick-actions {
  margin: .15rem 0 .55rem;
}
.hp-brp-counts {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin: .45rem 0 .35rem;
}
.hp-brp-pill {
  display: inline-block;
  font-size: .72rem;
  font-weight: 650;
  padding: .15rem .45rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-brp-pill-ok { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.hp-brp-pill-warn { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.hp-brp-pill-bad { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.hp-brp-pill-open { background: #f1f5f9; border-color: #cbd5e1; color: #334155; }
.hp-brp-pill-rf { background: #fff1f2; border-color: #fecdd3; color: #9f1239; }
.hp-brp-hull {
  margin-top: .65rem;
  padding-top: .45rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-brp-hull-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.hp-brp-hull-list li { margin: .2rem 0; }
.hp-brp-hull-jump {
  display: block;
  width: 100%;
  text-align: left;
  font-size: .82rem;
  padding: .3rem .45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
  color: inherit;
}
.hp-brp-hull-jump:hover {
  border-color: var(--brand, #0f766e);
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, var(--bg-elev, #fff));
}
.hp-brp-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem 1rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 4%);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-brp-empty { margin: 0; }
.hp-brp-live {
  margin-bottom: .65rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-brp-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .78rem;
}
.hp-brp-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .55rem 0 .65rem;
}
.hp-brp-gauges .hp-gauge {
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  background: var(--bg-elev, #fff);
  display: grid;
  gap: .15rem;
}
.hp-brp-gauges .hp-gauge strong {
  font-size: .92rem;
  font-weight: 700;
}
.hp-brp-readiness {
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: .5rem 0;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-brp-readiness.is-ok {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 10%, var(--bg-elev, #fff));
}
.hp-brp-readiness.is-check {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev, #fff));
}
.hp-brp-readiness.is-missing,
.hp-brp-readiness.is-low {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 10%, var(--bg-elev, #fff));
}
.hp-brp-readiness.is-mid {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev, #fff));
}
.hp-brp-readiness.is-high:not(.is-missing) {
  border-color: color-mix(in srgb, #16a34a 35%, var(--border));
}
.hp-brp-ready-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-brp-bar {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-brp-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: var(--brand, #0f766e);
  transition: width .2s ease;
}
.hp-brp-fill.is-ok { background: #16a34a; }
.hp-brp-fill.is-mid { background: #d97706; }
.hp-brp-fill.is-low { background: #dc2626; }
.hp-brp-keys,
.hp-brp-alerts,
.hp-brp-next {
  margin-top: .65rem;
  padding-top: .45rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-brp-key-list,
.hp-brp-alert-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-brp-key-list li,
.hp-brp-alert-list li { margin: .15rem 0; }
.hp-brp-commit { margin-top: .65rem; }
.hp-brp-commit-text {
  width: 100%;
  font-size: .8rem;
  line-height: 1.35;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  resize: vertical;
  min-height: 6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  padding: .45rem .55rem;
  background: var(--bg-elev, #fff);
}
.hp-brp-privacy {
  margin-top: 1rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .65rem;
}
.hp-brp-privacy summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
}
.hp-brp-faq {
  border-top: 1px solid var(--border, #eef0f3);
  padding-top: .75rem;
}
.hp-brp-faq details {
  margin: .35rem 0;
  padding: .35rem 0;
}
.hp-brp-faq summary {
  cursor: pointer;
  font-weight: 650;
}
@media (max-width: 560px) {
  .hp-brp-st { min-width: 0; width: 100%; }
  .hp-brp-panel { position: static; }
  .hp-brp-gauges { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-brp-fill { transition: none; }
  .hp-brp-cov-row { transition: none; }
  .hp-brp-cov-row.is-flash { box-shadow: none; }
}

/* —— Byggetidslinje (build_timeline / build-tidslinje-bygg) —— */
.hp-btl { display: grid; gap: 1rem; }
/* Byggestart-port */
.hp-btl-gate {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
  display: grid;
  gap: .2rem;
  background: var(--card, #fff);
}
.hp-btl-gate strong {
  font-size: 1.15rem;
  font-weight: 800;
}
.hp-btl-gate.is-open {
  border-color: #86efac;
  background: #f0fdf4;
}
.hp-btl-gate.is-open strong { color: #15803d; }
.hp-btl-gate.is-sjekk {
  border-color: #fcd34d;
  background: #fffbeb;
}
.hp-btl-gate.is-sjekk strong { color: #b45309; }
.hp-btl-gate.is-stopp {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-btl-gate.is-stopp strong { color: #b91c1c; }
.hp-btl-gate-ul {
  margin: .25rem 0 0;
  padding-left: 0;
  list-style: none;
  display: grid;
  gap: .2rem;
}
/* Kost-skinne */
.hp-btl-cost {
  border: 1px solid #c7d2fe;
  background: #eef2ff;
  border-radius: 12px;
  padding: .5rem .7rem;
  margin-bottom: .75rem;
  display: grid;
  gap: .1rem;
}
.hp-btl-cost-line {
  margin: 0;
  font-weight: 700;
  font-size: .92rem;
  font-variant-numeric: tabular-nums;
}
/* Mini-Gantt */
.hp-btl-gantt {
  margin: 0 0 .85rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .65rem;
  background: var(--bg-elev);
}
.hp-btl-gantt-cap { margin: 0 0 .4rem; }
.hp-btl-gantt-track {
  position: relative;
  height: 9.2rem;
  border-radius: 8px;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--border) 55%, transparent) 1px, transparent 1px);
  background-size: 12.5% 100%;
  border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-btl-gantt-bar {
  position: absolute;
  height: 1.25rem;
  border: 0;
  border-radius: 7px;
  padding: .15rem .3rem;
  font: inherit;
  color: #0f172a;
  background: color-mix(in srgb, var(--brand) 28%, #e2e8f0);
  cursor: pointer;
  text-align: left;
  overflow: hidden;
  display: flex;
  align-items: center;
  min-width: 1.5rem;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brand) 25%, transparent);
}
.hp-btl-gantt-bar:nth-child(1) { top: .3rem; }
.hp-btl-gantt-bar:nth-child(2) { top: 1.55rem; }
.hp-btl-gantt-bar:nth-child(3) { top: 2.8rem; }
.hp-btl-gantt-bar:nth-child(4) { top: 4.05rem; }
.hp-btl-gantt-bar:nth-child(5) { top: 5.3rem; }
.hp-btl-gantt-bar:nth-child(6) { top: 6.55rem; }
.hp-btl-gantt-bar:nth-child(7) { top: 7.8rem; }
.hp-btl-gantt-bar.is-done {
  background: color-mix(in srgb, #16a34a 35%, #ecfdf5);
  box-shadow: inset 0 0 0 1px #86efac;
}
.hp-btl-gantt-bar.is-gap {
  background: color-mix(in srgb, #ea580c 28%, #fff7ed);
  box-shadow: inset 0 0 0 1px #fdba74;
}
.hp-btl-gantt-bar.is-part {
  background: color-mix(in srgb, #2563eb 28%, #eff6ff);
  box-shadow: inset 0 0 0 1px #93c5fd;
}
.hp-btl-gantt-bar.is-overlap {
  outline: 2px solid #dc2626;
  outline-offset: -1px;
  z-index: 2;
}
.hp-btl-gantt-bar:hover {
  filter: brightness(0.97);
  z-index: 3;
}
.hp-btl-gantt-lab {
  font-size: .62rem;
  font-weight: 750;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.hp-btl-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
}
.hp-btl-hero-mascot {
  border-radius: 14px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
.hp-btl-hero-copy { min-width: 0; grid-column: 2; }
.hp-btl-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.1rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-btl-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .75rem;
  background: var(--bg-elev);
}
.hp-btl-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-btl-how-list {
  margin: .4rem 0 .15rem;
  padding-left: 1.15rem;
  font-size: .86rem;
  line-height: 1.45;
}
.hp-btl-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .5rem;
  align-items: center;
}
.hp-btl-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #e0e7ff;
  color: #3730a3;
  vertical-align: middle;
}
.hp-btl-demo-note {
  margin: .15rem 0 0;
  padding: .4rem .6rem;
  border-radius: 8px;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
}
.hp-btl-layout {
  display: grid;
  grid-template-columns: 1fr minmax(240px, 320px);
  gap: 1rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-btl-layout { grid-template-columns: 1fr; }
  .hp-btl-panel { position: static; }
}
.hp-btl-section {
  font-size: 1.02rem;
  margin: 1rem 0 .55rem;
  font-weight: 700;
}
.hp-btl-section:first-child { margin-top: 0; }
.hp-btl-quick-dates {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .45rem;
  align-items: center;
  margin: .15rem 0 .35rem;
}
.hp-btl-filter {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .45rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-btl-filter .chip.is-on,
.hp-btl-filter [aria-pressed="true"] {
  background: color-mix(in srgb, var(--brand) 18%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  font-weight: 700;
}
.hp-btl-filter-n {
  display: inline-block;
  min-width: 1.1rem;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
  font-size: .78rem;
  opacity: .85;
}
.hp-btl-entbox {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .75rem;
  margin: 0 0 .85rem;
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev));
}
.hp-btl-ent-line {
  margin: 0;
  font-size: .9rem;
  line-height: 1.4;
  font-weight: 600;
}
.hp-btl-row.is-flash {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand) 55%, transparent);
  border-color: var(--brand);
}
.hp-btl-phase-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: .35rem 0 .75rem;
}
.hp-btl-tab {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}
.hp-btl-tab.is-on,
.hp-btl-tab[aria-selected="true"] {
  background: color-mix(in srgb, var(--brand) 18%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  font-weight: 700;
}
.hp-btl-tab-pct {
  font-size: .72rem;
  font-variant-numeric: tabular-nums;
  opacity: .8;
  font-weight: 700;
}
.hp-btl-phase-head {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1rem;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: .55rem;
}
.hp-btl-phase-help { margin: 0; flex: 1 1 12rem; }
.hp-btl-phase-date-lab {
  display: grid;
  gap: .2rem;
  font-size: .86rem;
}
.hp-btl-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .55rem;
}
.hp-btl-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  background: var(--card, #fff);
  transition: border-color .15s, background .15s, box-shadow .15s;
}
.hp-btl-row.is-critical { border-left: 3px solid #d97706; }
.hp-btl-row.is-gap {
  border-color: #fca5a5;
  background: #fff7f7;
}
.hp-btl-row.is-ok {
  border-color: #86efac;
  background: #f7fdf9;
}
.hp-btl-row-top {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .75rem;
  align-items: flex-start;
}
.hp-btl-on {
  display: flex;
  gap: .5rem;
  align-items: flex-start;
  flex: 1 1 12rem;
  min-width: 0;
  cursor: pointer;
}
.hp-btl-on input { margin-top: .2rem; flex: 0 0 auto; }
.hp-btl-label {
  font-size: .92rem;
  font-weight: 600;
  line-height: 1.35;
  min-width: 0;
}
.hp-btl-crit-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .08rem .32rem;
  border-radius: 5px;
  background: #ffedd5;
  color: #9a3412;
  margin-right: .3rem;
  vertical-align: middle;
}
.hp-btl-note {
  width: 100%;
  margin-top: .4rem;
  font-size: .86rem;
  min-height: 36px;
}
.hp-btl-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .95rem;
  background: var(--surface-2, rgba(0,0,0,.02));
}
.hp-btl-gauges {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .55rem;
  margin-bottom: .5rem;
}
.hp-btl-gauge {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .5rem .6rem;
  background: var(--card, #fff);
  display: grid;
  gap: .15rem;
}
.hp-btl-gauge-gaps strong { color: #b45309; }
.hp-btl-gauge strong {
  font-size: 1.25rem;
  font-variant-numeric: tabular-nums;
}
.hp-btl-temp-wrap {
  margin: 0 0 .65rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  display: grid;
  gap: .15rem;
}
.hp-btl-temp-wrap.is-klar {
  background: #ecfdf5;
  border-color: #a7f3d0;
}
.hp-btl-temp-wrap.is-sjekk {
  background: #fffbeb;
  border-color: #fde68a;
}
.hp-btl-temp-wrap.is-hull {
  background: #fef2f2;
  border-color: #fecaca;
}
.hp-btl-temp-wrap > strong {
  font-size: 1.15rem;
  font-weight: 800;
}
.hp-btl-temp-wrap > strong.is-klar { color: #065f46; }
.hp-btl-temp-wrap > strong.is-sjekk { color: #92400e; }
.hp-btl-temp-wrap > strong.is-hull { color: #991b1b; }
.hp-btl-temp {
  font-weight: 650;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font-size: .88rem;
}
.hp-btl-temp.is-klar { color: #065f46; }
.hp-btl-temp.is-sjekk { color: #92400e; }
.hp-btl-temp.is-hull { color: #991b1b; }
.hp-btl-formula {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .65rem;
  margin: 0 0 .75rem;
  background: var(--bg-elev);
}
.hp-btl-formula summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .88rem;
}
.hp-btl-gaps-list {
  border: 1px solid #fed7aa;
  background: #fff7ed;
  border-radius: 12px;
  padding: .5rem .7rem;
  margin: 0 0 .75rem;
}
.hp-btl-gaps-ul {
  margin: 0;
  padding-left: 0;
  list-style: none;
  display: grid;
  gap: .25rem;
}
.hp-btl-gap-btn {
  border: 0;
  background: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: left;
  font-size: .86rem;
  line-height: 1.35;
}
.hp-btl-gap-btn:hover {
  color: var(--brand);
  text-decoration: underline;
}
.hp-btl-seeds {
  margin: .75rem 0;
  padding: .55rem .7rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--brand) 5%, var(--card, #fff));
}
.hp-btl-phase-meta {
  display: grid;
  gap: .35rem;
  justify-items: end;
}
.hp-btl-phase-weeks {
  font-size: .78rem;
  font-variant-numeric: tabular-nums;
  max-width: 12rem;
  text-align: right;
}
.hp-btl-pace-hint {
  font-size: .82rem !important;
  line-height: 1.35;
}
.hp-btl-rail { margin: 0 0 .85rem; }
.hp-btl-rail-cap { margin: 0 0 .4rem; }
.hp-btl-rail-track {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
}
.hp-btl-rail-node {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .1rem;
  max-width: 7.2rem;
  flex: 1 1 5.5rem;
  padding: .4rem .45rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--card, #fff);
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
}
.hp-btl-rail-node:hover {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
}
.hp-btl-rail-dot {
  width: .55rem;
  height: .55rem;
  border-radius: 50%;
  background: #94a3b8;
  margin-bottom: .15rem;
}
.hp-btl-rail-node.is-done .hp-btl-rail-dot { background: #16a34a; }
.hp-btl-rail-node.is-gap .hp-btl-rail-dot { background: #ea580c; }
.hp-btl-rail-node.is-part .hp-btl-rail-dot { background: #2563eb; }
.hp-btl-rail-lab {
  font-size: .72rem;
  font-weight: 700;
  line-height: 1.2;
}
.hp-btl-rail-dt {
  font-size: .68rem;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.hp-btl-rail-pct { display: none; }
.hp-btl-bars { display: grid; gap: .4rem; margin-bottom: .85rem; }
.hp-btl-bar-row {
  display: grid;
  grid-template-columns: 8.5rem 1fr;
  gap: .45rem;
  align-items: center;
}
.hp-btl-bar-lab {
  text-align: left;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.hp-btl-bar-lab:hover { color: var(--brand); }
.hp-btl-bar {
  height: 8px;
  border-radius: 99px;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  overflow: hidden;
}
.hp-btl-bar-fill {
  display: block;
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--brand), color-mix(in srgb, var(--brand) 55%, #3aa6a0));
  border-radius: 99px;
  transition: width .2s ease;
}
.hp-btl-next {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
  background: color-mix(in srgb, var(--brand) 6%, var(--card, #fff));
}
.hp-btl-next-btn {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.hp-btl-next-btn:hover .hp-btl-next-title {
  color: var(--brand);
  text-decoration: underline;
}
.hp-btl-next-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-btl-sched-btn {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  padding: .1rem 0;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.hp-btl-sched-btn:hover {
  color: var(--brand);
}
.hp-btl-warn {
  border: 1px solid #fca5a5;
  background: #fff7f7;
  border-radius: 12px;
  padding: .55rem .7rem;
  margin-bottom: .75rem;
}
.hp-btl-warn-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-btl-schedule { margin-bottom: .75rem; }
.hp-btl-schedule-ol {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  line-height: 1.45;
}
.hp-btl-commit-text {
  width: 100%;
  font-size: .82rem;
  line-height: 1.4;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  min-height: 10rem;
}
.hp-btl-nonadvice {
  margin-top: .65rem;
  font-size: .78rem !important;
}
.hp-btl-faq details {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .7rem;
  margin: .4rem 0;
  background: var(--bg-elev);
}
.hp-btl-faq summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-btl-faq details p { margin: .35rem 0 .15rem; }
.hp-btl-links { margin: .85rem 0; }
.hp-btl-link-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .5rem;
}
.hp-btl-link-grid a {
  font-size: .8rem;
  font-weight: 650;
  padding: .25rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  text-decoration: none;
  color: inherit;
}
.hp-btl-link-grid a:hover {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
@media (max-width: 560px) {
  .hp-btl-hero {
    grid-template-columns: 1fr;
  }
  .hp-btl-hero-mascot { width: 56px; height: 56px; }
  .hp-btl-hero-copy { grid-column: 1; }
  .hp-btl-gauges { grid-template-columns: 1fr; }
  .hp-btl-bar-row { grid-template-columns: 1fr; gap: .2rem; }
  .hp-btl-rail-node { max-width: none; flex: 1 1 45%; }
}
@media (min-width: 901px) {
  .hp-btl-hero {
    grid-template-columns: 72px 1fr;
  }
  .hp-btl-gauges { grid-template-columns: repeat(2, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .hp-btl-bar-fill { transition: none; }
  .hp-btl-row { transition: none; }
  .hp-btl-row.is-flash { transition: none; }
}

/* —— Byggelån-oversikt (build-laan-bygge · build_loan) —— */
.hp-bl { margin-top: .25rem; }
.hp-bl-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-bl-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-bl-hero-copy { min-width: 0; }
.hp-bl-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  color: var(--muted, #5b6470);
}
.hp-bl-lead-bullets li { margin: .2rem 0; }
.hp-bl-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-bl-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-bl-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-bl-how-list li { margin: .2rem 0; }
.hp-bl-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  color: var(--brand);
  vertical-align: middle;
}
.hp-bl-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .45rem;
  margin: 0 0 .65rem;
}
.hp-bl-demos .chip {
  font-size: .82rem;
  padding: .28rem .65rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-bl-demos .chip:hover,
.hp-bl-demos .chip.active,
.hp-bl-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-bl-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-bl-demo-note { margin: 0 0 .65rem; }
.hp-bl-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.95fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 820px) {
  .hp-bl-layout {
    grid-template-columns: 1fr;
    display: flex;
    flex-direction: column;
  }
  .hp-bl-panel { order: -1; }
  .hp-bl-hero { grid-template-columns: 1fr; }
  .hp-bl-hero-mascot { width: 56px; height: 56px; }
}
.hp-bl-section {
  margin: 1rem 0 .45rem;
  font-size: .95rem;
  letter-spacing: -0.01em;
}
.hp-bl-section:first-child { margin-top: 0; }
.hp-bl-packs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .4rem;
  margin: 0 0 .55rem;
}
.hp-bl-packs .chip {
  font-size: .78rem;
  padding: .2rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-bl-packs .chip:hover,
.hp-bl-packs .chip.active {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  font-weight: 650;
}
.hp-bl-draws {
  display: flex;
  flex-direction: column;
  gap: .55rem;
}
.hp-bl-draw {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem .65rem;
  background: var(--bg-elev, #fff);
  transition: border-color .15s ease, background .15s ease;
}
.hp-bl-draw.is-trukket {
  border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-bl-draw.is-klar {
  border-color: color-mix(in srgb, #c45c26 40%, var(--border));
  background: color-mix(in srgb, #c45c26 6%, var(--bg-elev, #fff));
}
.hp-bl-draw-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .5rem;
  margin-bottom: .4rem;
}
.hp-bl-draw-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 700;
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
  color: var(--brand);
  flex-shrink: 0;
}
.hp-bl-draw-label-wrap {
  flex: 1 1 10rem;
  min-width: 0;
  margin: 0;
}
.hp-bl-draw-label-wrap input {
  width: 100%;
  font-weight: 650;
  font-size: .9rem;
}
.hp-bl-draw-fields {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .45rem .55rem;
}
@media (max-width: 640px) {
  .hp-bl-draw-fields { grid-template-columns: 1fr 1fr; }
}
.hp-bl-st {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  padding: .12rem .4rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  letter-spacing: .01em;
}
.hp-bl-st-plan {
  background: color-mix(in srgb, var(--muted, #888) 12%, var(--bg-elev));
}
.hp-bl-st-klar {
  background: color-mix(in srgb, #c45c26 14%, var(--bg-elev));
  border-color: color-mix(in srgb, #c45c26 40%, var(--border));
  color: #8a3a12;
}
.hp-bl-st-trukket {
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
}
.hp-bl-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem 1rem;
  background: var(--bg-elev, #fff);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-bl-live {
  text-align: center;
  margin-bottom: .65rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-bl-live .hp-bid-num {
  font-size: 1.65rem;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.hp-bl-nonadvice-fixed {
  margin: .35rem 0 0;
  font-size: .75rem !important;
  opacity: .9;
}
.hp-bl-status.is-ok { color: color-mix(in srgb, var(--brand) 70%, #0a0); }
.hp-bl-status.is-tight { color: #9a5b12; }
.hp-bl-status.is-gap { color: #b42318; font-weight: 650; }
.hp-bl-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem .55rem;
  margin: .55rem 0 .7rem;
}
.hp-bl-gauges .hp-gauge {
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  border-radius: 10px;
  padding: .35rem .45rem;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.hp-bl-gauges .hp-gauge strong {
  font-variant-numeric: tabular-nums;
  font-size: .92rem;
}
.hp-bl-bar-wrap { margin: .2rem 0 .35rem; }
.hp-bl-bar {
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--muted, #888) 16%, var(--bg));
  overflow: hidden;
}
.hp-bl-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: var(--brand);
  transition: width .2s ease;
}
.hp-bl-fill.is-tight { background: #c45c26; }
.hp-bl-fill.is-over { background: #b42318; }
.hp-bl-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .84rem;
  margin-top: .25rem;
}
.hp-bl-table th,
.hp-bl-table td {
  text-align: left;
  padding: .28rem .2rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 75%, transparent);
  font-variant-numeric: tabular-nums;
}
.hp-bl-table th {
  font-weight: 550;
  color: var(--muted, #5b6470);
  width: 55%;
}
.hp-bl-interest,
.hp-bl-convert,
.hp-bl-cap,
.hp-bl-breakdown,
.hp-bl-tips {
  margin-top: .7rem;
}
.hp-bl-draw-sum {
  list-style: none;
  margin: 0;
  padding: 0;
}
.hp-bl-draw-sum li {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  padding: .22rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
  font-size: .84rem;
}
.hp-bl-draw-sum li strong {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.hp-bl-tip-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  color: var(--muted, #5b6470);
}
.hp-bl-tip-list li { margin: .25rem 0; }
.hp-bl-inline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem .35rem;
  margin-top: .35rem;
}
.hp-bl-inline-actions .chip,
.hp-bl-rate-ladder .chip {
  font-size: .76rem;
  padding: .18rem .5rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-bl-inline-actions .chip:hover,
.hp-bl-rate-ladder .chip:hover,
.hp-bl-inline-actions .chip.active,
.hp-bl-rate-ladder .chip.active,
.hp-bl-rate-ladder .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  font-weight: 650;
}
.hp-bl-inline-actions .chip-ghost { opacity: .8; font-weight: 500; }
.hp-bl-rate-ladder {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem .35rem;
  margin-top: .35rem;
}
.hp-bl-rate-base-hint { margin: .25rem 0 0; }
.hp-bl-formula {
  margin: .55rem 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-bl-formula-line {
  margin: 0;
  font-size: .82rem;
  font-variant-numeric: tabular-nums;
  line-height: 1.4;
  word-break: break-word;
}
.hp-bl-timeline { margin-top: .7rem; }
.hp-bl-skinne { margin: .15rem 0; }
.hp-bl-skinne-track {
  position: relative;
  height: 2.6rem;
  margin: .35rem .35rem .15rem;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--muted, #888) 18%, var(--bg)) 0%,
    color-mix(in srgb, var(--brand) 14%, var(--bg)) 100%
  );
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-bl-skinne-mark {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .1rem;
  max-width: 4.5rem;
  pointer-events: none;
}
.hp-bl-skinne-dot {
  width: .7rem;
  height: .7rem;
  border-radius: 999px;
  background: var(--brand);
  border: 2px solid var(--bg-elev, #fff);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand) 40%, transparent);
}
.hp-bl-skinne-klar .hp-bl-skinne-dot {
  background: #c45c26;
  box-shadow: 0 0 0 1px color-mix(in srgb, #c45c26 45%, transparent);
}
.hp-bl-skinne-plan .hp-bl-skinne-dot {
  background: color-mix(in srgb, var(--muted, #888) 70%, #fff);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--muted, #888) 40%, transparent);
}
.hp-bl-skinne-lab {
  font-size: .62rem;
  font-weight: 650;
  line-height: 1.1;
  color: var(--muted, #5b6470);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 4.2rem;
}
.hp-bl-skinne-end {
  position: absolute;
  right: .15rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.15rem;
  height: 1.15rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: .65rem;
  font-weight: 800;
  background: var(--bg-elev, #fff);
  border: 1.5px solid var(--brand);
  color: var(--brand);
}
.hp-bl-shock-table thead th {
  font-size: .75rem;
  font-weight: 650;
  color: var(--muted, #5b6470);
  padding-bottom: .2rem;
}
.hp-bl-shock-row {
  cursor: pointer;
}
.hp-bl-shock-row:hover td {
  background: color-mix(in srgb, var(--brand) 8%, transparent);
}
.hp-bl-shock-row.is-current td {
  background: color-mix(in srgb, var(--brand) 12%, transparent);
  font-weight: 650;
}
.hp-bl-shock-row:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 1px;
}
.hp-bl-st[role="button"]:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
}
.hp-bl-faq,
.hp-bl-privacy {
  margin-top: .85rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
}
.hp-bl-faq > summary,
.hp-bl-privacy > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-bl-faq details {
  margin: .4rem 0 0;
  padding: .25rem 0 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-bl-faq details summary {
  cursor: pointer;
  font-weight: 550;
  font-size: .88rem;
}
.hp-bl-faq details p { margin: .35rem 0 .15rem; }
.hp-bl-scenarios {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .4rem;
  margin: 0 0 .65rem;
}
.hp-bl-scenarios .chip {
  font-size: .78rem;
  padding: .2rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-bl-scenarios .chip:hover {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  font-weight: 650;
}
.hp-bl-scenarios .chip-ghost { opacity: .8; font-weight: 500; }
.hp-bl-prep {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .3rem .65rem;
}
@media (max-width: 640px) {
  .hp-bl-prep { grid-template-columns: 1fr; }
}
.hp-bl-prep-item { margin: 0; }
.hp-bl-prep-lab {
  display: flex;
  align-items: flex-start;
  gap: .4rem;
  font-size: .84rem;
  cursor: pointer;
  line-height: 1.3;
}
.hp-bl-prep-lab input { margin-top: .15rem; flex-shrink: 0; }
.hp-bl-upsell {
  margin: .45rem 0 0;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev, #fff));
}
.hp-bl-stack { margin: .55rem 0 .7rem; }
.hp-bl-stack-bar {
  display: flex;
  height: 14px;
  border-radius: 999px;
  overflow: hidden;
  background: color-mix(in srgb, var(--border) 70%, transparent);
  border: 1px solid var(--border);
}
.hp-bl-seg { display: block; min-width: 0; height: 100%; transition: width .2s ease; }
.hp-bl-seg-ek { background: color-mix(in srgb, var(--brand) 75%, #0a6); }
.hp-bl-seg-loan { background: var(--brand); }
.hp-bl-seg-gap { background: #b42318; }
.hp-bl-seg-spare {
  background: repeating-linear-gradient(
    -45deg,
    color-mix(in srgb, var(--border) 85%, transparent),
    color-mix(in srgb, var(--border) 85%, transparent) 3px,
    transparent 3px,
    transparent 6px
  );
}
.hp-bl-stack-legend {
  list-style: none;
  margin: .4rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .25rem .75rem;
  font-size: .78rem;
  color: var(--muted, #5b6470);
}
.hp-bl-stack-legend li {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
}
.hp-bl-stack-legend span {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  color: var(--text, #1a1a1a);
}
.hp-bl-swatch {
  display: inline-block;
  width: .65rem;
  height: .65rem;
  border-radius: 3px;
  flex-shrink: 0;
}
.hp-bl-cumul { margin-top: .7rem; }
.hp-bl-cumul-track {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: 4.2rem;
  padding: .2rem 0 0;
}
.hp-bl-cumul-col {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  height: 100%;
  gap: .12rem;
}
.hp-bl-cumul-bar {
  width: 100%;
  max-width: 1.1rem;
  border-radius: 3px 3px 0 0;
  background: color-mix(in srgb, var(--brand) 70%, var(--muted, #888));
  min-height: 3px;
}
.hp-bl-cumul-col.is-now .hp-bl-cumul-bar {
  background: var(--brand);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand) 40%, transparent);
}
.hp-bl-cumul-lab {
  font-size: .58rem;
  font-weight: 650;
  color: var(--muted, #5b6470);
  line-height: 1;
}
.hp-bl-cumul-col.is-now .hp-bl-cumul-lab {
  color: var(--brand);
  font-weight: 800;
}
@media (max-width: 560px) {
  .hp-bl-gauges { grid-template-columns: 1fr; }
  .hp-bl-skinne-lab { display: none; }
  .hp-bl-cumul-lab { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-bl-fill,
  .hp-bl-seg { transition: none; }
}
.hp-bl-skinne-now {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .05rem;
  z-index: 2;
  pointer-events: none;
}
.hp-bl-skinne-now-dot {
  width: .55rem;
  height: .55rem;
  border-radius: 999px;
  background: #fff;
  border: 2px solid var(--brand);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand) 35%, transparent);
}
.hp-bl-skinne-now-lab {
  font-size: .58rem;
  font-weight: 800;
  color: var(--brand);
  letter-spacing: .02em;
  text-transform: uppercase;
}
.hp-bl-delay-card {
  margin: .55rem 0 .35rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #c45c26 45%, var(--border));
  background: color-mix(in srgb, #c45c26 7%, var(--bg-elev, #fff));
}
.hp-bl-delay-line {
  margin: 0;
  font-size: .84rem;
  font-variant-numeric: tabular-nums;
  font-weight: 650;
  line-height: 1.35;
}
.hp-bl-draft-hint {
  margin: .4rem 0 0;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  background: color-mix(in srgb, var(--muted, #888) 8%, var(--bg-elev, #fff));
}
.hp-bl-sticky {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  gap: .45rem .65rem;
  align-items: center;
  justify-content: space-between;
  padding: .55rem .85rem calc(.55rem + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--brand) 8%);
  box-shadow: 0 -4px 18px color-mix(in srgb, #000 10%, transparent);
  backdrop-filter: blur(8px);
}
.hp-bl-sticky-main {
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  font-size: .92rem;
  letter-spacing: -0.01em;
}
@media (max-width: 820px) {
  .hp-bl-sticky:not([hidden]) {
    display: flex;
    flex-wrap: wrap;
  }
  .hp-bl-sticky .muted { flex: 1 1 8rem; min-width: 0; }
  body:has([data-bl-sticky]:not([hidden])) {
    padding-bottom: 4.5rem;
  }
}

/* —— Energi nybygg (build_energi / build-energi-nybygg) —— */
.hp-beng { margin-top: .25rem; position: relative; }
.hp-beng-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-beng-hero-mascot {
  border-radius: 16px;
  grid-row: 1 / span 2;
}
.hp-beng-hero-copy { min-width: 0; grid-column: 2; }
.hp-beng-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-beng-lead-bullets li { margin: .15rem 0; }
.hp-beng-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  padding: .65rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 70%, var(--brand, #0f766e) 6%);
}
.hp-beng-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-beng-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-beng-how-list li { margin: .2rem 0; }
.hp-beng-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: .5rem 0 .75rem;
}
.hp-beng-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: #fef3c7;
  color: #92400e;
  margin-left: .15rem;
}
.hp-beng-demo-note {
  margin: -.35rem 0 .65rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-beng-demos .chip,
.hp-beng-packs .chip,
.hp-beng-filters .chip {
  cursor: pointer;
  font-size: .82rem;
}
.hp-beng-filters .chip-sm {
  font-size: .78rem;
  padding: .2rem .45rem;
}
.hp-beng-demos .chip:hover,
.hp-beng-demos .chip[aria-pressed="true"],
.hp-beng-filters .chip[aria-pressed="true"],
.hp-beng-packs .chip:hover {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
}
.hp-beng-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-beng-packs,
.hp-beng-filters,
.hp-beng-tools-row,
.hp-beng-budget-chips,
.hp-beng-letter-scale {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .35rem 0 .55rem;
}
.hp-beng-tools-row { margin-top: .15rem; }
.hp-beng-budget-chips,
.hp-beng-energy-chips,
.hp-beng-horizon-chips { margin: .35rem 0 0; }
.hp-beng-energy-chips,
.hp-beng-horizon-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  align-items: center;
}
.hp-beng-letter-scale { margin: .4rem 0 0; }
.hp-beng-pack-hint {
  outline: 2px solid color-mix(in srgb, var(--accent, #0d9488) 55%, transparent);
  outline-offset: 1px;
}
.hp-beng-letter-btn[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 55%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, transparent);
  font-weight: 700;
}
.hp-beng-score {
  display: inline-block;
  min-width: 2.4rem;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: .86rem;
  color: color-mix(in srgb, var(--brand, #0f766e) 80%, #111);
}
.hp-beng-overinvest {
  margin: .45rem 0 .55rem;
  padding: .55rem .7rem;
  border-radius: 10px;
  border: 1px solid #fcd34d;
  background: #fffbeb;
  color: #78350f;
  font-size: .86rem;
  line-height: 1.4;
}
.hp-beng-tools-row .chip,
.hp-beng-budget-chips .chip,
.hp-beng-letter-scale .chip {
  cursor: pointer;
  font-size: .78rem;
}
.hp-beng-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .9fr);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
@media (max-width: 920px) {
  .hp-beng-layout { grid-template-columns: 1fr; }
  .hp-beng-hero { grid-template-columns: auto 1fr; }
}
.hp-beng-section {
  margin: 1rem 0 .45rem;
  font-size: 1.05rem;
  font-weight: 750;
}
.hp-beng-main .hp-beng-section:first-child { margin-top: 0; }
.hp-beng-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  margin-bottom: .5rem;
}
.hp-beng-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .84rem;
}
.hp-beng-table th,
.hp-beng-table td {
  padding: .45rem .5rem;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
  text-align: left;
}
.hp-beng-table thead th {
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  background: color-mix(in srgb, var(--bg) 70%, var(--brand, #0f766e) 8%);
  white-space: nowrap;
}
.hp-beng-row.is-on {
  background: color-mix(in srgb, var(--brand, #0f766e) 5%, var(--bg));
}
.hp-beng-row.is-pack td:first-child {
  box-shadow: inset 3px 0 0 #16a34a;
}
.hp-beng-row.is-over {
  background: color-mix(in srgb, #f59e0b 8%, var(--bg));
}
.hp-beng-row.is-over td:first-child {
  box-shadow: inset 3px 0 0 #f59e0b;
}
.hp-beng-name {
  display: block;
  font-weight: 650;
  margin-bottom: .1rem;
}
.hp-beng-hint {
  display: block;
  line-height: 1.3;
  max-width: 22rem;
}
.hp-beng-check { display: inline-flex; align-items: center; }
.hp-beng-cost {
  width: 6.5rem;
  min-width: 5.5rem;
}
.hp-beng-phase-sel {
  max-width: 6.5rem;
  font-size: .82rem;
}
.hp-beng-range-cell {
  white-space: nowrap;
  min-width: 5.5rem;
}
.hp-beng-range {
  width: 4.5rem;
  vertical-align: middle;
}
.hp-beng-range-val {
  display: inline-block;
  min-width: 1.1rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  margin-left: .15rem;
}
.hp-beng-kind {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  padding: .12rem .35rem;
  border-radius: 6px;
  white-space: nowrap;
}
.hp-beng-kind-envelope { background: #d1fae5; color: #065f46; }
.hp-beng-kind-tech { background: #e0e7ff; color: #3730a3; }
.hp-beng-kind-comfort { background: #fce7f3; color: #9d174d; }
.hp-beng-kind-doc { background: #dbeafe; color: #1e40af; }
.hp-beng-kind-later { background: #f3f4f6; color: #374151; }
.hp-beng-kind-core { background: #ecfdf5; color: #047857; }
.hp-beng-dec {
  display: inline-block;
  font-size: .78rem;
  font-weight: 700;
  padding: .15rem .4rem;
  border-radius: 8px;
  white-space: nowrap;
}
.hp-beng-dec.is-do { background: #dcfce7; color: #166534; }
.hp-beng-dec.is-doc { background: #dbeafe; color: #1e40af; }
.hp-beng-dec.is-skip { background: #ffedd5; color: #9a3412; }
.hp-beng-dec.is-later { background: #f3f4f6; color: #374151; }
.hp-beng-enova {
  display: grid;
  gap: .35rem;
  padding: .65rem .75rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, #0f766e 6%, var(--bg));
  margin-bottom: .35rem;
}
.hp-beng-enova-item {
  display: flex;
  gap: .45rem;
  align-items: flex-start;
  font-size: .88rem;
  cursor: pointer;
}
.hp-beng-enova-item input { margin-top: .2rem; }
.hp-beng-enova-links { margin: .35rem 0 0; }
.hp-beng-faq { margin-top: .85rem; }
.hp-beng-faq > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .95rem;
}
.hp-beng-faq details { margin: .35rem 0; }
.hp-beng-faq details summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-beng-faq details p { margin: .35rem 0 .15rem; }
.hp-beng-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 4%);
  max-height: min(92vh, 920px);
  overflow: auto;
}
.hp-beng-empty { padding: .5rem 0; }
.hp-beng-letter-row {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: .5rem;
  margin-bottom: .35rem;
}
.hp-beng-letter-card {
  flex: 1 1 4.5rem;
  text-align: center;
  padding: .45rem .5rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg);
  min-width: 4.5rem;
}
.hp-beng-letter-card.is-after {
  border-color: color-mix(in srgb, #0f766e 45%, var(--border));
  background: color-mix(in srgb, #0f766e 8%, var(--bg));
}
.hp-beng-letter-big {
  display: block;
  font-size: 1.75rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.1;
  margin-top: .1rem;
}
.hp-beng-amb-label {
  display: block;
  font-size: .9rem;
  font-weight: 700;
  margin-top: .25rem;
  line-height: 1.25;
}
.hp-beng-letter-arrow {
  align-self: center;
  font-weight: 700;
  color: var(--muted, #6b7280);
}
.hp-beng-triad {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin: .55rem 0;
}
.hp-beng-triad-card {
  text-align: center;
  padding: .4rem .3rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-beng-triad-card strong {
  display: block;
  font-size: 1.25rem;
  font-variant-numeric: tabular-nums;
}
.hp-beng-triad-card.is-do { border-color: color-mix(in srgb, #16a34a 40%, var(--border)); }
.hp-beng-triad-card.is-skip { border-color: color-mix(in srgb, #f59e0b 40%, var(--border)); }
.hp-beng-triad-card.is-later { border-color: color-mix(in srgb, #6b7280 40%, var(--border)); }
.hp-beng-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
  margin: .45rem 0;
}
.hp-beng-gauge {
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-beng-gauge strong {
  display: block;
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
  margin: .1rem 0;
}
.hp-beng-bar-wrap { margin: .45rem 0; }
.hp-beng-bar-label {
  display: flex;
  justify-content: space-between;
  margin-bottom: .2rem;
}
.hp-beng-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, var(--bg));
  overflow: hidden;
}
.hp-beng-bar-fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand, #0f766e) 70%, #22c55e);
  transition: width .2s ease;
}
.hp-beng-bar-fill.is-over {
  background: color-mix(in srgb, #dc2626 75%, #f59e0b);
}
.hp-beng-status {
  margin: .45rem 0;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 30%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, var(--bg));
}
.hp-beng-status-title {
  margin: 0 0 .2rem;
  font-weight: 750;
  font-size: .95rem;
}
.hp-beng-subh {
  margin: .7rem 0 .3rem;
  font-size: .9rem;
  font-weight: 700;
}
.hp-beng-rank,
.hp-beng-actions,
.hp-beng-over-ul,
.hp-beng-tips-ul {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-beng-rank li,
.hp-beng-actions li,
.hp-beng-over-ul li,
.hp-beng-tips-ul li { margin: .2rem 0; }
.hp-beng-plan {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 10rem;
}
.hp-beng-plan-label { display: block; margin-top: .5rem; }
.hp-beng-nonadvice {
  margin-top: .55rem;
  padding-top: .45rem;
  border-top: 1px dashed var(--border);
  font-size: .78rem;
}
.hp-beng-seed-hint {
  margin: .25rem 0 .4rem;
  padding: .35rem .5rem;
  border-radius: 8px;
  background: color-mix(in srgb, #0f766e 8%, var(--bg));
  border: 1px solid color-mix(in srgb, #0f766e 25%, var(--border));
}
.hp-beng-panel-actions { margin-top: .5rem; }
.hp-beng-check-progress {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .65rem;
  margin: 0 0 .5rem;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 70%, #ecfdf5);
}
.hp-beng-check-progress strong {
  font-variant-numeric: tabular-nums;
  min-width: 3.2rem;
}
.hp-beng-check-bar {
  flex: 1 1 8rem;
  height: .45rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, var(--bg));
  overflow: hidden;
  min-width: 6rem;
}
.hp-beng-check-bar-fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: color-mix(in srgb, #0f766e 75%, #22c55e);
  transition: width .2s ease;
}
.hp-beng-align {
  margin: 0 0 .55rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid #fde68a;
  background: #fffbeb;
  color: #78350f;
  line-height: 1.35;
}
.hp-beng-formel {
  margin: .45rem 0 .55rem;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 5%, var(--bg));
}
.hp-beng-formel code {
  display: block;
  margin-top: .2rem;
  font-size: .82rem;
  white-space: normal;
  word-break: break-word;
  color: #0f172a;
}
.hp-beng-scenarios {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin: 0 0 .35rem;
}
.hp-beng-scen {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .5rem;
  display: flex;
  flex-direction: column;
  gap: .12rem;
  background: color-mix(in srgb, var(--bg) 40%, #fff);
}
.hp-beng-scen strong {
  font-size: 1.05rem;
  font-variant-numeric: tabular-nums;
}
.hp-beng-scen-tag {
  font-size: .72rem;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: .03em;
  opacity: .9;
}
.hp-beng-scen.is-a { border-color: #86efac; background: #f0fdf4; }
.hp-beng-scen.is-b { border-color: #93c5fd; background: #eff6ff; }
.hp-beng-scen.is-c { border-color: #fde68a; background: #fffbeb; }
.hp-beng-scen .btn { margin-top: .25rem; align-self: flex-start; }
.hp-beng-scen-note { margin: 0 0 .55rem; line-height: 1.35; }
.hp-beng-whatif {
  margin: .45rem 0;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid #e0e7ff;
  background: #eef2ff;
}
.hp-beng-whatif-cost {
  border-color: #bfdbfe;
  background: #eff6ff;
}
.hp-beng-whatif-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .35rem;
}
.hp-beng-whatif-grid strong {
  display: block;
  font-variant-numeric: tabular-nums;
  margin-top: .1rem;
  font-size: .88rem;
  line-height: 1.3;
}
.hp-beng-scen-bars {
  margin: .5rem 0 .6rem;
  padding: .5rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border, #e5e7eb);
  background: color-mix(in srgb, #f8fafc 85%, var(--card, #fff));
}
.hp-beng-scen-bar-row {
  display: grid;
  grid-template-columns: 1.35rem 1fr auto;
  gap: .4rem;
  align-items: center;
  margin: .28rem 0;
  font-size: .8rem;
}
.hp-beng-scen-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border, #e5e7eb) 75%, transparent);
  overflow: hidden;
}
.hp-beng-scen-bar-fill {
  height: 100%;
  width: 0;
  border-radius: inherit;
  transition: width .25s ease;
  background: #94a3b8;
}
.hp-beng-scen-bar-fill.is-a { background: #22c55e; }
.hp-beng-scen-bar-fill.is-b { background: #3b82f6; }
.hp-beng-scen-bar-fill.is-c { background: #f59e0b; }
.hp-beng-sticky {
  position: sticky;
  bottom: 0;
  z-index: 8;
  margin: .75rem 0 0;
  padding: .5rem .65rem;
  border-top: 1px solid var(--border, #e5e7eb);
  background: color-mix(in srgb, var(--card, #fff) 94%, #0d9488);
  box-shadow: 0 -4px 16px rgba(15, 23, 42, .08);
  border-radius: 12px 12px 0 0;
}
.hp-beng-sticky-inner {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: center;
  justify-content: space-between;
}
.hp-beng-sticky-letter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  height: 2rem;
  padding: 0 .4rem;
  border-radius: 8px;
  font-weight: 800;
  font-size: 1.05rem;
  background: #0f766e;
  color: #ecfdf5;
}
@media (min-width: 900px) {
  .hp-beng-sticky { display: none !important; }
}
.hp-beng-lock-tl {
  display: grid;
  gap: .3rem;
  margin: .2rem 0;
}
.hp-beng-lock-row {
  display: grid;
  grid-template-columns: minmax(7rem, 1.1fr) minmax(0, 1.6fr) auto;
  gap: .35rem;
  align-items: center;
  font-size: .8rem;
  padding: .3rem .4rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-beng-lock-phase {
  font-weight: 700;
  color: #0f766e;
}
.hp-beng-lock-items {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted, #4b5563);
}
.hp-beng-lock-n {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  min-width: 1.25rem;
  text-align: right;
}
.hp-beng-gauges {
  grid-template-columns: 1fr 1fr;
}
@media (max-width: 520px) {
  .hp-beng-scenarios { grid-template-columns: 1fr; }
  .hp-beng-whatif-grid { grid-template-columns: 1fr; }
  .hp-beng-lock-row {
    grid-template-columns: 1fr auto;
  }
  .hp-beng-lock-items { grid-column: 1 / -1; white-space: normal; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-beng-bar-fill,
  .hp-beng-check-bar-fill,
  .hp-beng-scen-bar-fill { transition: none; }
}

/* —— Endringsordre-logg (build-endringsordre · build_change) —— */
.hp-bco-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .85rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-bco-hero-mascot {
  width: 72px; height: 72px; object-fit: contain;
  border-radius: 50%;
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  border: 2px solid color-mix(in srgb, var(--brand) 30%, var(--border));
}
.hp-bco-hero-copy { min-width: 0; grid-column: 2; }
.hp-bco-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
  color: var(--muted, #64748b);
}
.hp-bco-lead-bullets li { margin: .15rem 0; }
.hp-bco-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  padding: .55rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 5%, var(--bg));
}
.hp-bco-how summary { cursor: pointer; font-weight: 700; font-size: .92rem; }
.hp-bco-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
  color: var(--muted, #64748b);
}
.hp-bco-how-list li { margin: .2rem 0; }
.hp-bco-demos {
  display: flex; flex-wrap: wrap; align-items: center; gap: .4rem;
  margin: 0 0 .85rem;
}
.hp-bco-demo-badge {
  display: inline-block;
  font-size: .68rem; font-weight: 700;
  padding: .08rem .35rem; border-radius: 999px;
  border: 1px solid color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 14%, var(--bg-elev));
  vertical-align: middle;
}
.hp-bco-demo-note,
.hp-bco-seed-hint {
  margin: -.35rem 0 .85rem;
  padding: .4rem .6rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg));
}
.hp-bco-seed-hint {
  border-style: solid;
  border-color: color-mix(in srgb, #0f766e 25%, var(--border));
  background: color-mix(in srgb, #0f766e 8%, var(--bg));
}
.hp-bco-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .9fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-bco-layout { grid-template-columns: 1fr; }
  .hp-bco-hero { grid-template-columns: auto 1fr; }
}
.hp-bco-section {
  margin: 1.15rem 0 .55rem;
  font-size: 1.05rem;
  font-weight: 750;
  letter-spacing: -0.02em;
}
.hp-bco-main .hp-bco-section:first-child { margin-top: 0; }
.hp-bco-subh {
  margin: .75rem 0 .35rem;
  font-size: .92rem;
  font-weight: 700;
}
.hp-bco-check-row {
  display: flex; align-items: center; gap: .45rem;
  margin-top: .25rem;
}
.hp-bco-live-preview {
  display: flex; flex-direction: column; gap: .15rem;
  margin-top: .75rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg));
}
.hp-bco-live-preview strong {
  font-size: 1.05rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--brand);
}
.hp-bco-filters {
  display: flex; flex-wrap: wrap; gap: .35rem;
  margin: 0 0 .55rem;
}
.hp-bco-list { display: flex; flex-direction: column; gap: .55rem; }
.hp-bco-card {
  padding: .7rem .8rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg-elev, var(--bg));
}
.hp-bco-card.is-godkjent,
.hp-bco-card.is-utfort {
  border-color: color-mix(in srgb, #0f766e 35%, var(--border));
}
.hp-bco-card.is-avvist { opacity: .78; }
.hp-bco-card.is-sendt,
.hp-bco-card.is-utkast {
  border-color: color-mix(in srgb, #f59e0b 30%, var(--border));
}
.hp-bco-card-top {
  display: flex; justify-content: space-between; gap: .75rem; align-items: flex-start;
}
.hp-bco-card-delta {
  text-align: right;
  flex-shrink: 0;
  display: flex; flex-direction: column; align-items: flex-end; gap: .1rem;
}
.hp-bco-card-amt {
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--brand);
}
.hp-bco-card-ev,
.hp-bco-card-next { margin: .25rem 0 0; }
.hp-bco-card-actions { margin-top: .45rem; }
.hp-bco-written-badge {
  display: inline-block;
  font-size: .65rem; font-weight: 700;
  padding: .05rem .3rem; border-radius: 999px;
  border: 1px solid color-mix(in srgb, #0f766e 40%, var(--border));
  background: color-mix(in srgb, #0f766e 12%, var(--bg-elev));
  color: #0f766e;
  margin-left: .25rem;
}
.hp-bco-unsigned-badge {
  display: inline-block;
  font-size: .65rem; font-weight: 700;
  padding: .05rem .3rem; border-radius: 999px;
  border: 1px solid color-mix(in srgb, #b45309 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 12%, var(--bg-elev));
  color: #b45309;
  margin-left: .25rem;
}
.hp-bco-panel {
  position: sticky;
  top: .75rem;
  padding: .9rem 1rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 4%, var(--bg-elev, var(--bg)));
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 60%, transparent);
}
.hp-bco-panel-head {
  display: flex; justify-content: space-between; align-items: center; gap: .5rem;
  margin-bottom: .35rem;
}
.hp-bco-band {
  font-size: .75rem; font-weight: 800;
  padding: .2rem .5rem; border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg);
  white-space: nowrap;
}
.hp-bco-band.is-ok {
  border-color: color-mix(in srgb, #0f766e 40%, var(--border));
  background: color-mix(in srgb, #0f766e 12%, var(--bg));
  color: #0f766e;
}
.hp-bco-band.is-warn {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 14%, var(--bg));
  color: #b45309;
}
.hp-bco-band.is-hot {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 12%, var(--bg));
  color: #b91c1c;
}
.hp-bco-band.is-mid {
  color: var(--muted, #64748b);
}
.hp-bco-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .55rem 0 .75rem;
}
.hp-bco-gauge {
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
  display: flex; flex-direction: column; gap: .1rem;
}
.hp-bco-gauge strong {
  font-size: .95rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.hp-bco-water { margin: 0 0 .75rem; }
.hp-bco-water-row {
  display: flex; justify-content: space-between; align-items: baseline; gap: .5rem;
  margin-bottom: .3rem;
}
.hp-bco-water-bar {
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-bco-water-fill {
  display: block; height: 100%; width: 0;
  border-radius: 999px;
  background: color-mix(in srgb, #0f766e 75%, var(--brand));
  transition: width .25s ease;
}
.hp-bco-water-fill.is-warn {
  background: color-mix(in srgb, #f59e0b 80%, var(--brand));
}
.hp-bco-water-fill.is-over {
  background: color-mix(in srgb, #dc2626 75%, #b91c1c);
}
.hp-bco-count-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .35rem;
  margin-bottom: .65rem;
}
.hp-bco-count {
  padding: .35rem .4rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg);
  text-align: center;
}
.hp-bco-count strong {
  display: block;
  font-variant-numeric: tabular-nums;
}
.hp-bco-bar-row {
  display: grid;
  grid-template-columns: minmax(4.5rem, 28%) 1fr auto;
  gap: .35rem;
  align-items: center;
  margin: .25rem 0;
  font-size: .82rem;
}
.hp-bco-bar-lab { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hp-bco-bar-track {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-bco-bar-fill {
  display: block; height: 100%;
  background: color-mix(in srgb, var(--brand) 70%, #0f766e);
  border-radius: 999px;
}
.hp-bco-bar-n {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: .78rem;
}
.hp-bco-flag-ul {
  margin: 0; padding-left: 1.1rem;
  font-size: .85rem;
  color: var(--muted, #64748b);
}
.hp-bco-flag-ul li { margin: .2rem 0; }
.hp-bco-summary {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 10rem;
}
.hp-bco-nonadvice {
  margin-top: .55rem;
  padding-top: .45rem;
  border-top: 1px dashed var(--border);
  font-size: .78rem;
}
.hp-bco-privacy {
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--border) 12%, var(--bg));
}
.hp-bco-faq details {
  margin: .4rem 0;
  padding: .45rem .65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}
.hp-bco-faq summary { cursor: pointer; font-weight: 650; }
.hp-bco-templates {
  display: flex; flex-wrap: wrap; align-items: center; gap: .35rem;
  margin: 0 0 .65rem;
}
.hp-bco-templates .chip-sm {
  min-height: 34px;
  font-size: .8rem;
  font-weight: 600;
  padding: .3rem .65rem;
}
.hp-bco-templates .chip {
  border: 1px solid var(--border);
  background: var(--bg-elev, var(--bg));
  border-radius: 999px;
  cursor: pointer;
  color: inherit;
}
.hp-bco-templates .chip:hover {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev, var(--bg)));
}
.hp-bco-live-preview [data-out="live_gate"] {
  color: #b45309;
  font-weight: 600;
}
.hp-bco-log-toolbar {
  display: flex; flex-wrap: wrap; gap: .55rem .85rem;
  align-items: flex-end;
  justify-content: space-between;
  margin: 0 0 .55rem;
}
.hp-bco-sort {
  display: grid; gap: .2rem;
  font-weight: 650;
  min-width: 10rem;
}
.hp-bco-sort select {
  font: inherit;
  font-weight: 500;
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text, inherit);
}
.hp-bco-fcnt {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  opacity: .75;
  margin-left: .1rem;
}
.hp-bco-whatif {
  margin: 0 0 .75rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg));
}
.hp-bco-whatif-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .35rem;
}
.hp-bco-cumul {
  margin: 0 0 .75rem;
}
.hp-bco-cumul-track {
  display: flex; align-items: flex-end; gap: .2rem;
  height: 64px;
  padding: .25rem .15rem 0;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-bco-cumul-col {
  flex: 1 1 0;
  min-width: 0;
  height: 100%;
  display: flex; flex-direction: column;
  justify-content: flex-end; align-items: center;
  gap: .15rem;
}
.hp-bco-cumul-bar {
  width: 70%;
  max-width: 18px;
  min-height: 6px;
  border-radius: 4px 4px 2px 2px;
  background: color-mix(in srgb, #0f766e 75%, var(--brand));
}
.hp-bco-cumul-bar.is-over {
  background: color-mix(in srgb, #dc2626 75%, #b91c1c);
}
.hp-bco-cumul-bar.is-neg {
  background: color-mix(in srgb, #64748b 70%, var(--border));
}
.hp-bco-cumul-lab {
  font-size: .62rem;
  font-variant-numeric: tabular-nums;
  color: var(--muted, #64748b);
}
.hp-bco-seed-actions {
  display: flex; flex-wrap: wrap; align-items: center; gap: .45rem;
  margin: -.25rem 0 .85rem;
}
.hp-bco-card-actions {
  flex-wrap: wrap;
  gap: .25rem;
}
.hp-bco-quick {
  display: flex; flex-wrap: wrap; align-items: center; gap: .35rem;
  margin: .15rem 0 .35rem;
}
.hp-bco-quick .chip-sm,
.hp-bco-date-chips .chip-sm {
  min-height: 32px;
  font-size: .78rem;
  font-weight: 600;
  padding: .25rem .55rem;
  border: 1px solid var(--border);
  background: var(--bg-elev, var(--bg));
  border-radius: 999px;
  cursor: pointer;
  color: inherit;
}
.hp-bco-quick .chip-sm.is-on,
.hp-bco-quick .chip-sm[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev, var(--bg)));
  font-weight: 750;
}
.hp-bco-date-chips {
  display: flex; flex-wrap: wrap; gap: .3rem;
  margin-top: .35rem;
}
.hp-bco-formula {
  margin: 0 0 .65rem;
  padding: .5rem .65rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg));
}
.hp-bco-formula-line {
  margin: 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .82rem;
  font-weight: 650;
  line-height: 1.35;
  word-break: break-word;
}
.hp-bco-hard-fill {
  background: color-mix(in srgb, var(--brand) 65%, #0f766e);
}
.hp-bco-live-verdict {
  margin: .35rem 0 0;
  padding: .35rem .5rem;
  border-radius: 10px;
  font-size: .85rem;
  font-weight: 700;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-bco-live-verdict.is-ok {
  border-color: color-mix(in srgb, #0f766e 40%, var(--border));
  background: color-mix(in srgb, #0f766e 10%, var(--bg));
  color: #0f766e;
}
.hp-bco-live-verdict.is-warn {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 12%, var(--bg));
  color: #b45309;
}
.hp-bco-live-verdict.is-hot {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 10%, var(--bg));
  color: #b91c1c;
}
.hp-bco-card.is-credit {
  border-color: color-mix(in srgb, #0f766e 28%, var(--border));
}
.hp-bco-card-amt.is-credit {
  color: #0f766e;
}
.hp-bco-mobile-bar {
  display: none;
}
@media (max-width: 900px) {
  .hp-bco-mobile-bar:not([hidden]) {
    display: block;
    position: sticky;
    bottom: 0;
    z-index: 20;
    margin: 1rem -0.25rem 0;
    padding: .55rem .75rem calc(.55rem + env(safe-area-inset-bottom, 0));
    border-top: 1px solid var(--border);
    background: color-mix(in srgb, var(--bg-elev, var(--bg)) 92%, var(--brand));
    box-shadow: 0 -6px 18px color-mix(in srgb, #000 8%, transparent);
  }
  .hp-bco-mobile-bar-inner {
    display: flex; flex-wrap: wrap; align-items: center; gap: .45rem .75rem;
    justify-content: space-between;
  }
  .hp-bco-mobile-bar-inner strong {
    font-variant-numeric: tabular-nums;
    font-weight: 800;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hp-bco-water-fill { transition: none; }
}
@media (max-width: 600px) {
  .hp-bco-hero { grid-template-columns: 1fr; }
  .hp-bco-hero-copy { grid-column: 1; }
  .hp-bco-gauges { grid-template-columns: 1fr 1fr; }
  .hp-bco-count-grid { grid-template-columns: 1fr 1fr; }
  .hp-bco-whatif-grid { grid-template-columns: 1fr 1fr; }
  .hp-bco-log-tools { width: 100%; }
}
.hp-bco-room {
  margin: 0 0 .75rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, #0f766e 35%, var(--border));
  background: color-mix(in srgb, #0f766e 7%, var(--bg));
}
.hp-bco-whatif-must {
  padding-top: .45rem;
  border-top: 1px dashed color-mix(in srgb, var(--brand) 30%, var(--border));
}
.hp-bco-log-tools {
  display: flex; flex-wrap: wrap; align-items: flex-end; gap: .45rem .65rem;
}
.hp-bco-search {
  display: grid; gap: .2rem;
  font-weight: 650;
  min-width: 10rem;
  flex: 1 1 10rem;
}
.hp-bco-search input[type="search"] {
  font: inherit;
  font-weight: 500;
  padding: .4rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text, inherit);
  min-width: 0;
  width: 100%;
}
.hp-bco-prio-badge {
  display: inline-block;
  font-size: .65rem; font-weight: 700;
  padding: .05rem .3rem; border-radius: 999px;
  margin-left: .25rem;
  border: 1px solid var(--border);
  vertical-align: middle;
}
.hp-bco-prio-badge.is-must {
  border-color: color-mix(in srgb, #7c3aed 45%, var(--border));
  background: color-mix(in srgb, #7c3aed 12%, var(--bg-elev));
  color: #6d28d9;
}
.hp-bco-prio-badge.is-nice {
  border-color: color-mix(in srgb, #64748b 40%, var(--border));
  background: color-mix(in srgb, #64748b 10%, var(--bg-elev));
  color: #475569;
}
.hp-bco-card.is-must {
  box-shadow: inset 3px 0 0 color-mix(in srgb, #7c3aed 70%, transparent);
}
.hp-bco-card.is-flash {
  outline: 2px solid color-mix(in srgb, var(--brand) 70%, #f59e0b);
  outline-offset: 2px;
}
.hp-bco-init-fill {
  background: color-mix(in srgb, #0369a1 70%, var(--brand));
}
.hp-bco-inits { margin: 0 0 .65rem; }

/* —— Valg underveis (build-valg-underveis · build_valg) —— */
.hp-bv-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  margin-bottom: .85rem;
  align-items: start;
}
.hp-bv-hero-mascot {
  border-radius: 14px;
  object-fit: cover;
  background: var(--bg-elev);
}
.hp-bv-hero-copy { min-width: 0; }
.hp-bv-lead-bullets {
  margin: .35rem 0 0;
  padding-left: 1.15rem;
  display: grid;
  gap: .2rem;
  font-size: .9rem;
  color: var(--muted);
}
.hp-bv-lead-bullets li { margin: .12rem 0; }
.hp-bv-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .35rem .7rem .55rem;
  background: var(--bg-elev);
}
.hp-bv-how summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
}
.hp-bv-how-list {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
  font-size: .86rem;
  color: var(--muted);
  display: grid;
  gap: .25rem;
}
.hp-bv-demo-badge {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 22%, var(--bg-elev));
  color: #92400e;
  vertical-align: middle;
}
.hp-bv-demo-note {
  margin: .35rem 0 .55rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, #f59e0b 50%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev));
}
.hp-bv-demos,
.hp-bv-templates {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: .55rem 0 .45rem;
}
.hp-bv-demos .chip,
.hp-bv-templates .chip {
  min-height: 40px;
  padding: .4rem .8rem;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  border-radius: 999px;
  font-size: .84rem;
  font-weight: 650;
  cursor: pointer;
  color: inherit;
}
.hp-bv-demos .chip:hover,
.hp-bv-demos .chip[aria-pressed="true"],
.hp-bv-templates .chip:hover {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-bv-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-bv-templates .chip-sm {
  min-height: 34px;
  font-size: .8rem;
  font-weight: 600;
  padding: .3rem .65rem;
}
.hp-bv-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .95fr);
  gap: 1rem;
  margin-top: .75rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-bv-layout { grid-template-columns: 1fr; }
  .hp-bv-hero { grid-template-columns: auto 1fr; }
}
.hp-bv-section {
  margin: 1.1rem 0 .55rem;
  font-size: 1.05rem;
  font-weight: 750;
}
.hp-bv-main .hp-bv-section:first-child { margin-top: 0; }
.hp-bv-check {
  display: flex;
  gap: .55rem;
  align-items: flex-start;
  font-size: .9rem;
  font-weight: 500;
  cursor: pointer;
}
.hp-bv-check input { margin-top: .2rem; flex-shrink: 0; }
.hp-bv-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem .85rem;
  margin: 0 0 .55rem;
}
.hp-bv-filter {
  display: grid;
  gap: .2rem;
  font-weight: 650;
  font-size: .85rem;
}
.hp-bv-filter select {
  font: inherit;
  font-weight: 500;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  min-width: 10rem;
}
.hp-bv-ledger {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: .55rem;
}
.hp-bv-item {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .65rem .75rem;
  background: var(--bg-elev);
  display: grid;
  gap: .3rem;
}
.hp-bv-item.is-overdue {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 6%, var(--bg-elev));
}
.hp-bv-item.is-locked {
  box-shadow: inset 3px 0 0 color-mix(in srgb, var(--brand) 55%, transparent);
}
.hp-bv-item.is-done {
  opacity: .92;
}
.hp-bv-item-top {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .55rem;
  align-items: center;
  justify-content: space-between;
}
.hp-bv-item-title { font-size: .98rem; }
.hp-bv-item-tags {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
}
.hp-bv-tag {
  display: inline-block;
  font-size: .68rem;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--muted) 16%, var(--bg));
}
.hp-bv-tag.st-ko { background: color-mix(in srgb, #f59e0b 22%, var(--bg)); color: #92400e; }
.hp-bv-tag.st-valgt { background: color-mix(in srgb, #16a34a 18%, var(--bg)); color: #14532d; }
.hp-bv-tag.st-utsatt { background: color-mix(in srgb, #64748b 18%, var(--bg)); }
.hp-bv-tag.st-endret { background: color-mix(in srgb, #7c3aed 16%, var(--bg)); color: #5b21b6; }
.hp-bv-tag.st-avvist { background: color-mix(in srgb, var(--muted) 20%, var(--bg)); opacity: .85; }
.hp-bv-tag.is-over { background: color-mix(in srgb, #dc2626 20%, var(--bg)); color: #991b1b; }
.hp-bv-tag.is-lock { background: color-mix(in srgb, var(--brand) 18%, var(--bg)); color: var(--brand); }
.hp-bv-tag.is-prio { background: color-mix(in srgb, #ea580c 18%, var(--bg)); color: #9a3412; }
.hp-bv-item-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  margin-top: .15rem;
}
.hp-bv-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .9rem 1rem 1.05rem;
  background: var(--bg-elev);
  display: grid;
  gap: .65rem;
}
.hp-bv-panel-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .45rem;
}
.hp-bv-band {
  display: inline-block;
  font-size: .78rem;
  font-weight: 700;
  padding: .2rem .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--muted) 18%, var(--bg));
  color: inherit;
}
.hp-bv-band.is-ok {
  background: color-mix(in srgb, #16a34a 18%, var(--bg));
  color: #14532d;
}
.hp-bv-band.is-mid {
  background: color-mix(in srgb, #f59e0b 22%, var(--bg));
  color: #92400e;
}
.hp-bv-band.is-tight {
  background: color-mix(in srgb, #dc2626 18%, var(--bg));
  color: #991b1b;
}
.hp-bv-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
}
.hp-bv-gauge {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .55rem;
  background: var(--bg);
  display: grid;
  gap: .15rem;
}
.hp-bv-gauge strong {
  font-size: .98rem;
  font-variant-numeric: tabular-nums;
}
.hp-bv-money,
.hp-bv-next {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .5rem .6rem;
  background: var(--bg);
}
.hp-bv-nonadvice {
  margin: 0;
  font-size: .78rem;
}
.hp-bv-bar-wrap { margin: .15rem 0; }
.hp-bv-bar-label {
  display: flex;
  justify-content: space-between;
  margin-bottom: .2rem;
}
.hp-bv-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, var(--bg));
  overflow: hidden;
}
.hp-bv-bar-fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand, #0f766e) 70%, #22c55e);
  transition: width .2s ease;
}
.hp-bv-summary {
  font: inherit;
  font-size: .82rem;
  line-height: 1.4;
  width: 100%;
  resize: vertical;
  min-height: 8rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg);
  color: var(--text);
  padding: .55rem .65rem;
}
.hp-bv-panel-actions { margin-top: .15rem; }
.hp-bv-privacy {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .35rem .7rem .55rem;
  background: var(--bg);
}
.hp-bv-privacy summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .88rem;
}
.hp-bv-deadline-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-bv-deadline-chips .chip {
  min-height: 32px;
  font-size: .78rem;
  padding: .25rem .55rem;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  border-radius: 999px;
  cursor: pointer;
  color: inherit;
}
.hp-bv-deadline-chips .chip:hover {
  border-color: color-mix(in srgb, var(--brand) 50%, var(--border));
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev));
}
.hp-bv-live-preview {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .65rem;
  align-items: baseline;
  margin-top: .55rem;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand) 35%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev));
  font-size: .88rem;
}
.hp-bv-live-preview strong {
  font-variant-numeric: tabular-nums;
}
.hp-bv-filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin: 0 0 .55rem;
  align-items: center;
}
.hp-bv-filter-chips .chip {
  min-height: 34px;
  font-size: .8rem;
  font-weight: 650;
  padding: .28rem .6rem;
  border: 1px solid var(--border);
  background: var(--bg-elev);
  border-radius: 999px;
  cursor: pointer;
  color: inherit;
}
.hp-bv-filter-chips .chip.is-on,
.hp-bv-filter-chips .chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
  background: color-mix(in srgb, var(--brand) 14%, var(--bg-elev));
}
.hp-bv-filter-chips .chip span[data-bv-qc] {
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  margin-left: .15rem;
  opacity: .85;
}
.hp-bv-fc {
  font-weight: 600;
  opacity: .75;
}
.hp-bv-formula {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .45rem .55rem;
  background: var(--bg);
  margin-bottom: .15rem;
}
.hp-bv-formula-line {
  font-variant-numeric: tabular-nums;
  font-weight: 650;
}
.hp-bv-tag.is-cd {
  background: color-mix(in srgb, #0ea5e9 16%, var(--bg));
  color: #075985;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 700;
}
.hp-bv-item.is-prio {
  border-color: color-mix(in srgb, #ea580c 28%, var(--border));
}
.hp-bv-item.is-flash {
  outline: 2px solid color-mix(in srgb, #dc2626 55%, transparent);
  outline-offset: 2px;
}
.hp-bv-seed-hint {
  margin: .35rem 0 .15rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev));
}
.hp-bv-faq {
  border-top: 1px solid var(--border);
  padding-top: .35rem;
}
.hp-bv-faq-item {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .35rem .7rem .5rem;
  background: var(--bg-elev);
  margin: .4rem 0;
}
.hp-bv-faq-item summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-bv-faq-item p { margin: .35rem 0 0; }
.hp-bv-next-actions { margin-top: .25rem; }
@media (prefers-reduced-motion: reduce) {
  .hp-bv-bar-fill { transition: none; }
  .hp-bv-item.is-flash { outline: 1px solid color-mix(in srgb, #dc2626 55%, transparent); }
}


/* —— Nabovarsel bygg (build-nabovarsel-bygg · build_nabovarsel) —— */
.hp-bnb { margin-top: .25rem; }
.hp-bnb-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-bnb-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-bnb-hero-copy { min-width: 0; }
.hp-bnb-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  color: var(--muted, #5b6470);
}
.hp-bnb-lead-bullets li { margin: .2rem 0; }
.hp-bnb-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-bnb-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-bnb-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-bnb-how-list li { margin: .2rem 0; }
.hp-bnb-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, #f59e0b 18%, var(--bg-elev, #fff));
  color: #92400e;
}
.hp-bnb-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem;
  margin: 0 0 .45rem;
}
.hp-bnb-demos .chip {
  font-size: .82rem;
  cursor: pointer;
}
.hp-bnb-demos .chip:hover,
.hp-bnb-demos .chip.active,
.hp-bnb-demos .chip[aria-pressed="true"] {
  border-color: var(--brand, #0f766e);
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, var(--bg-elev, #fff));
}
.hp-bnb-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-bnb-demo-note { margin: 0 0 .65rem; }
.hp-bnb-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .9fr);
  gap: 1rem 1.25rem;
  align-items: start;
}
@media (max-width: 900px) {
  .hp-bnb-layout { grid-template-columns: 1fr; }
  .hp-bnb-panel { order: -1; }
  .hp-bnb-hero { grid-template-columns: 1fr; }
  .hp-bnb-hero-mascot { width: 56px; height: 56px; }
}
.hp-bnb-section {
  margin: 1.1rem 0 .5rem;
  font-size: 1.05rem;
  font-weight: 700;
}
.hp-bnb-section:first-child { margin-top: 0; }
.hp-bnb-rf-list,
.hp-bnb-cov-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .35rem;
}
.hp-bnb-rf-item {
  display: flex;
  align-items: flex-start;
  gap: .45rem;
  padding: .45rem .55rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-elev, #fff);
  cursor: pointer;
  font-size: .9rem;
}
.hp-bnb-rf-item:has(input:checked) {
  border-color: color-mix(in srgb, #dc2626 40%, var(--border));
  background: color-mix(in srgb, #dc2626 8%, var(--bg-elev, #fff));
}
.hp-bnb-cov-row {
  padding: .4rem .5rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-elev, #fff);
}
.hp-bnb-cov-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .4rem .65rem;
}
.hp-bnb-cov-label { flex: 1; min-width: 12rem; }
.hp-bnb-st {
  min-width: 8.5rem;
  font-size: .86rem;
}
.hp-bnb-n-list {
  display: grid;
  gap: .4rem;
  margin: .55rem 0 .35rem;
}
.hp-bnb-n-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .45rem .75rem;
  padding: .5rem .6rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-elev, #fff);
}
.hp-bnb-n-row-main {
  display: grid;
  gap: .15rem;
  min-width: 10rem;
  flex: 1;
}
.hp-bnb-n-name { font-size: .92rem; }
.hp-bnb-n-badge {
  display: inline-block;
  width: fit-content;
  font-size: .72rem;
  font-weight: 700;
  padding: .08rem .4rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  color: var(--muted, #5b6470);
}
.hp-bnb-n-badge.is-ok {
  background: color-mix(in srgb, #16a34a 16%, var(--bg-elev, #fff));
  color: #166534;
}
.hp-bnb-n-badge.is-mid {
  background: color-mix(in srgb, var(--brand, #0f766e) 14%, var(--bg-elev, #fff));
  color: #0f766e;
}
.hp-bnb-n-badge.is-warn {
  background: color-mix(in srgb, #f59e0b 18%, var(--bg-elev, #fff));
  color: #92400e;
}
.hp-bnb-n-row-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
}
.hp-bnb-n-st-sel {
  font-size: .82rem;
  min-width: 8rem;
}
.hp-bnb-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem 1rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 4%);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-bnb-empty { margin: 0; }
.hp-bnb-live {
  margin-bottom: .65rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-bnb-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .78rem;
}
.hp-bnb-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .55rem 0 .65rem;
}
.hp-bnb-gauges .hp-gauge {
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  background: var(--bg-elev, #fff);
  display: grid;
  gap: .15rem;
}
.hp-bnb-gauges .hp-gauge strong {
  font-size: .92rem;
  font-weight: 700;
}
.hp-bnb-readiness {
  border-radius: 12px;
  padding: .55rem .65rem;
  margin: .5rem 0;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-bnb-readiness.is-ok {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  background: color-mix(in srgb, #16a34a 10%, var(--bg-elev, #fff));
}
.hp-bnb-readiness.is-check {
  border-color: color-mix(in srgb, #f59e0b 45%, var(--border));
  background: color-mix(in srgb, #f59e0b 10%, var(--bg-elev, #fff));
}
.hp-bnb-readiness.is-missing,
.hp-bnb-readiness.is-low {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #dc2626 10%, var(--bg-elev, #fff));
}
.hp-bnb-readiness.is-high:not(.is-missing) {
  border-color: color-mix(in srgb, #16a34a 35%, var(--border));
}
.hp-bnb-ready-title {
  margin: 0 0 .25rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-bnb-bar {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, var(--bg));
  overflow: hidden;
}
.hp-bnb-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand, #0f766e) 70%, #22c55e);
  transition: width .2s ease;
}
.hp-bnb-fill.is-ok { background: color-mix(in srgb, #16a34a 75%, #22c55e); }
.hp-bnb-fill.is-mid { background: color-mix(in srgb, #f59e0b 70%, #eab308); }
.hp-bnb-fill.is-low { background: color-mix(in srgb, #dc2626 70%, #f97316); }
.hp-bnb-deadline-box,
.hp-bnb-n-sum,
.hp-bnb-alerts,
.hp-bnb-next {
  margin: .55rem 0;
  padding: .45rem .5rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  background: var(--bg-elev, #fff);
}
.hp-bnb-n-sum-list,
.hp-bnb-alert-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-bnb-n-sum-list li,
.hp-bnb-alert-list li { margin: .18rem 0; }
.hp-bnb-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 7rem;
}
.hp-bnb-privacy {
  margin-top: .85rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .6rem;
}
.hp-bnb-faq details {
  margin: .35rem 0;
  padding: .35rem .5rem;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  border-radius: 10px;
}
.hp-bnb-faq summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
}
.hp-bnb-filter-bar,
.hp-bnb-n-filter,
.hp-bnb-date-presets,
.hp-bnb-quick-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  margin: .35rem 0 .5rem;
}
.hp-bnb-filter-bar .chip,
.hp-bnb-n-filter .chip,
.hp-bnb-date-presets .chip {
  cursor: pointer;
  font-size: .78rem;
}
.hp-bnb-filter-bar .chip.is-on,
.hp-bnb-n-filter .chip.is-on,
.hp-bnb-filter-bar .chip[aria-pressed="true"],
.hp-bnb-n-filter .chip[aria-pressed="true"] {
  border-color: var(--brand, #0f766e);
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, var(--bg-elev, #fff));
  font-weight: 650;
}
.hp-bnb-filter-n {
  display: inline-block;
  min-width: 1.1em;
  margin-left: .15rem;
  font-size: .72rem;
  font-weight: 700;
  opacity: .85;
}
.hp-bnb-cov-row.is-hull {
  border-color: color-mix(in srgb, #f59e0b 35%, var(--border));
  background: color-mix(in srgb, #f59e0b 6%, var(--bg-elev, #fff));
}
.hp-bnb-cov-row.is-hot {
  border-color: color-mix(in srgb, #dc2626 30%, var(--border));
}
.hp-bnb-cov-row.is-hopp {
  outline: 2px solid var(--brand, #0f766e);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand, #0f766e) 18%, transparent);
}
.hp-bnb-hull-box {
  margin: .55rem 0;
  padding: .45rem .5rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #f59e0b 40%, var(--border));
  background: color-mix(in srgb, #f59e0b 8%, var(--bg-elev, #fff));
}
.hp-bnb-hull-list {
  margin: 0;
  padding-left: 0;
  list-style: none;
  font-size: .86rem;
}
.hp-bnb-hull-list li {
  margin: .2rem 0;
}
.hp-bnb-hull-link {
  background: none;
  border: none;
  padding: 0;
  color: var(--brand, #0f766e);
  font: inherit;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.hp-bnb-hull-link:hover {
  color: color-mix(in srgb, var(--brand, #0f766e) 80%, #000);
}
.hp-bnb-date-presets .chip:hover {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 45%, var(--border));
}
@media (prefers-reduced-motion: reduce) {
  .hp-bnb-fill { transition: none; }
  .hp-bnb-cov-row.is-hopp { box-shadow: none; }
}

/* —— Uteareal-plan (build_uteareal / build-uteareal-plan) —— */
.hp-bua { margin-top: .25rem; }
.hp-bua-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-bua-hero-mascot {
  border-radius: 16px;
  grid-row: 1 / span 2;
}
.hp-bua-hero-copy { min-width: 0; grid-column: 2; }
.hp-bua-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-bua-lead-bullets li { margin: .15rem 0; }
.hp-bua-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  padding: .65rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 70%, var(--brand, #0f766e) 6%);
}
.hp-bua-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-bua-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-bua-how-list li { margin: .2rem 0; }
.hp-bua-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: .5rem 0 .75rem;
}
.hp-bua-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: #fef3c7;
  color: #92400e;
  margin-left: .15rem;
}
.hp-bua-demo-note {
  margin: -.35rem 0 .65rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-bua-demos .chip,
.hp-bua-packs .chip,
.hp-bua-filters .chip {
  cursor: pointer;
  font-size: .82rem;
}
.hp-bua-filters .chip-sm {
  font-size: .78rem;
  padding: .2rem .45rem;
}
.hp-bua-demos .chip:hover,
.hp-bua-demos .chip[aria-pressed="true"],
.hp-bua-filters .chip[aria-pressed="true"],
.hp-bua-packs .chip:hover {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
}
.hp-bua-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-bua-packs,
.hp-bua-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: .35rem 0 .55rem;
}
.hp-bua-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .9fr);
  gap: 1.1rem 1.25rem;
  align-items: start;
}
@media (max-width: 920px) {
  .hp-bua-layout { grid-template-columns: 1fr; }
  .hp-bua-hero { grid-template-columns: auto 1fr; }
}
.hp-bua-section {
  font-size: 1.05rem;
  margin: 1rem 0 .5rem;
}
.hp-bua-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  margin: .35rem 0 .75rem;
}
.hp-bua-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .86rem;
  min-width: 800px;
}
.hp-bua-table th,
.hp-bua-table td {
  padding: .45rem .4rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  vertical-align: top;
  text-align: left;
}
.hp-bua-table th {
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--muted, #64748b);
  background: color-mix(in srgb, var(--bg) 92%, var(--brand, #0f766e) 4%);
  position: sticky;
  top: 0;
}
.hp-bua-name { display: block; font-weight: 650; }
.hp-bua-hint { display: block; margin-top: .15rem; line-height: 1.35; }
.hp-bua-cost { max-width: 7.5rem; }
.hp-bua-range-cell { white-space: nowrap; min-width: 4.5rem; }
.hp-bua-range { width: 4rem; vertical-align: middle; }
.hp-bua-range-val {
  display: inline-block;
  min-width: 1rem;
  font-weight: 700;
  font-size: .85rem;
  margin-left: .15rem;
}
.hp-bua-phase-sel { max-width: 6.5rem; font-size: .82rem; }
.hp-bua-kind {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  padding: .12rem .35rem;
  border-radius: 6px;
  white-space: nowrap;
}
.hp-bua-kind-must { background: #fee2e2; color: #991b1b; }
.hp-bua-kind-access { background: #e0e7ff; color: #3730a3; }
.hp-bua-kind-live { background: #d1fae5; color: #065f46; }
.hp-bua-kind-green { background: #ecfccb; color: #3f6212; }
.hp-bua-kind-comfort { background: #fce7f3; color: #9d174d; }
.hp-bua-kind-later { background: #f3f4f6; color: #374151; }
.hp-bua-dec {
  display: inline-block;
  font-size: .78rem;
  font-weight: 700;
  padding: .15rem .4rem;
  border-radius: 8px;
  white-space: nowrap;
}
.hp-bua-dec.is-do { background: #dcfce7; color: #166534; }
.hp-bua-dec.is-skip { background: #ffedd5; color: #9a3412; }
.hp-bua-dec.is-later { background: #f3f4f6; color: #374151; }
.hp-bua-dec.is-off { background: #f8fafc; color: #64748b; }
.hp-bua-checks {
  display: grid;
  gap: .35rem;
  padding: .65rem .75rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, #0f766e 6%, var(--bg));
  margin-bottom: .35rem;
}
.hp-bua-check-item {
  display: flex;
  gap: .45rem;
  align-items: flex-start;
  font-size: .88rem;
  cursor: pointer;
}
.hp-bua-check-item input { margin-top: .2rem; }
.hp-bua-faq { margin-top: .85rem; }
.hp-bua-faq > summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .95rem;
}
.hp-bua-faq details { margin: .35rem 0; }
.hp-bua-faq details summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .9rem;
}
.hp-bua-faq details p { margin: .35rem 0 .15rem; }
.hp-bua-privacy {
  margin-top: .85rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .6rem;
}
.hp-bua-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 4%);
  max-height: min(92vh, 920px);
  overflow: auto;
}
.hp-bua-empty { padding: .5rem 0; }
.hp-bua-triad {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin: .35rem 0 .65rem;
}
.hp-bua-triad-card {
  text-align: center;
  padding: .45rem .35rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-bua-triad-card strong {
  display: block;
  font-size: 1.25rem;
  margin-top: .1rem;
}
.hp-bua-triad-card.is-do {
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
  background: color-mix(in srgb, #16a34a 8%, var(--bg));
}
.hp-bua-triad-card.is-skip {
  border-color: color-mix(in srgb, #ea580c 40%, var(--border));
  background: color-mix(in srgb, #ea580c 8%, var(--bg));
}
.hp-bua-triad-card.is-later {
  border-color: color-mix(in srgb, #64748b 40%, var(--border));
  background: color-mix(in srgb, #64748b 6%, var(--bg));
}
.hp-bua-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .35rem 0 .65rem;
}
.hp-bua-gauge {
  padding: .45rem .5rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg);
}
.hp-bua-gauge strong {
  display: block;
  font-size: 1.05rem;
  margin: .1rem 0;
}
.hp-bua-bar-wrap { margin: .35rem 0 .65rem; }
.hp-bua-bar-label {
  display: flex;
  justify-content: space-between;
  margin-bottom: .25rem;
}
.hp-bua-bar {
  height: .55rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-bua-bar-fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: linear-gradient(90deg, #0f766e, #14b8a6);
  transition: width .2s ease;
}
.hp-bua-bar-fill.is-over,
.hp-bua-bar.is-over .hp-bua-bar-fill {
  background: linear-gradient(90deg, #c2410c, #f97316);
}
.hp-bua-status {
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 30%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 7%, var(--bg));
  margin: .4rem 0 .55rem;
}
.hp-bua-status-title {
  margin: 0 0 .2rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-bua-subh {
  font-size: .9rem;
  margin: .75rem 0 .3rem;
}
.hp-bua-rank,
.hp-bua-actions,
.hp-bua-over-ul,
.hp-bua-tips-ul {
  margin: 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-bua-rank li,
.hp-bua-actions li,
.hp-bua-over-ul li,
.hp-bua-tips-ul li { margin: .18rem 0; }
.hp-bua-plan {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 8rem;
  margin-top: .25rem;
}
.hp-bua-plan-label { display: block; margin-top: .5rem; }
.hp-bua-nonadvice {
  margin-top: .65rem;
  padding-top: .45rem;
  border-top: 1px dashed var(--border);
}
.hp-bua-seed-hint {
  padding: .4rem .5rem;
  border-radius: 8px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
}
.hp-bua-budget-chips,
.hp-bua-buf-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.hp-bua-score {
  display: inline-block;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  font-size: .85rem;
  min-width: 2.4rem;
  color: var(--brand, #0f766e);
}
.hp-bua-check-progress {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .45rem .65rem;
  margin: 0 0 .45rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 92%, var(--brand, #0f766e) 5%);
}
.hp-bua-check-bar {
  flex: 1 1 120px;
  min-width: 100px;
  max-width: 220px;
  height: .45rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
  overflow: hidden;
}
.hp-bua-check-bar-fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: linear-gradient(90deg, #0f766e, #14b8a6);
  transition: width .2s ease;
}
.hp-bua-check-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-left: auto;
}
.hp-bua-check-item.is-critical .hp-bua-crit-tag {
  font-style: normal;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #9a3412;
  background: #ffedd5;
  padding: .05rem .3rem;
  border-radius: 4px;
  margin-left: .2rem;
}
.hp-bua-formel {
  margin: .45rem 0 .55rem;
  padding: .5rem .6rem;
  border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--bg) 90%, var(--brand, #0f766e) 6%);
}
.hp-bua-formel code {
  display: block;
  font-size: .78rem;
  line-height: 1.4;
  margin-top: .2rem;
  white-space: pre-wrap;
  word-break: break-word;
}
.hp-bua-scenarios {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin: .35rem 0 .35rem;
}
@media (max-width: 520px) {
  .hp-bua-scenarios { grid-template-columns: 1fr; }
}
.hp-bua-scen {
  display: flex;
  flex-direction: column;
  gap: .2rem;
  padding: .5rem .45rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg);
  text-align: center;
}
.hp-bua-scen strong {
  font-size: 1.05rem;
}
.hp-bua-scen-tag {
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--muted, #64748b);
}
.hp-bua-scen.is-a {
  border-color: color-mix(in srgb, #dc2626 35%, var(--border));
  background: color-mix(in srgb, #dc2626 6%, var(--bg));
}
.hp-bua-scen.is-b {
  border-color: color-mix(in srgb, #0f766e 40%, var(--border));
  background: color-mix(in srgb, #0f766e 8%, var(--bg));
}
.hp-bua-scen.is-c {
  border-color: color-mix(in srgb, #6366f1 35%, var(--border));
  background: color-mix(in srgb, #6366f1 6%, var(--bg));
}
.hp-bua-scen-note { margin: 0 0 .45rem; }
.hp-bua-buf-box {
  margin: .5rem 0 .55rem;
  padding: .55rem .65rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, #fef3c7 35%, var(--bg));
}
.hp-bua-buf-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .35rem;
}
.hp-bua-buf-grid strong {
  display: block;
  font-size: .95rem;
  margin-top: .1rem;
}
.hp-bua-timeline {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
  margin: .25rem 0 .15rem;
}
@media (max-width: 560px) {
  .hp-bua-timeline { grid-template-columns: 1fr; }
}
.hp-bua-tl-slot {
  padding: .45rem .5rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--bg);
  display: flex;
  flex-direction: column;
  gap: .12rem;
  min-height: 4.5rem;
}
.hp-bua-tl-slot.has-items {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 7%, var(--bg));
}
.hp-bua-tl-label {
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--muted, #64748b);
}
.hp-bua-tl-sum {
  font-size: 1rem;
}
.hp-bua-tl-tip {
  line-height: 1.3;
}
@media (prefers-reduced-motion: reduce) {
  .hp-bua-bar-fill,
  .hp-bua-check-bar-fill { transition: none; }
}

/* —— Parkering & bi-areal (build-parkering-boder · build_park) —— */
.hp-bpk { margin-top: .25rem; }
.hp-bpk-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-bpk-hero-mascot {
  border-radius: 16px;
  grid-row: 1 / span 2;
}
.hp-bpk-hero-copy { min-width: 0; grid-column: 2; }
.hp-bpk-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-bpk-lead-bullets li { margin: .15rem 0; }
.hp-bpk-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  padding: .65rem .85rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 70%, var(--brand, #0f766e) 6%);
}
.hp-bpk-how summary {
  cursor: pointer;
  font-weight: 700;
  font-size: .92rem;
}
.hp-bpk-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .86rem;
}
.hp-bpk-how-list li { margin: .2rem 0; }
.hp-bpk-demos {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin: .5rem 0 .75rem;
}
.hp-bpk-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: .1rem .35rem;
  border-radius: 6px;
  background: #fef3c7;
  color: #92400e;
  margin-left: .15rem;
}
.hp-bpk-demo-note {
  margin: -.35rem 0 .65rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-bpk-demos .chip { cursor: pointer; font-size: .82rem; }
.hp-bpk-demos .chip:hover,
.hp-bpk-demos .chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 12%, var(--bg-elev, #fff));
}
.hp-bpk-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  gap: 1rem 1.25rem;
  align-items: start;
}
@media (max-width: 920px) {
  .hp-bpk-layout { grid-template-columns: 1fr; }
  .hp-bpk-hero { grid-template-columns: 1fr; }
  .hp-bpk-hero-mascot { grid-row: auto; width: 64px; height: 64px; }
  .hp-bpk-hero-copy { grid-column: 1; }
}
.hp-bpk-section {
  font-size: 1.02rem;
  margin: 1.1rem 0 .5rem;
  padding-bottom: .2rem;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-bpk-zone {
  margin: .45rem 0;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  border-radius: 12px;
  background: var(--bg-elev, #fff);
  overflow: hidden;
}
.hp-bpk-zone-sum {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  align-items: center;
  cursor: pointer;
  padding: .55rem .7rem;
  font-weight: 650;
  font-size: .92rem;
  list-style: none;
}
.hp-bpk-zone-sum::-webkit-details-marker { display: none; }
.hp-bpk-zone-meta { font-weight: 500; }
.hp-bpk-cov-list {
  list-style: none;
  margin: 0;
  padding: 0 .55rem .55rem;
}
.hp-bpk-cov-row {
  padding: .4rem 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-bpk-cov-top {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem .65rem;
  align-items: flex-start;
  justify-content: space-between;
}
.hp-bpk-cov-label { flex: 1 1 12rem; min-width: 0; }
.hp-bpk-st-wrap { flex: 0 0 auto; }
.hp-bpk-st {
  min-width: 9.5rem;
  font-size: .85rem;
}
.hp-bpk-rf-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .35rem;
}
.hp-bpk-rf-item {
  display: flex;
  gap: .45rem;
  align-items: flex-start;
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: color-mix(in srgb, var(--bg-elev, #fff) 90%, #fef2f2 10%);
  font-size: .88rem;
  cursor: pointer;
}
.hp-bpk-rf-item input { margin-top: .2rem; }
.hp-bpk-panel {
  position: sticky;
  top: .75rem;
  padding: .85rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--brand, #0f766e) 8%);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 60%, transparent);
}
.hp-bpk-live {
  margin-bottom: .55rem;
  padding: .55rem .6rem;
  border-radius: 12px;
  background: color-mix(in srgb, var(--bg) 70%, var(--bg-elev, #fff));
  border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-bpk-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .78rem;
  opacity: .9;
}
.hp-bpk-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
  margin: .5rem 0;
}
.hp-bpk-gauges .hp-bpk-gauge-plan:not([hidden]) {
  grid-column: 1 / -1;
}
.hp-bpk-gauges .hp-gauge {
  padding: .4rem .45rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: var(--bg-elev, #fff);
  display: grid;
  gap: .1rem;
}
.hp-bpk-gauges .hp-gauge strong {
  font-size: .95rem;
  font-variant-numeric: tabular-nums;
}
.hp-bpk-money,
.hp-bpk-fitbox,
.hp-bpk-readiness,
.hp-bpk-bar-wrap,
.hp-bpk-zones-sum,
.hp-bpk-alerts,
.hp-bpk-next {
  margin: .55rem 0;
  padding: .45rem .5rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  background: var(--bg-elev, #fff);
}
.hp-bpk-ready-title {
  margin: 0 0 .2rem;
  font-weight: 700;
  font-size: .95rem;
}
.hp-bpk-fit-list,
.hp-bpk-zone-sum-list,
.hp-bpk-alert-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .86rem;
}
.hp-bpk-fit-list li,
.hp-bpk-zone-sum-list li,
.hp-bpk-alert-list li { margin: .18rem 0; }
.hp-bpk-bar {
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, var(--bg));
  overflow: hidden;
}
.hp-bpk-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: color-mix(in srgb, var(--brand, #0f766e) 70%, #22c55e);
  transition: width .2s ease;
}
.hp-bpk-fill.is-ok { background: color-mix(in srgb, #16a34a 75%, #22c55e); }
.hp-bpk-fill.is-mid { background: color-mix(in srgb, #f59e0b 70%, #eab308); }
.hp-bpk-fill.is-low { background: color-mix(in srgb, #dc2626 70%, #f97316); }
.hp-bpk-commit-text {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .78rem;
  line-height: 1.4;
  resize: vertical;
  min-height: 7rem;
}
.hp-bpk-privacy {
  margin-top: .85rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .4rem .6rem;
}
.hp-bpk-faq details {
  margin: .35rem 0;
  padding: .35rem .5rem;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  border-radius: 10px;
}
.hp-bpk-faq summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
}
.hp-bpk-seed-hint {
  margin: .4rem 0 0;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, var(--bg-elev, #fff));
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 25%, var(--border));
}
.hp-bpk-profiles,
.hp-bpk-filters {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-bpk-profiles .chip,
.hp-bpk-filters .chip {
  cursor: pointer;
  font-size: .8rem;
}
.hp-bpk-profiles .chip[aria-pressed="true"],
.hp-bpk-filters .chip.is-on,
.hp-bpk-filters .chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 55%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 14%, var(--bg-elev, #fff));
  font-weight: 650;
}
.hp-bpk-filter-n {
  display: inline-block;
  min-width: 1.1em;
  margin-left: .15rem;
  font-variant-numeric: tabular-nums;
  opacity: .85;
}
.hp-bpk-formula-line {
  margin: .35rem 0 .65rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 12%);
  font-size: .84rem;
}
.hp-bpk-formula {
  margin: .55rem 0;
  padding: .45rem .5rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  background: var(--bg-elev, #fff);
}
.hp-bpk-cov-row.is-st-bad {
  background: color-mix(in srgb, #fef2f2 75%, transparent);
  border-radius: 8px;
}
.hp-bpk-cov-row.is-st-warn {
  background: color-mix(in srgb, #fffbeb 80%, transparent);
  border-radius: 8px;
}
.hp-bpk-cov-row.is-st-ok {
  background: color-mix(in srgb, #ecfdf5 55%, transparent);
  border-radius: 8px;
}
.hp-bpk-cov-row.is-flash {
  outline: 2px solid color-mix(in srgb, var(--brand, #0f766e) 70%, #22c55e);
  outline-offset: 2px;
  transition: outline-color .3s ease;
}
.hp-bpk-panel.is-temp-low {
  border-color: color-mix(in srgb, #16a34a 45%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, #16a34a 18%, transparent);
}
.hp-bpk-panel.is-temp-mid {
  border-color: color-mix(in srgb, #f59e0b 50%, var(--border));
}
.hp-bpk-panel.is-temp-high {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, #dc2626 12%, transparent);
}
.hp-bpk-whatif {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: 0 0 .45rem;
}
.hp-bpk-whatif .chip { cursor: pointer; font-size: .8rem; }
.hp-bpk-whatif .chip[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 55%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 14%, var(--bg-elev, #fff));
  font-weight: 650;
}
.hp-bpk-scale {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-bpk-scale .chip { cursor: pointer; font-size: .8rem; }
.hp-bpk-delta {
  margin: -.25rem 0 .65rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, #fef3c7 12%);
  border: 1px dashed color-mix(in srgb, #f59e0b 35%, var(--border));
  font-size: .82rem;
}
.hp-bpk-plan-cover {
  margin: -.15rem 0 .65rem;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: color-mix(in srgb, var(--bg-elev, #fff) 90%, #e0f2fe 10%);
  font-size: .84rem;
}
.hp-bpk-plan-cover.is-ok {
  background: color-mix(in srgb, #ecfdf5 70%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #16a34a 35%, var(--border));
}
.hp-bpk-plan-cover.is-bad {
  background: color-mix(in srgb, #fef2f2 75%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #dc2626 30%, var(--border));
}
.hp-bpk-gauge-plan.is-ok strong { color: #15803d; }
.hp-bpk-gauge-plan.is-bad strong { color: #b91c1c; }
.hp-bpk-fitchips {
  margin: .45rem 0 .55rem;
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  background: var(--bg-elev, #fff);
}
.hp-bpk-fitchips-label {
  display: block;
  margin-bottom: .3rem;
}
.hp-bpk-fitchips-row {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
}
.hp-bpk-fitchip {
  display: inline-block;
  font-size: .75rem;
  font-weight: 650;
  padding: .2rem .45rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: #f1f5f9;
  color: #334155;
}
.hp-bpk-fitchip.is-ok {
  background: color-mix(in srgb, #dcfce7 80%, #fff);
  border-color: color-mix(in srgb, #16a34a 40%, var(--border));
  color: #166534;
}
.hp-bpk-fitchip.is-partial {
  background: color-mix(in srgb, #fef3c7 80%, #fff);
  border-color: color-mix(in srgb, #f59e0b 40%, var(--border));
  color: #92400e;
}
.hp-bpk-fitchip.is-gap {
  background: color-mix(in srgb, #fee2e2 80%, #fff);
  border-color: color-mix(in srgb, #dc2626 35%, var(--border));
  color: #991b1b;
}
.hp-bpk-fitchip.is-na {
  opacity: .75;
  font-weight: 500;
}
.hp-bpk-costbar {
  display: flex;
  height: 10px;
  border-radius: 999px;
  overflow: hidden;
  margin: 0 0 .45rem;
  background: color-mix(in srgb, var(--border) 70%, var(--bg));
}
.hp-bpk-costseg {
  display: block;
  height: 100%;
  min-width: 0;
  transition: width .2s ease;
}
.hp-bpk-costseg.is-park { background: #0f766e; }
.hp-bpk-costseg.is-charge { background: #2563eb; }
.hp-bpk-costseg.is-bod { background: #d97706; }
.hp-bpk-costseg.is-bike { background: #7c3aed; }
.hp-bpk-costseg.is-guest { background: #64748b; }
@media (prefers-reduced-motion: reduce) {
  .hp-bpk-costseg { transition: none; }
}
.hp-bpk-hull {
  margin: .55rem 0;
  padding: .45rem .5rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
  background: var(--bg-elev, #fff);
}
.hp-bpk-hull-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .25rem;
}
.hp-bpk-hull-jump {
  display: block;
  width: 100%;
  text-align: left;
  font: inherit;
  font-size: .84rem;
  padding: .35rem .5rem;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
  background: color-mix(in srgb, var(--bg) 70%, var(--bg-elev, #fff));
  cursor: pointer;
  color: inherit;
}
.hp-bpk-hull-jump:hover,
.hp-bpk-hull-jump:focus-visible {
  border-color: color-mix(in srgb, var(--brand, #0f766e) 50%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 10%, var(--bg-elev, #fff));
  outline: none;
}
.hp-bpk-sticky {
  position: sticky;
  bottom: 0;
  z-index: 20;
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .55rem;
  align-items: center;
  margin-top: .85rem;
  padding: .55rem .7rem;
  border-radius: 12px 12px 0 0;
  border: 1px solid var(--border);
  border-bottom: none;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 12%);
  box-shadow: 0 -4px 16px color-mix(in srgb, #000 8%, transparent);
  font-size: .88rem;
}
.hp-bpk-sticky strong { font-variant-numeric: tabular-nums; }
@media (min-width: 921px) {
  .hp-bpk-sticky { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-bpk-fill { transition: none; }
  .hp-bpk-cov-row.is-flash { transition: none; }
}

/* —— Innflytting nybygg (build-innflytting-nybygg · build_movein) ——
   Reuses .hp-ot layout; extras: brukstillatelse, rom-foto, mangelliste-rader,
   temperatur, 1-års husk, sticky bar. */
.hp-bim .hp-ot-hero-mascot { border-radius: 16px; }
.hp-bim-bruk-box {
  margin: .55rem 0;
  padding: .55rem .7rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 80%, var(--brand, #0f766e) 8%);
}
.hp-bim-bruk-box.is-warn {
  background: #fffbeb;
  border-color: #fde68a;
}
.hp-bim-bruk-box.is-ok {
  background: color-mix(in srgb, #ecfdf5 80%, var(--bg-elev, #fff));
  border-color: color-mix(in srgb, #34d399 40%, var(--border));
}
.hp-bim-1y {
  margin: .45rem 0;
  padding: .5rem .65rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, #d97706 30%, var(--border));
  background: color-mix(in srgb, #fffbeb 70%, var(--bg-elev, #fff));
}
.hp-bim-temp {
  display: inline-block;
  margin-right: .4rem;
  padding: .12rem .45rem;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  vertical-align: middle;
  background: #e2e8f0;
  color: #334155;
}
.hp-bim-temp.is-klar {
  background: #d1fae5;
  color: #065f46;
}
.hp-bim-temp.is-sjekk {
  background: #fef3c7;
  color: #92400e;
}
.hp-bim-temp.is-mangler {
  background: #fee2e2;
  color: #991b1b;
}
.hp-bim-formula {
  margin: .35rem 0 0;
  font-size: .75rem;
  line-height: 1.35;
}
.hp-bim-foto {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr));
  gap: .35rem .55rem;
}
.hp-bim-foto-item {
  margin: 0;
}
.hp-bim-foto.is-flash,
.hp-bim-mg.is-flash {
  outline: 2px solid var(--brand, #0f766e);
  outline-offset: 3px;
  border-radius: 10px;
  transition: outline-color .2s ease;
}
.hp-bim-mg {
  margin: .35rem 0 .55rem;
  padding: .65rem .75rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--brand, #0f766e) 6%);
}
.hp-bim-mg-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem .65rem;
  margin-bottom: .55rem;
}
@media (max-width: 560px) {
  .hp-bim-mg-form { grid-template-columns: 1fr; }
}
.hp-bim-mg-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .4rem;
}
.hp-bim-mg-item {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: .35rem .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
}
.hp-bim-mg-item.is-open {
  border-color: color-mix(in srgb, #d97706 40%, var(--border));
}
.hp-bim-mg-item.is-high {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #fef2f2 65%, var(--bg-elev, #fff));
}
.hp-bim-mg-item-main {
  flex: 1 1 12rem;
  min-width: 0;
  font-size: .88rem;
}
.hp-bim-mg-item-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
}
.hp-bim .hp-ot-key-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .3rem;
}
.hp-bim .hp-ot-key-chip {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  cursor: pointer;
  user-select: none;
}
.hp-bim .hp-ot-key-chip input {
  margin: 0;
}
.hp-bim .hp-ot-span-2 {
  grid-column: 1 / -1;
}
.hp-bim .hp-ot-privacy {
  margin-top: .75rem;
  padding: .55rem .75rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}
.hp-bim .hp-ot-privacy summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
}
.hp-bim .hp-ot-phase-suggest [data-bim-phase-suggest-text] {
  flex: 1 1 12rem;
  min-width: 0;
}
.hp-bim [data-bim-seed-hint]:not([hidden]) {
  margin: 0 0 .55rem;
  padding: .35rem .55rem;
  border-radius: 8px;
  border: 1px dashed color-mix(in srgb, var(--brand, #0f766e) 35%, var(--border));
  background: color-mix(in srgb, var(--brand, #0f766e) 8%, transparent);
}
.hp-bim-sticky {
  position: sticky;
  bottom: 0;
  z-index: 20;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .45rem .65rem;
  margin-top: 1rem;
  padding: .55rem .75rem;
  border-radius: 12px 12px 0 0;
  border: 1px solid var(--border);
  border-bottom: 0;
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--brand, #0f766e) 8%);
  box-shadow: 0 -4px 16px color-mix(in srgb, #0f172a 12%, transparent);
  font-size: .85rem;
  font-weight: 600;
}
.hp-bim-sticky [data-bim-sticky-temp].is-klar { color: #065f46; }
.hp-bim-sticky [data-bim-sticky-temp].is-sjekk { color: #92400e; }
.hp-bim-sticky [data-bim-sticky-temp].is-mangler { color: #991b1b; }
@media (min-width: 900px) {
  .hp-bim-sticky { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-bim-foto.is-flash,
  .hp-bim-mg.is-flash { transition: none; }
}


/* —— Garanti & reklamasjon (build_garanti / hp-bgr) — reuses .hp-rqc —— */
.hp-bgr .hp-rqc-countdown {
  display: grid;
  gap: .1rem;
  padding: .55rem .65rem;
  border-radius: 10px;
  background: color-mix(in srgb, var(--bg-elev, #fff) 88%, var(--brand, #0f766e) 12%);
  border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
}
.hp-bgr .hp-rqc-countdown strong {
  font-size: 1.05rem;
  font-weight: 700;
}
.hp-bgr .hp-rqc-row.is-st-avvik,
.hp-bgr .hp-rqc-row.is-st-mangler {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #fef2f2 70%, transparent);
}
.hp-bgr .hp-rqc-row.is-hopp {
  outline: 2px solid var(--brand, #0f766e);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand, #0f766e) 18%, transparent);
}
.hp-bgr-date-quick {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  margin-top: .3rem;
}
.hp-bgr-date-quick .chip {
  font-size: .72rem;
  padding: .15rem .45rem;
}
.hp-bgr-seed-row {
  align-items: center;
}
.hp-bgr-cl-presets {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  align-items: center;
  margin: 0 0 .55rem;
}
.hp-bgr-cl-presets .chip {
  font-size: .75rem;
}
.hp-bgr [data-bgr-cl-form].is-editing {
  border: 1px solid color-mix(in srgb, var(--brand, #0f766e) 40%, var(--border));
  border-radius: 12px;
  padding: .55rem .65rem;
  background: color-mix(in srgb, var(--brand, #0f766e) 6%, var(--bg-elev, #fff));
}
.hp-bgr .hp-rqc-av-item.is-overdue {
  border-color: color-mix(in srgb, #dc2626 50%, var(--border));
  background: color-mix(in srgb, #fef2f2 75%, transparent);
}
.hp-bgr .hp-rqc-av-item.is-editing {
  outline: 2px dashed color-mix(in srgb, var(--brand, #0f766e) 55%, transparent);
}
.hp-bgr .hp-rqc-av-badge.is-overdue-badge {
  background: #fee2e2;
  color: #991b1b;
  font-weight: 700;
}
.hp-bgr-countdown-grid {
  display: grid;
  gap: .45rem;
  margin: .55rem 0;
}
@media (min-width: 520px) {
  .hp-bgr-countdown-grid {
    grid-template-columns: 1fr 1fr;
  }
  .hp-bgr-countdown-grid > :last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
}
.hp-bgr-timeline {
  margin: .55rem 0 .75rem;
  padding: .55rem .65rem .7rem;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 90%, var(--brand, #0f766e) 8%);
}
.hp-bgr-rail {
  position: relative;
  padding: 1.35rem 0 .15rem;
}
.hp-bgr-rail-track {
  position: relative;
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border) 80%, transparent);
  overflow: hidden;
}
.hp-bgr-rail-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--brand, #0f766e) 70%, #34d399),
    var(--brand, #0f766e)
  );
  transition: width .25s ease;
}
.hp-bgr-rail-marks {
  position: relative;
  min-height: 2.4rem;
  margin-top: .15rem;
  font-size: .72rem;
  color: var(--muted, #5b6470);
}
.hp-bgr-mark {
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  text-align: center;
  white-space: nowrap;
  max-width: 4.5rem;
}
.hp-bgr-mark i {
  display: block;
  width: 9px;
  height: 9px;
  margin: 0 auto .15rem;
  border-radius: 50%;
  background: var(--border);
  border: 2px solid var(--bg-elev, #fff);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-bgr-mark.is-past i {
  background: var(--brand, #0f766e);
}
.hp-bgr-mark.is-1y i {
  background: #d97706;
}
.hp-bgr-mark.is-end i {
  background: #7c3aed;
}
.hp-bgr-mark em {
  font-style: normal;
  font-size: .68rem;
  line-height: 1.1;
  display: block;
}
.hp-bgr-subject-wrap {
  display: grid;
  gap: .2rem;
  margin-bottom: .4rem;
}
.hp-bgr-subject {
  width: 100%;
  font: inherit;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, #f8fafc);
}
@media (prefers-reduced-motion: reduce) {
  .hp-bgr-rail-fill { transition: none; }
  .hp-bgr .hp-rqc-row.is-hopp { box-shadow: none; }
}

/* —— Kontantstrøm bygg (build-kontantstrom-bygg · build_cashflow) —— */
.hp-bcf { margin-top: .25rem; }
.hp-bcf-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .75rem 1rem;
  align-items: start;
  margin-bottom: .85rem;
}
.hp-bcf-hero-mascot {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-bcf-hero-copy { min-width: 0; }
.hp-bcf-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
  color: var(--muted, #5b6470);
}
.hp-bcf-lead-bullets li { margin: .2rem 0; }
.hp-bcf-how {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .45rem .7rem .55rem;
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
}
.hp-bcf-how summary {
  cursor: pointer;
  font-weight: 650;
  font-size: .92rem;
}
.hp-bcf-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .84rem;
}
.hp-bcf-how-list li { margin: .2rem 0; }
.hp-bcf-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: .1rem .4rem;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--brand) 40%, var(--border));
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  color: var(--brand);
  vertical-align: middle;
}
.hp-bcf-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .45rem;
  margin: 0 0 .65rem;
}
.hp-bcf-demos .chip {
  font-size: .82rem;
  padding: .28rem .65rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-bcf-demos .chip:hover,
.hp-bcf-demos .chip.active,
.hp-bcf-demos .chip[aria-pressed="true"] {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
}
.hp-bcf-demos .chip-ghost { opacity: .75; font-weight: 500; }
.hp-bcf-demo-note { margin: 0 0 .65rem; }
.hp-bcf-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.95fr);
  gap: 1.15rem;
  align-items: start;
}
@media (max-width: 820px) {
  .hp-bcf-layout {
    grid-template-columns: 1fr;
    display: flex;
    flex-direction: column;
  }
  .hp-bcf-panel { order: -1; }
  .hp-bcf-hero { grid-template-columns: 1fr; }
  .hp-bcf-hero-mascot { width: 56px; height: 56px; }
}
.hp-bcf-section {
  margin: 1rem 0 .45rem;
  font-size: .95rem;
  letter-spacing: -0.01em;
}
.hp-bcf-section:first-child { margin-top: 0; }
.hp-bcf-packs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .4rem;
  margin: 0 0 .55rem;
}
.hp-bcf-packs .chip {
  font-size: .78rem;
  padding: .2rem .55rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
}
.hp-bcf-packs .chip:hover {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 12%, var(--bg-elev));
  font-weight: 650;
}
.hp-bcf-rows {
  display: flex;
  flex-direction: column;
  gap: .55rem;
}
.hp-bcf-row {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .55rem .7rem .65rem;
  background: var(--bg-elev, #fff);
}
.hp-bcf-row-in {
  border-color: color-mix(in srgb, var(--brand) 28%, var(--border));
  background: color-mix(in srgb, var(--brand) 5%, var(--bg-elev, #fff));
}
.hp-bcf-row-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .5rem;
  margin-bottom: .4rem;
}
.hp-bcf-row-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 700;
  background: color-mix(in srgb, var(--brand) 14%, var(--bg));
  color: var(--brand);
}
.hp-bcf-row-label-wrap { flex: 1; min-width: 10rem; }
.hp-bcf-row-label-wrap input {
  width: 100%;
  font-weight: 600;
  font-size: .9rem;
  border: 0;
  border-bottom: 1px dashed var(--border);
  background: transparent;
  padding: .15rem 0;
}
.hp-bcf-row-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .45rem .55rem;
}
@media (max-width: 520px) {
  .hp-bcf-row-fields { grid-template-columns: 1fr 1fr; }
}
.hp-bcf-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: .85rem .9rem 1rem;
  background: var(--bg-elev, #fff);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--border) 60%, transparent);
}
.hp-bcf-live {
  margin-bottom: .75rem;
  padding-bottom: .65rem;
  border-bottom: 1px solid var(--border);
}
.hp-bcf-live .hp-bid-num {
  font-size: 1.55rem;
  font-weight: 750;
  letter-spacing: -0.02em;
  line-height: 1.15;
}
.hp-bcf-status { margin: .35rem 0 0; font-weight: 600; }
.hp-bcf-status.is-gap { color: #b45309; }
.hp-bcf-status.is-tight { color: #a16207; }
.hp-bcf-status.is-ok { color: color-mix(in srgb, var(--brand) 70%, #166534); }
.hp-bcf-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .75rem !important;
  opacity: .85;
}
.hp-bcf-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: 0 0 .75rem;
}
.hp-bcf-gauges .hp-gauge {
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
}
.hp-bcf-gauges .hp-gauge strong {
  display: block;
  font-size: .95rem;
  margin-top: .1rem;
}
.hp-bcf-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .84rem;
  margin-bottom: .65rem;
}
.hp-bcf-table th {
  text-align: left;
  font-weight: 500;
  color: var(--muted, #5b6470);
  padding: .2rem .35rem .2rem 0;
  vertical-align: top;
}
.hp-bcf-table td {
  text-align: right;
  font-variant-numeric: tabular-nums;
  padding: .2rem 0 .2rem .35rem;
}
.hp-bcf-bars {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: 88px;
  padding: .35rem .2rem .15rem;
  margin-bottom: .55rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 55%, var(--bg-elev, #fff));
  overflow-x: auto;
}
.hp-bcf-bar-cell {
  flex: 1 1 0;
  min-width: 10px;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 2px;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.hp-bcf-bar-cell.is-on .hp-bcf-bar {
  outline: 2px solid var(--brand);
  outline-offset: 1px;
}
.hp-bcf-bar-cell:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
  border-radius: 4px;
}
.hp-bcf-bar {
  width: 100%;
  max-width: 14px;
  border-radius: 3px 3px 1px 1px;
  min-height: 3px;
}
.hp-bcf-bar-pos {
  background: color-mix(in srgb, var(--brand, #0f766e) 75%, #34d399);
}
.hp-bcf-bar-neg {
  background: color-mix(in srgb, #dc2626 80%, #f97316);
}
.hp-bcf-bar-zero {
  background: var(--border);
}
.hp-bcf-bar-lbl {
  font-size: .58rem;
  color: var(--muted, #5b6470);
  line-height: 1;
}
.hp-bcf-table-scroll {
  max-height: 280px;
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 10px;
  margin-bottom: .65rem;
}
.hp-bcf-mtable {
  width: 100%;
  border-collapse: collapse;
  font-size: .8rem;
  font-variant-numeric: tabular-nums;
}
.hp-bcf-mtable th,
.hp-bcf-mtable td {
  padding: .28rem .4rem;
  text-align: right;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
}
.hp-bcf-mtable th:first-child,
.hp-bcf-mtable td:first-child {
  text-align: left;
  position: sticky;
  left: 0;
  background: var(--bg-elev, #fff);
}
.hp-bcf-mtable thead th {
  position: sticky;
  top: 0;
  background: color-mix(in srgb, var(--bg) 40%, var(--bg-elev, #fff));
  z-index: 1;
  font-weight: 600;
  text-align: right;
}
.hp-bcf-mtable thead th:first-child { text-align: left; }
.hp-bcf-tr-neg {
  background: color-mix(in srgb, #fef2f2 70%, var(--bg-elev, #fff));
}
.hp-bcf-neg { color: #b91c1c; }
.hp-bcf-pos { color: color-mix(in srgb, var(--brand) 50%, #166534); }
.hp-bcf-tip-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  color: var(--muted, #5b6470);
}
.hp-bcf-tip-list li { margin: .2rem 0; }
.hp-bcf-faq,
.hp-bcf-privacy {
  margin-top: .75rem;
  padding: .55rem .75rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}
.hp-bcf-faq > summary,
.hp-bcf-privacy summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
}
.hp-bcf-faq details {
  margin-top: .45rem;
  padding-top: .35rem;
  border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
}
.hp-bcf-faq details summary {
  font-weight: 550;
  font-size: .86rem;
}
.hp-bcf-empty {
  padding: .5rem 0;
}
.hp-bcf-formula {
  margin: .4rem 0 0;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px dashed var(--border);
  background: color-mix(in srgb, var(--bg) 55%, var(--bg-elev, #fff));
  font-size: .78rem !important;
  line-height: 1.35;
}
.hp-bcf-f-label {
  display: inline-block;
  font-weight: 700;
  font-size: .68rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-right: .25rem;
  color: var(--brand, #0f766e);
}
.hp-bcf-scen-wrap { margin: 0 0 .75rem; }
.hp-bcf-scens {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .35rem;
}
@media (min-width: 520px) {
  .hp-bcf-scens { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.hp-bcf-scen {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .1rem;
  text-align: left;
  padding: .4rem .5rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--bg-elev, #fff);
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.hp-bcf-scen:hover {
  border-color: var(--brand);
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev, #fff));
}
.hp-bcf-scen.is-gap {
  border-color: color-mix(in srgb, #dc2626 45%, var(--border));
  background: color-mix(in srgb, #fef2f2 70%, var(--bg-elev, #fff));
}
.hp-bcf-scen.is-tight {
  border-color: color-mix(in srgb, #d97706 40%, var(--border));
  background: color-mix(in srgb, #fffbeb 70%, var(--bg-elev, #fff));
}
.hp-bcf-scen.is-ok {
  border-color: color-mix(in srgb, var(--brand) 35%, var(--border));
}
.hp-bcf-scen-label {
  font-size: .72rem;
  font-weight: 650;
  color: var(--muted, #5b6470);
}
.hp-bcf-scen-val {
  font-size: .95rem;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.hp-bcf-scen-sub {
  font-size: .68rem;
  color: var(--muted, #5b6470);
}
.hp-bcf-fix-row {
  margin: .65rem 0 .35rem;
  padding: .55rem .7rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, #d97706 35%, var(--border));
  background: color-mix(in srgb, #fffbeb 65%, var(--bg-elev, #fff));
}
.hp-bcf-month-detail {
  margin: .35rem 0 0;
  padding: .4rem .55rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
  font-size: .78rem !important;
  line-height: 1.4;
}
.hp-bcf-mtable tbody tr[data-bcf-row-m] { cursor: pointer; }
.hp-bcf-tr-on {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  outline-offset: -2px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
@media (prefers-reduced-motion: reduce) {
  .hp-bcf-bar { transition: none; }
}

.hp-bcf-pct-badge {
  display: inline-block;
  margin-left: .35rem;
  font-size: .72rem;
  font-weight: 700;
  padding: .08rem .4rem;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 50%, var(--bg-elev, #fff));
  color: var(--muted, #5b6470);
  vertical-align: middle;
}
.hp-bcf-pct-badge.is-ok {
  border-color: color-mix(in srgb, var(--brand) 40%, var(--border));
  color: color-mix(in srgb, var(--brand) 70%, #166534);
  background: color-mix(in srgb, var(--brand) 10%, var(--bg-elev, #fff));
}
.hp-bcf-pct-badge.is-warn {
  border-color: color-mix(in srgb, #d97706 45%, var(--border));
  color: #a16207;
  background: color-mix(in srgb, #fffbeb 70%, var(--bg-elev, #fff));
}
.hp-bcf-upsell {
  margin: .35rem 0 .55rem;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--brand) 30%, var(--border));
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev, #fff));
}
.hp-bcf-omvendt {
  margin: 0 0 .75rem;
  padding: .5rem .65rem;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--border));
  background: color-mix(in srgb, var(--brand) 6%, var(--bg-elev, #fff));
}
.hp-bcf-ek-wrap { margin: 0 0 .75rem; }
.hp-bcf-ek-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .84rem;
}
.hp-bcf-ek-list li { margin: .15rem 0; }
.hp-bcf-inout {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: 72px;
  padding: .35rem .2rem .15rem;
  margin-bottom: .45rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 55%, var(--bg-elev, #fff));
  overflow-x: auto;
}
.hp-bcf-inout-cell {
  flex: 1 1 0;
  min-width: 10px;
  max-width: 28px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 2px;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.hp-bcf-inout-cell.is-on {
  outline: 2px solid color-mix(in srgb, var(--brand) 55%, transparent);
  outline-offset: -1px;
  border-radius: 4px;
}
.hp-bcf-inout-pair {
  display: flex;
  align-items: flex-end;
  gap: 1px;
  width: 100%;
  height: calc(100% - 1rem);
}
.hp-bcf-inout-in,
.hp-bcf-inout-out {
  flex: 1 1 0;
  min-height: 2px;
  border-radius: 2px 2px 0 0;
}
.hp-bcf-inout-in {
  background: color-mix(in srgb, var(--brand) 65%, #86efac);
}
.hp-bcf-inout-out {
  background: color-mix(in srgb, #dc2626 55%, #fca5a5);
}
.hp-bcf-sticky {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  padding: .55rem .85rem;
  border-top: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg-elev, #fff) 92%, var(--brand));
  box-shadow: 0 -4px 18px color-mix(in srgb, #000 12%, transparent);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
@media (max-width: 820px) {
  .hp-bcf-sticky:not([hidden]) {
    display: flex;
  }
  .hp-bcf { padding-bottom: 3.5rem; }
}
.hp-bcf-sticky [data-bcf-sticky-min] {
  font-size: .95rem;
}

/* Runway chips + plan integrity + now-marker (build-kontantstrom-bygg) */
.hp-bcf-runway-wrap {
  margin: 0 0 .75rem;
}
.hp-bcf-runway {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  align-items: center;
}
.hp-bcf-runway-chip {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  min-width: 1.35rem;
  padding: .15rem .1rem;
  border: 0;
  background: transparent;
  cursor: pointer;
  font: inherit;
  color: inherit;
  border-radius: 6px;
}
.hp-bcf-runway-chip:hover,
.hp-bcf-runway-chip:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--brand) 50%, transparent);
  outline-offset: 1px;
}
.hp-bcf-runway-dot {
  width: .72rem;
  height: .72rem;
  border-radius: 999px;
  background: var(--border);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #000 8%, transparent);
}
.hp-bcf-runway-chip.is-ok .hp-bcf-runway-dot {
  background: color-mix(in srgb, var(--brand, #0f766e) 70%, #34d399);
}
.hp-bcf-runway-chip.is-tight .hp-bcf-runway-dot {
  background: color-mix(in srgb, #d97706 75%, #fde68a);
}
.hp-bcf-runway-chip.is-gap .hp-bcf-runway-dot {
  background: color-mix(in srgb, #dc2626 80%, #fca5a5);
}
.hp-bcf-runway-chip.is-now .hp-bcf-runway-dot {
  outline: 2px solid var(--brand, #0f766e);
  outline-offset: 2px;
}
.hp-bcf-runway-chip.is-min .hp-bcf-runway-n {
  font-weight: 800;
  color: #b91c1c;
}
.hp-bcf-runway-n {
  font-size: .58rem;
  line-height: 1;
  color: var(--muted, #5b6470);
  font-variant-numeric: tabular-nums;
}
.hp-bcf-integrity {
  margin: 0 0 .75rem;
  padding: .45rem .6rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 45%, var(--bg-elev, #fff));
  font-size: .8rem;
}
.hp-bcf-integrity.is-warn {
  border-color: color-mix(in srgb, #d97706 40%, var(--border));
  background: color-mix(in srgb, #fffbeb 70%, var(--bg-elev, #fff));
}
.hp-bcf-integrity.is-ok {
  border-color: color-mix(in srgb, var(--brand) 30%, var(--border));
}
.hp-bcf-bar-cell.is-now .hp-bcf-bar-lbl,
.hp-bcf-tr-now td:first-child {
  font-weight: 800;
  color: var(--brand, #0f766e);
}
.hp-bcf-tr-now {
  background: color-mix(in srgb, var(--brand) 8%, var(--bg-elev, #fff));
}
.hp-bcf-empty .btn-row { justify-content: flex-start; }

/* —— Leverandør-matrise (build_matrix / build-leverandor-matrise) —— */
.hp-blm-hero {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .85rem 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.hp-blm-hero-mascot {
  border-radius: 12px;
  background: var(--surface-2, #f4f6f8);
}
.hp-blm-hero-copy { min-width: 0; }
.hp-blm-lead-bullets {
  margin: .25rem 0 0;
  padding-left: 1.15rem;
  font-size: .9rem;
}
.hp-blm-lead-bullets li { margin: .2rem 0; }
.hp-blm-how {
  grid-column: 1 / -1;
  margin-top: .35rem;
  border: 1px solid var(--border, #e2e6ea);
  border-radius: 10px;
  padding: .55rem .75rem;
  background: var(--surface, #fff);
}
.hp-blm-how summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .92rem;
}
.hp-blm-how-list {
  margin: .4rem 0 0;
  padding-left: 1.15rem;
  font-size: .88rem;
}
.hp-blm-how-list li { margin: .2rem 0; }
.hp-blm-demo-badge {
  display: inline-block;
  font-size: .72rem;
  font-weight: 650;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: .1rem .4rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #92400e;
  vertical-align: middle;
}
.hp-blm-demos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .5rem;
  margin: 0 0 .85rem;
}
.hp-blm-demos .chip {
  cursor: pointer;
  border: 1px solid var(--border, #d0d5dd);
  background: var(--surface, #fff);
  border-radius: 999px;
  padding: .28rem .7rem;
  font-size: .85rem;
}
.hp-blm-demos .chip:hover,
.hp-blm-demos .chip.active,
.hp-blm-demos .chip[aria-pressed="true"] {
  border-color: var(--accent, #0d9488);
  background: color-mix(in srgb, var(--accent, #0d9488) 12%, white);
}
.hp-blm-demo-note {
  margin: -.35rem 0 .85rem;
  padding: .45rem .65rem;
  border-radius: 8px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}
.hp-blm-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .9fr);
  gap: 1.1rem;
  align-items: start;
}
.hp-blm-section {
  margin: 1.15rem 0 .55rem;
  font-size: 1.05rem;
}
.hp-blm-main .hp-blm-section:first-child { margin-top: 0; }
.hp-blm-quotes {
  display: grid;
  gap: .85rem;
}
.hp-blm-quote {
  border: 1px solid var(--border, #e2e6ea);
  border-radius: 12px;
  padding: .75rem .85rem;
  background: var(--surface, #fff);
}
.hp-blm-quote.is-off {
  opacity: .55;
}
.hp-blm-quote-on {
  display: flex;
  align-items: center;
  gap: .45rem;
  font-weight: 600;
  margin-bottom: .55rem;
  cursor: pointer;
}
.hp-blm-checkline {
  display: flex;
  align-items: center;
  gap: .4rem;
  margin-top: 1.35rem;
  cursor: pointer;
  font-size: .9rem;
}
.hp-blm-dims {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: .45rem .65rem;
  margin: .55rem 0 .35rem;
}
.hp-blm-dim {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .15rem .4rem;
  align-items: center;
  font-size: .82rem;
}
.hp-blm-dim input[type="range"] { width: 100%; grid-column: 1 / -1; }
.hp-blm-score-field {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .25rem .5rem;
  align-items: end;
}
.hp-blm-score-label { grid-column: 1 / -1; }
.hp-blm-score-val { font-variant-numeric: tabular-nums; min-width: 2.2rem; text-align: right; }
.hp-blm-eff-live {
  margin: .25rem 0 0;
  font-variant-numeric: tabular-nums;
}
.hp-blm-card-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  margin-top: .55rem;
}
.hp-blm-card-actions .chip {
  cursor: pointer;
  border: 1px solid var(--border, #d0d5dd);
  background: var(--surface, #fff);
  border-radius: 999px;
  padding: .22rem .55rem;
  font-size: .8rem;
}
.hp-blm-card-actions .chip.active,
.hp-blm-card-actions .chip[aria-pressed="true"] {
  border-color: var(--accent, #0d9488);
  background: color-mix(in srgb, var(--accent, #0d9488) 14%, white);
  font-weight: 600;
}
.hp-blm-fav-pill {
  display: inline-block;
  font-size: .72rem;
  font-weight: 650;
  padding: .12rem .4rem;
  border-radius: 999px;
  background: #ecfdf5;
  color: #047857;
  border: 1px solid #a7f3d0;
}
.hp-blm-scope-progress {
  margin: 0 0 .45rem;
}
.hp-blm-scope-progress .hp-blm-bar-wrap { margin: .15rem 0 .2rem; }
.hp-blm-fill-scope {
  background: linear-gradient(90deg, #6366f1, #818cf8);
}
.hp-blm-flag-count {
  font-weight: 600;
  color: #b45309;
}
.hp-blm-next-row {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
}
.hp-blm-next-row input { flex: 1 1 12rem; min-width: 0; }
.hp-blm-scope-list,
.hp-blm-flags {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: .35rem;
}
.hp-blm-scope-list li label,
.hp-blm-flags li label {
  display: flex;
  align-items: flex-start;
  gap: .4rem;
  cursor: pointer;
  font-size: .9rem;
}
.hp-blm-panel {
  position: sticky;
  top: .75rem;
  border: 1px solid var(--border, #e2e6ea);
  border-radius: 14px;
  padding: .9rem;
  background: var(--surface, #fff);
  box-shadow: 0 1px 3px rgba(0,0,0,.04);
}
.hp-blm-live {
  margin-bottom: .65rem;
}
.hp-blm-live .hp-bid-num {
  font-size: 1.55rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
}
.hp-blm-nonadvice-fixed {
  margin: .25rem 0 0;
  font-size: .78rem;
}
.hp-blm-clarity {
  margin: .45rem 0 .55rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid var(--border, #e8ecf0);
  background: var(--surface-2, #f8fafb);
}
.hp-blm-clarity.is-low { border-color: #fecaca; background: #fef2f2; }
.hp-blm-clarity.is-mid { border-color: #fde68a; background: #fffbeb; }
.hp-blm-clarity.is-high { border-color: #a7f3d0; background: #ecfdf5; }
.hp-blm-tempbar {
  height: .55rem;
  border-radius: 999px;
  background: #e5e7eb;
  overflow: hidden;
  margin: .2rem 0 .25rem;
}
.hp-blm-tempfill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #f59e0b, #10b981);
  max-width: 100%;
  transition: width .2s ease;
}
.hp-blm-clarity.is-low .hp-blm-tempfill {
  background: linear-gradient(90deg, #ef4444, #f97316);
}
.hp-blm-clarity.is-mid .hp-blm-tempfill {
  background: linear-gradient(90deg, #f59e0b, #eab308);
}
.hp-blm-clarity.is-high .hp-blm-tempfill {
  background: linear-gradient(90deg, #14b8a6, #10b981);
}
.hp-blm-gauges {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  margin: .55rem 0 .7rem;
}
.hp-blm-gauges .hp-gauge {
  border: 1px solid var(--border, #e8ecf0);
  border-radius: 10px;
  padding: .4rem .5rem;
  background: var(--surface-2, #f8fafb);
}
.hp-blm-gauges .hp-gauge strong {
  display: block;
  font-size: .92rem;
  font-variant-numeric: tabular-nums;
}
.hp-blm-bar-wrap { margin: .25rem 0 .35rem; }
.hp-blm-bar {
  height: .55rem;
  border-radius: 999px;
  background: #e5e7eb;
  overflow: hidden;
}
.hp-blm-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #0d9488, #14b8a6);
  max-width: 100%;
  transition: width .2s ease;
}
.hp-blm-fill.is-over {
  background: linear-gradient(90deg, #dc2626, #f97316);
}
.hp-blm-pick {
  margin: .45rem 0 .6rem;
  padding: .45rem .55rem;
  border-radius: 10px;
  border: 1px solid #a7f3d0;
  background: #ecfdf5;
}
.hp-blm-pick-line {
  margin: 0 0 .35rem;
  font-size: .9rem;
  font-weight: 550;
}
.hp-blm-pick-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
}
.hp-blm-pick-chips .chip {
  cursor: pointer;
  border: 1px solid var(--border, #d0d5dd);
  background: #fff;
  border-radius: 999px;
  padding: .22rem .55rem;
  font-size: .8rem;
}
.hp-blm-pick-chips .chip.active {
  border-color: var(--accent, #0d9488);
  background: color-mix(in srgb, var(--accent, #0d9488) 12%, white);
  font-weight: 650;
}
.hp-blm-rank {
  margin: 0 0 .55rem;
  padding-left: 1.2rem;
  font-size: .88rem;
}
.hp-blm-rank li { margin: .2rem 0; }
.hp-blm-rank-top { font-weight: 650; }
.hp-blm-matrix-scroll {
  overflow-x: auto;
  margin-bottom: .65rem;
  -webkit-overflow-scrolling: touch;
}
.hp-blm-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .8rem;
  min-width: 280px;
}
.hp-blm-table th,
.hp-blm-table td {
  border: 1px solid var(--border, #e5e7eb);
  padding: .3rem .4rem;
  text-align: left;
  vertical-align: top;
}
.hp-blm-table thead th {
  background: var(--surface-2, #f3f4f6);
  font-weight: 600;
  white-space: nowrap;
}
.hp-blm-table th[scope="row"] {
  font-weight: 550;
  white-space: nowrap;
  background: #fafafa;
}
.hp-blm-table td.is-best {
  background: #ecfdf5;
  font-weight: 600;
  color: #065f46;
}
.hp-blm-gaps {
  margin: .45rem 0;
  padding: .45rem .55rem;
  border-radius: 8px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
}
.hp-blm-gaps-ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .85rem;
}
.hp-blm-tips {
  margin: .5rem 0;
  padding: .45rem .55rem;
  border-radius: 8px;
  background: var(--surface-2, #f8fafb);
  border: 1px solid var(--border, #e8ecf0);
}
.hp-blm-tip-list {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .85rem;
}
.hp-blm-tip-list li { margin: .2rem 0; }
.hp-blm-draft-box {
  margin: .55rem 0;
  padding: .5rem .55rem;
  border-radius: 10px;
  border: 1px solid #bfdbfe;
  background: #eff6ff;
}
.hp-blm-draft {
  width: 100%;
  font-size: .82rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  line-height: 1.35;
  resize: vertical;
  min-height: 7rem;
}
.hp-blm-sum-label { display: block; margin: .35rem 0 .2rem; }
.hp-blm-summary {
  width: 100%;
  font-size: .82rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  line-height: 1.35;
  resize: vertical;
  min-height: 8rem;
}
.hp-blm-seed-hint {
  margin: .45rem 0 0;
  padding: .4rem .55rem;
  border-radius: 8px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
}
.hp-blm-faq,
.hp-blm-privacy {
  margin-top: .85rem;
  border: 1px solid var(--border, #e2e6ea);
  border-radius: 10px;
  padding: .5rem .7rem;
}
.hp-blm-faq > summary,
.hp-blm-privacy > summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
}
.hp-blm-faq details {
  margin: .45rem 0 0;
  padding-left: .15rem;
}
.hp-blm-faq details summary {
  cursor: pointer;
  font-size: .88rem;
  font-weight: 550;
}
.hp-blm-faq details p { margin: .35rem 0 .15rem; }
@media (max-width: 900px) {
  .hp-blm-layout { grid-template-columns: 1fr; }
  .hp-blm-panel { position: static; }
}
@media (max-width: 560px) {
  .hp-blm-hero { grid-template-columns: 1fr; }
  .hp-blm-dim { grid-template-columns: 1fr; }
  .hp-blm-gauges { grid-template-columns: 1fr; }
  .hp-blm-checkline { margin-top: .35rem; }
  .hp-blm-next-row { flex-direction: column; align-items: stretch; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-blm-fill,
  .hp-blm-tempfill { transition: none; }
}