/* FILE: src/blocks/blueprint-runner/style.css
 * GOAL: Provide the full visual styling for the Blueprint Runner UI (overview + module runner) and its editor placeholder.
 */

/* SECTION: TOKENS ROOT */
:root {
  --dv-br-bg: #f4f6f8;
  --dv-br-surface: #ffffff;
  --dv-br-surface-var: #ddddff;
  --dv-br-text: #0b1f2a;
  --dv-br-muted: #5b6b73;

  --dv-br-primary: #0b3a52;
  --dv-br-primary-contrast: #ffffff;
  --dv-br-accent: #1fb6c9;
  --dv-br-accent-light: #8ed2dc;
  --dv-br-report_accent: rgb(5, 5, 165);
  --dv-br-close-btn: #e0556a;

  --dv-br-border: #d9e2e7;

  --dv-br-radius-lg: 20px;
  --dv-br-radius-md: 16px;
  --dv-br-radius-sm: 12px;

  --dv-br-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);

  --dv-br-space-1: 8px;
  --dv-br-space-2: 12px;
  --dv-br-space-3: 16px;
  --dv-br-space-4: 24px;
  --dv-br-space-5: 32px;
  --dv-br-space-6: 40px;

  --dv-br-font:
    ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, 'Apple Color Emoji',
    'Segoe UI Emoji';
  --dv-br-font-report-accent_test: Georgia Italic, 'Times New Roman', Times, serif;
  --dv-br-font-report-accent:
    ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, 'Apple Color Emoji',
    'Segoe UI Emoji';
}

.no-gap-between {
  gap: 0 !important;
}

/* SECTION: APP ROOT */
.digivibe-blueprint-runner-root {
  font-family: var(--dv-br-font);
  color: var(--dv-br-text);
  background: transparent;
}

.digivibe-blueprint-runner-root * {
  box-sizing: border-box;
}

/* SECTION: LAYOUT SHELL */
.dv-br-shell {
  min-height: 100vh;
  background: var(--dv-br-bg);
}

.dv-br-main {
  padding: var(--dv-br-space-6) var(--dv-br-space-5);
}

/* SECTION: BLUEPRINT TOPBAR */
.dv-br-topbar {
  height: 96px;
  background: var(--dv-br-primary);
  color: var(--dv-br-primary-contrast);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 var(--dv-br-space-5);
}

.dv-br-topbar__left {
  justify-self: start;
  display: flex;
  flex-direction: column;
}

.dv-br-topbar__left div {
  padding: 5px;
  display: flex;
  gap: 5px;
}

.dv-br-back__link {
  font-size: 14px;
  text-decoration: none;
  color: var(--dv-br-primary-contrast);
  opacity: 0.75;
  transition: opacity 0.15s ease;
}

.dv-br-topbar .dv-br-topbar__left .dv-br-danger {
  border: 2px solid red;
  background-color: darkred;
  color: white;
  margin: 2px;
}

.dv-br-back__link:hover {
  opacity: 1;
  text-decoration: underline;
}

.dv-br-topbar__title {
  justify-self: center;
  font-weight: 700;
  letter-spacing: 0.2px;
  font-size: 18px;
  text-align: center;
}

.dv-br-topbar__right {
  justify-self: end;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--dv-br-space-2);
}

.dv-br-topbar__progressLabel {
  color: rgba(255, 255, 255, 0.75);
  font-size: 14px;
  letter-spacing: 0.5px;
  text-transform: lowercase;
}

.dv-br-ring {
  width: 54px;
  height: 54px;
  border-radius: 999px;
  position: relative;
  display: grid;
  place-items: center;
  background: conic-gradient(
    var(--dv-br-accent) var(--dv-br-ring-pct),
    rgba(255, 255, 255, 0.18) 0
  );
}

.dv-br-ring::after {
  content: '';
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: var(--dv-br-primary);
}

.dv-br-ring__value {
  position: absolute;
  font-size: 13px;
  font-weight: 700;
  color: var(--dv-br-primary-contrast);
}

@media (max-width: 360px) {
  .dv-br-topbar {
    height: auto;
    padding: var(--dv-br-space-3) var(--dv-br-space-4);
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      'back right'
      'title title';
    row-gap: 8px;
  }

  .dv-br-topbar__left {
    grid-area: back;
  }

  .dv-br-topbar__right {
    grid-area: right;
  }

  .dv-br-topbar__title {
    grid-area: title;
    font-size: 16px;
    line-height: 1.2;
    padding-bottom: 2px;
  }

  .dv-br-back__link {
    font-size: 13px;
  }

  .dv-br-topbar__progressLabel {
    display: none;
  }
}

/* SECTION: GENERIC CARD */
.dv-br-card {
  max-width: 860px;
  margin: 0 auto;
  background: var(--dv-br-surface);
  border-radius: var(--dv-br-radius-lg);
  box-shadow: var(--dv-br-shadow);
  padding: var(--dv-br-space-6);
  text-align: center;
}

.dv-br-card__title {
  margin: 0 0 var(--dv-br-space-4) 0;
  font-size: 22px;
  font-weight: 700;
}

.dv-br-version {
  margin: 0 0 var(--dv-br-space-2) 0;
  font-size: 10px;
  font-weight: 300;
  font-style: italic;
  color: var(--dv-br-text);
}

.dv-br-card__text {
  margin: 0 0 var(--dv-br-space-2) 0;
  color: var(--dv-br-text);
  font-size: 15px;
  line-height: 1.55;
}

.dv-br-card__muted {
  color: var(--dv-br-muted);
}

.dv-br-card__actions {
  margin-top: var(--dv-br-space-5);
  display: flex;
  justify-content: center;
  gap: var(--dv-br-space-3);
  flex-wrap: wrap;
}

/* SECTION: BUTTONS */
.dv-br-btn {
  appearance: none;
  border: 0;
  border-radius: 999px;
  padding: 12px 22px;
  font-weight: 700;
  cursor: pointer;
  transition:
    transform 120ms ease,
    filter 120ms ease;
}

.dv-br-btn:active {
  transform: translateY(1px);
}

.dv-br-btn--primary {
  background: var(--dv-br-primary);
  color: var(--dv-br-primary-contrast);
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.18);
}

.dv-br-btn--secondary {
  background: transparent;
  color: var(--dv-br-primary);
  border: 2px solid rgba(11, 58, 82, 0.25);
}

.dv-br-btn[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
}

/* SECTION: HELP FLOAT */
.dv-br-helpFloat {
  position: fixed;
  right: 24px;
  bottom: 24px;
  display: flex;
  align-items: center;
  gap: 12px;
  z-index: 50;
}

.dv-br-helpFloat__pill {
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid var(--dv-br-border);
  padding: 12px 14px;
  border-radius: 999px;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.12);
  display: flex;
  align-items: center;
  gap: 10px;
}

.dv-br-helpFloat__pillText {
  font-size: 13px;
  color: var(--dv-br-muted);
  white-space: nowrap;
}

.dv-br-helpFloat__close {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  border: 0;
  background: transparent;
  cursor: pointer;
  color: var(--dv-br-close-btn);
  font-weight: 900;
  line-height: 1;
}

.dv-br-helpFloat__btn {
  width: 72px;
  height: 72px;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid var(--dv-br-border);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.16);
  font-weight: 800;
  letter-spacing: 0.3px;
  color: var(--dv-br-primary);
}

/* SECTION: EDITOR PLACEHOLDER */
.dv-blueprint-runner__placeholder {
  border: 1px dashed var(--dv-br-border);
  border-radius: var(--dv-br-radius-md);
  padding: var(--dv-br-space-4);
}

/* SECTION: OVERVIEW + MODULE LAYOUT */
.dv-br-overview,
.dv-br-module {
  max-width: 980px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: var(--dv-br-space-5);
  align-items: start;
  transition: grid-template-columns 220ms ease;
}

.dv-br-overview--rail-open,
.dv-br-module--rail-open {
  grid-template-columns: minmax(0, 1fr) 340px;
}

.dv-br-overview--rail-closed,
.dv-br-module--rail-closed {
  grid-template-columns: minmax(0, 1fr) 72px;
}

.dv-br-overview__main {
  display: flex;
  flex-direction: column;
  gap: var(--dv-br-space-4);
  min-width: 0;
}

.dv-br-overview__hint {
  color: var(--dv-br-muted);
  text-align: center;
  margin: 0;
  font-size: 14px;
}

.dv-br-module__main {
  background: var(--dv-br-surface);
  border-radius: var(--dv-br-radius-lg);
  box-shadow: var(--dv-br-shadow);
  padding: var(--dv-br-space-6);
  min-width: 0;
}

/* SECTION: BLUEPRINT OVERVIEW MODULE GRID */
.dv-br-modGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--dv-br-space-4);
}

/* SECTION: BLUEPRINT OVERVIEW MODULE CARD */
.dv-br-modCard {
  display: flex;
  min-height: 100%;
  background: var(--dv-br-surface);
  border-radius: 2rem;
  box-shadow: none;
  text-align: center;
}

.dv-br-modCard__inner {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
  padding: 2.5rem 2rem 2.25rem;
  text-align: center;
}

.dv-br-modCard__header {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  align-items: center;
}

.dv-br-modCard__title {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
}

.dv-br-modCard__description {
  max-width: 34rem;
  margin: 0;
  color: var(--dv-br-muted);
  font-size: 14px;
  line-height: 1.5;
}

.dv-br-modCard__meta {
  margin: 0;
  color: var(--dv-br-text);
  font-size: 14px;
}

.dv-br-modCard__barRow {
  width: 100%;
  max-width: 22rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
}

.dv-br-modCard__bar {
  position: relative;
  width: 100%;
  height: 1.75rem;
  border-radius: 999px;
  border: 2px solid rgba(0, 0, 0, 0.25);
  background: rgba(0, 0, 0, 0.06);
  overflow: hidden;
}

.dv-br-modCard__barFill {
  width: var(--dv-br-bar-pct, 0%);
  height: 100%;
  border-radius: 999px;
  background: var(--dv-br-primary);
}

.dv-br-modCard__pct {
  min-width: 3.5rem;
  text-align: right;
  font-weight: 800;
  font-size: 14px;
  color: var(--dv-br-text);
}

.dv-br-modCard__stats {
  width: 100%;
  max-width: 22rem;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.dv-br-modCard__statRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 1rem;
  text-align: left;
}

.dv-br-modCard__statLabel,
.dv-br-modCard__statValue {
  font-size: 14px;
  line-height: 1.3;
}

.dv-br-modCard__statLabel {
  color: var(--dv-br-text);
}

.dv-br-modCard__statValue {
  color: var(--dv-br-text);
  font-weight: 800;
  text-align: right;
}

.dv-br-modCard__note {
  max-width: 26rem;
  margin: 0;
  color: var(--dv-br-text);
  font-weight: 700;
  line-height: 1.4;
}

.dv-br-modCard__actions {
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.dv-br-modCard__actions .dv-br-btn {
  min-width: 14rem;
}

.dv-br-modCard__warn {
  color: #c07a00;
  font-weight: 700;
  margin-right: 6px;
}

/* SECTION: SIDE PANEL */
.dv-br-module__side {
  background: var(--dv-br-primary);
  border-radius: var(--dv-br-radius-lg);
  box-shadow: var(--dv-br-shadow);
  color: var(--dv-br-primary-contrast);
  min-height: 220px;
  overflow: hidden;
  position: relative;
}

.dv-br-module__sideHeader {
  display: block;
  margin-bottom: var(--dv-br-space-3);
}

.dv-br-module__sideInner {
  padding: 72px var(--dv-br-space-5) var(--dv-br-space-5);
}

.dv-br-module__sideTitle {
  margin: 0 0 var(--dv-br-space-4) 0;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.dv-br-module__sideText {
  margin: 0 0 var(--dv-br-space-2) 0;
  font-size: 14px;
  line-height: 1.55;
  opacity: 0.9;
}

/* SECTION: SIDE PANEL BUTTONS */
.dv-br-module__sideToggle,
.dv-br-module__sideClose {
  appearance: none;
  border: 0;
  cursor: pointer;
  font: inherit;
}

.dv-br-module__sideClose {
  position: absolute;
  top: 18px;
  left: 18px;
  z-index: 3;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: var(--dv-br-close-btn);
  font-size: 24px;
  font-weight: 900;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transform: translate(-50%, -50%);
}

.dv-br-module__sideClose:hover {
  background: rgba(255, 255, 255, 0.2);
}

.dv-br-module__sideToggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 220px;
  padding: var(--dv-br-space-4) 0;
  background: transparent;
  color: var(--dv-br-primary-contrast);
  font-weight: 900;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.dv-br-overview--rail-closed .dv-br-module__side,
.dv-br-module--rail-closed .dv-br-module__side {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.dv-br-overview--rail-closed .dv-br-module__sideToggle,
.dv-br-module--rail-closed .dv-br-module__sideToggle {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

.dv-br-overview--rail-closed .dv-br-module__sideInner,
.dv-br-module--rail-closed .dv-br-module__sideInner {
  display: none;
}

/* SECTION: COACH SETTINGS */
.dv-br-coachChooser {
  display: grid;
  gap: var(--dv-br-space-4);
}

.dv-br-coachChooser__title {
  margin: 0;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.2;
  color: var(--dv-br-primary-contrast);
}

.dv-br-coachChooser__intro {
  margin: 0;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.92);
}

.dv-br-coachChooser__stage {
  display: grid;
  gap: var(--dv-br-space-3);
}

/* ---------- NAV ---------- */
.dv-br-coachChooser__nav {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
  align-items: center;
  gap: var(--dv-br-space-2);
}

.dv-br-coachChooser__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: #ffffff;
  font-size: 18px;
  font-weight: 900;
  cursor: pointer;
  transition:
    background-color 0.2s ease,
    transform 0.2s ease,
    opacity 0.2s ease;
}

.dv-br-coachChooser__arrow:hover:not(:disabled) {
  background: rgba(255, 255, 255, 0.18);
  transform: translateY(-1px);
}

.dv-br-coachChooser__arrow:disabled {
  opacity: 0.45;
  cursor: default;
  transform: none;
}

.dv-br-coachChooser__counter {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  text-align: center;
  font-weight: 800;
  color: rgba(255, 255, 255, 0.72);
}

/* ---------- PREVIEW ---------- */
.dv-br-coachChooser__preview {
  min-width: 0;
  background: transparent;
}

.dv-br-coachChooser__stream {
  width: 100%;
  background: rgba(255, 255, 255, 0.08);
  border-radius: var(--dv-br-radius-lg);
  padding: var(--dv-br-space-3);
}

/* laat CoachStream zelf de header doen */
.dv-br-coachChooser__stream .digivibe-coach-header {
  margin-bottom: var(--dv-br-space-3);
}

/* ---------- EMPTY STATE ---------- */
.dv-br-coachChooser__empty {
  padding: var(--dv-br-space-3);
  border-radius: var(--dv-br-radius-md);
  background: rgba(255, 255, 255, 0.08);
  text-align: center;
  color: rgba(255, 255, 255, 0.82);
}

/* ---------- CONTROLS ---------- */
.dv-br-coachChooser__controls {
  display: grid;
  gap: var(--dv-br-space-2);
}

.dv-br-coachChooser__control {
  display: grid;
  gap: 10px;
}

.dv-br-coachChooser__label {
  display: inline-block;
  margin: 0;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.72);
}

/* ---------- TYPING SPEED ---------- */
.dv-br-coachChooser__speedPills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.dv-br-coachChooser__speedPill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 10px 14px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  border-radius: 999px;
  font-weight: 800;
  cursor: pointer;
  transition:
    background-color 0.2s ease,
    border-color 0.2s ease,
    color 0.2s ease,
    transform 0.2s ease,
    opacity 0.2s ease;
}

.dv-br-coachChooser__speedPill:hover:not(:disabled) {
  background: rgba(255, 255, 255, 0.14);
  transform: translateY(-1px);
}

.dv-br-coachChooser__speedPill.is-active {
  background: #ffffff;
  color: var(--dv-br-primary);
  border-color: #ffffff;
}

.dv-br-coachChooser__speedPill:disabled {
  opacity: 0.55;
  cursor: default;
  transform: none;
}

/* SECTION: STEP HEADER */
.dv-br-stepHeader {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--dv-br-space-4);
  margin-bottom: var(--dv-br-space-4);
}

.dv-br-stepHeader__title {
  margin: 0;
  font-size: 20px;
  font-weight: 900;
}

.dv-br-stepHeader__meta {
  margin: 0;
  color: var(--dv-br-muted);
  font-size: 13px;
  font-weight: 800;
}

/* SECTION: INFO STEP */
.dv-br-info__title {
  margin: 0 0 var(--dv-br-space-3) 0;
  font-size: 18px;
  font-weight: 900;
}

.dv-br-info__image {
  margin: 12px 0;
}

.dv-br-info__caption {
  margin-top: 8px;
  font-size: 0.9em;
  opacity: 0.8;
}

.dv-br-info__body {
  margin: 0;
  color: var(--dv-br-text);
  font-size: 15px;
  line-height: 1.6;
}

/* SECTION: QUESTION STEP */
.dv-br-q__question {
  margin: 10px 0 var(--dv-br-space-3) 0;
  font-size: 16px;
  font-weight: 800;
}

.dv-br-q__field {
  width: 100%;
  border: 1px solid var(--dv-br-border);
  border-radius: var(--dv-br-radius-md);
  padding: 12px 14px;
  font-size: 15px;
  outline: none;
}

.dv-br-q__options {
  display: flex;
  flex-direction: column;
  gap: var(--dv-br-space-2);
}

.dv-br-q__optionBtn {
  width: 100%;
  text-align: left;
  padding: 12px 14px;
  border-radius: var(--dv-br-radius-md);
  border: 1px solid rgba(0, 0, 0, 0.18);
  background: rgba(0, 0, 0, 0.03);
  cursor: pointer;
  font-weight: 700;
}

.question-explanation,
.option-explanation {
  display: block;
  font-weight: 400;
}

[data-explanation='off'] *.question-explanation,
[data-explanation='off'] *.option-explanation {
  display: none;
}

#toggle-explanation {
  margin-left: 10px;
  padding: 5px 10px;
  border-radius: 50%;
  background-color: var(--dv-br-primary, navy);
  color: white;
  cursor: pointer;
}

/* SECTION: NAV BAR */
.dv-br-nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--dv-br-space-3);
  margin-top: var(--dv-br-space-6);
  padding-top: var(--dv-br-space-4);
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.dv-br-nav__left,
.dv-br-nav__right {
  display: flex;
  gap: var(--dv-br-space-3);
  align-items: center;
}

.dv-br-stepNav {
  margin-top: var(--dv-br-space-3);
  padding: var(--dv-br-space-3);
  border-radius: var(--dv-br-radius-lg);
  border: 1px solid rgba(0, 0, 0, 0.08);
  background: rgba(255, 255, 255, 0.75);
  backdrop-filter: blur(6px);
}

.dv-br-stepNav__row {
  display: flex;
  align-items: center;
  gap: var(--dv-br-space-2);
  width: 100%;
}

.dv-br-stepNav__row--controls {
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--dv-br-space-3);
}

.dv-br-stepNav__row--numbers {
  margin-top: var(--dv-br-space-3);
  justify-content: space-between;
  gap: var(--dv-br-space-3);
  flex-wrap: wrap;
}

.dv-br-stepNav__group {
  display: inline-flex;
  align-items: center;
  gap: var(--dv-br-space-2);
}

.dv-br-stepNav__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  border: 1px solid rgba(0, 0, 0, 0.14);
  background: #fff;
  cursor: pointer;
  border-radius: 10px;
  font-size: 14px;
  color: #111;
}

.dv-br-stepNav__btn:hover {
  border-color: rgba(0, 0, 0, 0.28);
}

.dv-br-stepNav__btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.dv-br-stepNav__btn.is-valid {
  background-color: var(--dv-br-primary);
  color: white;
}

.dv-br-stepNav__numbers {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: nowrap;
  overflow: hidden;
  max-width: 100%;
}

.dv-br-stepNav__num {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.03);
  border: 1px solid rgba(0, 0, 0, 0.12);
  cursor: pointer;
  font-size: 13px;
  line-height: 1;
  flex: 0 0 auto;
  color: #111;
}

.dv-br-stepNav__num:hover {
  border-color: rgba(0, 0, 0, 0.24);
  background: rgba(0, 0, 0, 0.05);
}

.dv-br-stepNav__num.is-active {
  border-color: rgba(0, 0, 0, 0.5);
  background: rgba(0, 0, 0, 0.06);
  font-weight: 800;
}

.dv-br-stepNav__num.is-valid {
  border-color: rgba(0, 160, 90, 0.45);
}

.dv-br-stepNav__num.is-invalid {
  border-color: rgba(220, 60, 60, 0.45);
}

.dv-br-stepNav__num.is-info {
  border-color: rgba(60, 120, 255, 0.45);
}

.dv-br-stepNav__numLabel {
  display: inline-block;
  min-width: 10px;
  text-align: center;
}

.dv-br-stepNav__numIcon {
  font-size: 14px;
  line-height: 1;
  font-weight: 900;
  margin-left: 2px;
  display: inline-block;
  opacity: 0.9;
}

.dv-br-stepNav__numIcon.is-info {
  font-weight: 900;
}

.dv-br-stepNav__dots {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 6px;
  font-weight: 900;
  opacity: 0.6;
  flex: 0 0 auto;
}

.dv-br-stepNav__jump {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.dv-br-stepNav__jumpLabel {
  font-weight: 800;
  opacity: 0.8;
}

.dv-br-stepNav__select {
  border-radius: 10px;
  padding: 6px 10px;
  border: 1px solid rgba(0, 0, 0, 0.14);
  background: #fff;
  max-width: 360px;
}

@media (max-width: 900px) {
  .dv-br-stepNav__row--numbers {
    flex-direction: column;
    align-items: stretch;
  }

  .dv-br-stepNav__jump {
    justify-content: space-between;
  }

  .dv-br-stepNav__select {
    max-width: 100%;
    width: 100%;
  }
}

/* SECTION: INSIGHTS PANEL */
.dv-insight-text {
  margin-top: 6px;
}

.dv-insight-paragraph {
  margin: 0 0 12px 0;
}

.dv-insight-subtitle {
  margin: 10px 0 8px 0;
  font-weight: 900;
  letter-spacing: 0.2px;
}

.dv-br-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: rgba(0, 0, 0, 0.06);
}

.dv-br-badge--new {
  background: rgba(31, 182, 201, 0.18);
  border-color: rgba(31, 182, 201, 0.45);
}

.dv-br-badge--updated {
  background: rgba(11, 58, 82, 0.14);
  border-color: rgba(11, 58, 82, 0.35);
}

.dv-insight-card--new {
  animation: dvInsightPop 420ms ease-out 1;
  outline: 2px solid rgba(31, 182, 201, 0.35);
  outline-offset: 2px;
}

.dv-insight-card--updated {
  animation: dvInsightPulse 520ms ease-out 1;
  outline: 2px solid rgba(11, 58, 82, 0.28);
  outline-offset: 2px;
}

@keyframes dvInsightPop {
  0% {
    transform: translateY(3px);
    filter: brightness(1.03);
  }
  100% {
    transform: translateY(0);
    filter: brightness(1);
  }
}

@keyframes dvInsightPulse {
  0% {
    filter: brightness(1.04);
  }
  100% {
    filter: brightness(1);
  }
}

.dv-insight-card--html .dv-insight-text {
  margin-top: 8px;
}

.dv-insight-html {
  color: inherit;
}

.dv-insight-html > *:first-child {
  margin-top: 0;
}

.dv-insight-html > *:last-child {
  margin-bottom: 0;
}

.dv-insight-html p {
  margin: 0 0 12px 0;
  line-height: 1.7;
}

.dv-insight-html ul,
.dv-insight-html ol {
  margin: 0 0 14px 0;
  padding-left: 22px;
}

.dv-insight-html li {
  margin: 0 0 8px 0;
  line-height: 1.65;
}

.dv-insight-html strong,
.dv-insight-html b {
  font-weight: 800;
}

.dv-insight-html em,
.dv-insight-html i {
  font-style: italic;
}

.dv-insight-html .report-lead {
  font-size: 1.1rem;
  line-height: 1.75;
  font-weight: 500;
  color: inherit;
}

.dv-insight-html .report-list-intro {
  font-weight: 700;
  color: inherit;
}

.report-accent,
.dv-insight-html .report-accent-strong {
  color: var(--dv-br-surface-var);
  font-family: var(--dv-br-font-report-accent);
  font-size: 1em;
  line-height: 1.75;
}

.dv-block-renderer__text *.report-accent,
.dv-block-renderer__text *.report-accent-strong {
  color: var(--dv-br-report_accent);
  font-family: (--dv-br-font-report-accent);
  font-size: 1em;
  line-height: 1.75;
}

/* SECTION: REPORT ACCENT HTML */
.report-accent--html {
  display: block;
}

.report-accent--html ul {
  margin: 0.75rem 0 1rem;
  padding-left: 1.25rem;
}

.report-accent--html li {
  margin-bottom: 0.35rem;
}

.dv-insight-html .report-accent-strong {
  font-weight: 800;
}

.dv-text {
  white-space: pre-line;
}

/* SECTION: INSIGHTS ZONE */
section.dv-insights-group.open {
  border: 1px solid rgba(255, 255, 255, 0.4);
  padding: 0 20px 20px 20px;
}

section.dv-insights-group.closed {
  border: none;
  padding: 0 20px 20px 20px;
}

section.dv-insights-group .dv-insights-group__toggle {
  color: white;
  font-size: large;
  padding: 5px;
  background-color: rgba(255, 255, 255, 0.1);
  transform: translateX(-20px);
  text-align: left;
  cursor: pointer;
}

section.dv-insights-group .dv-insights-group__toggle:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

span.dv-insights-group__toggleIcon {
  margin-left: 5px;
}

.dv-insights-group.is-section-group .dv-insight-title {
  font-size: 1.35rem;
  font-weight: 900;
  margin: 30px 0 10px 0;
}

.dv-insights-group.is-report-group {
  margin-bottom: 1rem;
}

.dv-insights-group.is-micro-group {
  opacity: 0.92;
}

.dv-insights-group.is-section-group {
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  padding-top: 1rem;
  margin-top: 0.75rem;
}

.dv-insights-group.is-micro-group .dv-insights-group__toggle {
  background: rgba(0, 0, 0, 0.025);
}

.dv-insights-group.is-section-group .dv-insights-group__toggle {
  background: rgba(0, 0, 0, 0.045);
  font-weight: 600;
}

.dv-insight-card.is-micro-card {
  background: rgba(0, 0, 0, 0.02);
}

.dv-insight-card.is-section-card {
  background: rgba(0, 0, 0, 0.035);
  border-left: 3px solid currentColor;
}

.dv-insights-group.is-micro-group:has(+ .dv-insights-group.is-section-group) {
  display: none;
}

/* SECTION: INDEX CARDS */
.dv-indexcard {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 18px;
  margin-top: 14px;
  border: 1px solid rgba(11, 58, 82, 0.14);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 10px 24px rgba(11, 58, 82, 0.06);
}

.dv-indexcard__icon {
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: rgba(11, 58, 82, 0.08);
  font-size: 20px;
  line-height: 1;
}

.dv-indexcard__content {
  min-width: 0;
  flex: 1 1 auto;
}

.dv-indexcard__title {
  margin: 0 0 6px;
  font-size: 1.05rem;
  line-height: 1.25;
}

.dv-indexcard__body {
  margin: 0;
  color: rgba(11, 58, 82, 0.88);
  line-height: 1.55;
}

.dv-br-info-blocks {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.dv-block-renderer__heading {
  margin: 0 0 14px;
}

.dv-block-renderer__text {
  margin: 0 0 10px;
}

.dv-block-renderer__paragraph {
  margin: 0 0 14px;
}

.dv-block-renderer__imageFigure {
  margin: 14px 0 0;
}

.dv-block-renderer__caption {
  margin-top: 8px;
  font-size: 0.9rem;
  opacity: 0.8;
}

.dv-block-renderer__reveal {
  margin-top: 14px;
}

.dv-block-renderer__revealSummary {
  cursor: pointer;
  font-weight: 600;
}

.dv-block-renderer__revealBody {
  margin-top: 12px;
}

/* SECTION: INSIGHTS ENTRY ACTIONS */
.dv-insights-entry__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--dv-br-space-2);
  margin-top: var(--dv-br-space-3);
}

.dv-insights-entry__actionButton {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.1);
  color: var(--dv-br-primary-contrast);
  font: inherit;
  font-weight: 800;
  line-height: 1.2;
  cursor: pointer;
  transition:
    background 140ms ease,
    border-color 140ms ease,
    transform 120ms ease,
    opacity 120ms ease;
}

.dv-insights-entry__actionButton:hover {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.42);
}

.dv-insights-entry__actionButton:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.95);
  outline-offset: 2px;
}

.dv-insights-entry__actionButton:active {
  transform: translateY(1px);
}

.dv-insights-entry--actionable .dv-insight-card:last-child {
  margin-bottom: 0;
}

.dv-insights-entry__title {
  margin: 14px 0 6px 0;
  font-size: 1rem;
  font-weight: 900;
  letter-spacing: 0.2px;
  color: var(--dv-br-primary-contrast);
}

/* SECTION: PROGRESS TRIGGER */
.dv-br-progressTrigger {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  display: inline-flex;
  align-items: center;
  gap: var(--dv-br-space-2);
  cursor: pointer;
  padding: 0;
  position: relative;
}

.dv-br-progressTrigger:hover .dv-br-topbar__progressLabel {
  color: var(--dv-br-accent);
}

/* SECTION: PROGRESS POPOVER */
.dv-br-progressPopoverAnchor {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
}

.dv-br-progressPopover {
  position: absolute;
  top: calc(100% + 14px);
  right: 0;
  z-index: 30;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.dv-br-progressPopover__arrow {
  position: absolute;
  top: -10px;
  right: 24px;
  width: 20px;
  height: 20px;
  background: #b9d7db;
  border-top: 3px solid var(--dv-br-accent);
  border-left: 3px solid var(--dv-br-accent);
  transform: rotate(45deg);
  z-index: 0;
}

.dv-br-progressPopover__card {
  position: relative;
  z-index: 1;
  min-width: 340px;
  max-width: 360px;
  padding: 24px 20px 20px 20px;
  background: #b9d7db;
  color: var(--dv-br-primary);
  border: 3px solid var(--dv-br-accent);
  box-shadow: var(--dv-br-shadow);
  border-radius: 0;
}

.dv-br-progressPopover__close {
  appearance: none;
  border: 0;
  background: transparent;
  color: #e0556a;
  cursor: pointer;
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
  position: absolute;
  top: 12px;
  left: 12px;
}

.dv-br-progressPopover__rows {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 8px;
}

.dv-br-progressPopover__row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: baseline;
}

.dv-br-progressPopover__label {
  font-size: 14px;
  line-height: 1.4;
}

.dv-br-progressPopover__value {
  font-size: 15px;
  line-height: 1.4;
  font-weight: 700;
  text-align: right;
}

.dv-br-progressPopover__hint {
  margin: 22px 0 0 0;
  font-size: 15px;
  line-height: 1.45;
  font-style: italic;
}

@media (max-width: 700px) {
  .dv-br-progressPopover {
    right: 0;
  }

  .dv-br-progressPopover__card {
    min-width: 280px;
    max-width: min(320px, calc(100vw - 32px));
  }

  .dv-br-progressPopover__arrow {
    right: 20px;
  }
}

/* SECTION: COACH STREAM */
.digivibe-coach-stream {
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: var(--dv-br-radius-lg);
  display: flex;
  flex-direction: column;
  gap: 0;
}

.digivibe-coach-stream__messages {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
  margin: 0.5rem;
}

/* SECTION: COACH HEADER */
.digivibe-coach-header {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  padding: 0 0 1rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}

.digivibe-coach-header__avatar {
  flex: 0 0 64px;
  width: 64px;
  height: 64px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
}

.digivibe-coach-header__avatar-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  margin-left: 0.5rem;
  margin-top: 0.5rem;
}

.digivibe-coach-header__avatar-fallback {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-weight: 700;
  color: #ffffff;
}

.digivibe-coach-header__meta {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.digivibe-coach-header__name {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.2;
  color: #ffffff;
}

.digivibe-coach-header__slogan {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.82);
}

/* SECTION: COACH MESSAGE */
.digivibe-coach-message {
  display: block;
}

.digivibe-coach-message__bubble {
  display: block;
  padding: 0;
  background: transparent;
  border: 0;
  overflow-y: auto;
}

.digivibe-coach-message__text {
  margin: 0;
  font-size: 1rem;
  line-height: 1.55;
  color: #ffffff;
}

.digivibe-coach-message__text strong {
  font-weight: 700;
}

/* SECTION: REPORT */
.dv-br-report-step__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.dv-br-report-step__print-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.75rem 1rem;
  border: 1px solid #16324a;
  border-radius: 999px;
  color: #16324a;
  font-weight: 600;
  cursor: pointer;
}

@media (max-width: 900px) {
  .dv-br-overview,
  .dv-br-overview--rail-open,
  .dv-br-overview--rail-closed,
  .dv-br-module,
  .dv-br-module--rail-open,
  .dv-br-module--rail-closed {
    grid-template-columns: 1fr;
  }

  .dv-br-module__side {
    order: -1;
  }

  .dv-br-overview--rail-closed .dv-br-module__sideToggle,
  .dv-br-module--rail-closed .dv-br-module__sideToggle {
    writing-mode: horizontal-tb;
    transform: none;
    min-height: 72px;
    width: 100%;
  }

  .dv-br-modGrid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .dv-br-modCard__inner {
    padding: 2rem 1.25rem;
  }

  .dv-br-modCard__barRow,
  .dv-br-modCard__stats {
    max-width: none;
  }

  .dv-br-modCard__statRow {
    gap: 0.75rem;
  }

  .dv-br-modCard__actions .dv-br-btn {
    min-width: 11rem;
    width: 100%;
  }

  .dv-br-coachSettings {
    grid-template-columns: 1fr;
    gap: var(--dv-br-space-2);
  }

  .dv-br-coachSettings__label {
    padding-top: 0;
  }
}

@media print {
  html,
  body {
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
  }

  body * {
    visibility: hidden;
  }

  .dv-br-report-step,
  .dv-br-report-step * {
    visibility: visible;
  }

  .dv-br-report-step {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    margin: 0;
    padding: 0;
    background: #fff;
  }

  .dv-br-report-step__print-button,
  .dv-br-context-blocks,
  .dv-br-actions {
    display: none !important;
  }

  .dv-br-report-step__title,
  .dv-br-report-entry__title,
  h2,
  h3,
  h4 {
    break-after: avoid;
    page-break-after: avoid;
  }

  .dv-br-report-step__title {
    font-size: 1.5rem;
  }

  .dv-block-renderer__blockTitle {
    font-size: 1.5rem;
  }

  .dv-br-report-entry__blocks > *,
  .dv-br-report-step__intro > * {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  @page {
    margin: 16mm;
  }
}

/* SECTION: ANSWER REVIEW CHECKBOX */
.dv-br-answerReview__option {
  display: flex;
  align-items: center;
  gap: 8px;
}

.dv-br-answerReview__option input[type='checkbox'] {
  accent-color: var(--dv-br-primary);
}

.dv-br-answerReview__meta {
  color: var(--dv-br-muted);
  font-style: italic;
}

footer {
  display: flex;
  gap: 5px;
  padding: 20px;
}

.digivibe-coach-choices,
.digivibe-coach-interaction-controls {
  display: flex;
  justify-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
}

.digivibe-coach-choices[data-layout='stack'] {
  justify-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
}

.digivibe-coach-choice,
.digivibe-coach-feedback-button,
.digivibe-coach-restart-button {
  background-color: var(--dv-br-accent-light);
  color: black;
  border-radius: 20px;
  padding: 5px;
}

.digivibe-coach-restart-button {
  margin-top: 10px;
  color: var(--dv-br-close-btn);
}

/* SECTION: PILOT BLUR OVERLAY */

.savora-blur-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.92);
  backdrop-filter: blur(8px);
  z-index: 999999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.savora-blur-message {
  color: white;
  font-size: 18px;
  opacity: 0.8;
  text-align: center;
}

/* SECTION: PILOT REPORT COPY PROTECTION */

.dv-br-report-step {
  user-select: none;
  -webkit-user-select: none;
}

.dv-br-report-step img {
  pointer-events: none;
}

/* SECTION: REPORT WATERMARK */

.dv-br-report-step {
  position: relative;
}

.dv-br-watermark {
  position: absolute;
  inset: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 40px;
  opacity: 0.05;

  transform: rotate(-20deg);
}

/* SECTION: PILOT CONSENT MODAL */

.savora-pilot-consent {
  position: fixed;
  inset: 0;
  z-index: 1000000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(0, 0, 0, 0.72);
}

.savora-pilot-consent__dialog {
  width: min(680px, 100%);
  padding: 28px;
  border-radius: 18px;
  background: #fff;
  color: #111;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.35);
}

.savora-pilot-consent__dialog h2 {
  margin-top: 0;
}

.savora-pilot-consent__button,
.savora-pilot-consent__button--secondary {
  margin-top: 18px;
  padding: 12px 18px;
  border: 0;
  border-radius: 10px;
  cursor: pointer;
  font-weight: 700;
}

.savora-pilot-consent__button--secondary {
  margin-left: 18px;
  background-color: transparent;
  border: 1px solid darkred;
  color: darkred;
}

.savora-pilot-consent__button:hover,
.savora-pilot-consent__button--secondary:hover {
  box-shadow: 2px 5px 5px rgba(35, 35, 35, 0.2);
}

.savora-pilot-consent__button:disabled {
  cursor: wait;
  opacity: 0.7;
}

.savora-pilot-consent__error {
  color: #b32d2e;
  font-weight: 600;
}


/*# sourceMappingURL=blueprint-runner.css.map*/