/* Build Digital persona Overview (prototype 2b), for the Build Digital KB plugin.
   Generated by deploy2b.mjs from the canvas pages: RPF tokens and components, the Build Digital
   dark theme, all scoped under .bdk-ov. Do not edit by hand; edit the canvas and regenerate. */
.bdk-ov {--ink: #1d293d;
  --muted: #475569;
  --display: #0f172a;
  --inverse: #ffffff;
  --surface: #ffffff;
  --surface-muted: #f8fafc;
  --border: #e2e8f0;
  --field-line: #848fa1;
  --selected: #f1f5f9;
  --fill: #954c44;
  --fill-hover: #7a413b;
  --brand-text: #954c44;
  --selection: #ffe2de;
  --journey: #7c3aed;
  --journey-tint: #f5f3ff;
  --journey-line: #ddd6fe;
  --success-text: #047857;
  --success-tint: #ecfdf5;
  --success-line: #a7f3d0;
  --warning-text: #b45309;
  --warning-tint: #fffbeb;
  --warning-line: #fde68a;
  --danger-text: #be123c;
  --danger-tint: #fff1f2;
  --danger-line: #fecdd3;
  --mix-core: #334155;
  --mix-primary: #94a3b8;
  --mix-supporting: #e2e8f0;
  --identity-coral: #f37f73;
  --scrim: rgba(15, 23, 42, .32);

  --font-ui: Raleway, ui-sans-serif, system-ui, sans-serif;
  --font-reading: "PT Sans", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;

  --space-1: 4px;
  --gap-related: 8px;
  --gap-group: 12px;
  --gap-section: 16px;
  --gutter: 24px;
  --card-padding: 16px;
  --card-padding-dense: 12px;
  --control-padding-x: 12px;
  --chip-padding-x: 8px;

  --control-height: 32px;
  --control-height-sm: 28px;
  --control-height-lg: 36px;
  --touch-height: 44px;
  --chip-height: 22px;
  --badge-height: 18px;
  --inline-icon: 20px;
  --appbar-height: 56px;
  --page-max: 1280px;
  --rail-width: 240px;
  --preview-width: 432px;
  --select-edge: 1px;

  --radius-control: 6px;
  --radius-card: 8px;
  --radius-chip: 999px;
  --overlay-shadow: 0 8px 24px rgba(15, 23, 42, .12);

  --font-body: 14px;
  --line-body: 20px;
  --font-control: 14px;
  --font-meta: 12px;
  --line-meta: 16px;
  --font-title: 16px;
  --line-title: 22px;
  --font-page: 24px;
  --line-page: 30px;
  --font-prose: 15px;
  --line-prose: 24px;
  --font-display: 36px;
  --line-display: 44px;
  --font-diagram: 11px;
  --font-min: 12px;}
.bdk-ov {color-scheme:light;scrollbar-color:var(--muted) var(--surface-muted);scrollbar-width:thin}
.bdk-ov {font-family:var(--font-ui);font-size:var(--font-body);line-height:var(--line-body);color:var(--ink);
  font-variant-numeric:lining-nums;}
.bdk-ov :where(table,td,th,[class*="tabular-nums"]) {font-variant-numeric:lining-nums tabular-nums}
.bdk-ov *, .bdk-ov *::before, .bdk-ov *::after {box-sizing:border-box}
.bdk-ov ::selection {background:var(--selection);color:var(--ink)}
.bdk-ov :where(button,input,select,textarea) {font-family:var(--font-ui);caret-color:var(--brand-text)}
.bdk-ov :where(button,select,input:not([type="checkbox"]):not([type="radio"]),[data-ds-control]) {min-height:var(--control-height);border-radius:var(--radius-control);
  font-size:var(--font-control);line-height:var(--line-body);letter-spacing:normal;text-transform:none;}
.bdk-ov :where(input,select,textarea) {color:var(--ink)}
.bdk-ov :where(button,a,input,select,textarea,summary):focus-visible {outline:2px solid var(--brand-text);outline-offset:2px;}
.bdk-ov a {text-underline-offset:3px}
@media(min-resolution:2dppx) {
.bdk-ov {--select-edge:.5px}
}
@media(max-width:767px) {
.bdk-ov {--gutter:16px;--control-height:var(--touch-height);--control-height-sm:var(--touch-height);--control-height-lg:var(--touch-height)}
}
@media(prefers-reduced-motion:reduce) {
.bdk-ov *, .bdk-ov *::before, .bdk-ov *::after {scroll-behavior:auto!important;transition-duration:0ms!important;animation-duration:0ms!important}
}
.bdk-ov {margin: 0; background: var(--surface);}
.bdk-ov {color: var(--ink); -webkit-font-smoothing: antialiased;}
.bdk-ov a {color: inherit;}
.bdk-ov button {font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer;}
.bdk-ov button, .bdk-ov select, .bdk-ov input {min-height: 0;}
.bdk-ov [hidden] {display: none !important;}
.bdk-ov .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;}
.bdk-ov .icon {width: 16px; height: 16px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round;}
.bdk-ov .icon-sm {width: 14px; height: 14px;}
.bdk-ov .mono {font-family: var(--font-mono); font-size: var(--font-meta); line-height: var(--line-meta);}
.bdk-ov .muted {color: var(--muted);}
.bdk-ov .num {font-variant-numeric: lining-nums tabular-nums;}
.bdk-ov .appbar {position: sticky; top: 0; z-index: 30; height: var(--appbar-height); border-bottom: 1px solid var(--border); background: var(--surface);}
.bdk-ov .appbar-inner {max-width: var(--page-max); height: 100%; margin: 0 auto; padding: 0 var(--gutter); display: flex; align-items: center; gap: var(--gap-section);}
.bdk-ov .appbar-logo {display: inline-flex; align-items: center;}
.bdk-ov .appbar-logo img {height: 32px; width: auto; display: block;}
.bdk-ov .appbar-nav {display: flex; align-items: stretch; gap: 4px; height: 100%;}
.bdk-ov .appbar-nav a {display: inline-flex; align-items: center; padding: 0 8px; font-size: var(--font-body); line-height: var(--line-body); font-weight: 500; color: var(--muted); text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px;}
.bdk-ov .appbar-nav a:hover {color: var(--ink);}
.bdk-ov .appbar-nav a[aria-current="page"] {color: var(--ink); font-weight: 600; border-bottom-color: var(--brand-text);}
.bdk-ov .appbar-spacer {flex: 1;}
.bdk-ov .appbar-actions {display: flex; align-items: center; gap: var(--gap-related);}
.bdk-ov .appbar-menu {display: none;}
.bdk-ov .btn {display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: var(--control-height); padding: 0 var(--control-padding-x); border-radius: var(--radius-control); border: 1px solid transparent; font-size: var(--font-control); line-height: var(--line-body); font-weight: 600; white-space: nowrap; text-decoration: none; transition: background-color .12s, border-color .12s, color .12s;}
.bdk-ov .btn-sm {height: var(--control-height-sm); padding: 0 var(--gap-related); font-size: var(--font-meta); line-height: var(--line-meta); gap: 4px;}
.bdk-ov .btn-lg {height: var(--control-height-lg); padding: 0 var(--card-padding);}
.bdk-ov .btn-icon {width: var(--control-height); padding: 0;}
.bdk-ov .btn-sm.btn-icon {width: var(--control-height-sm);}
.bdk-ov .btn-primary {background: var(--surface); border-color: var(--border); color: var(--brand-text);}
.bdk-ov .btn-primary:hover {background: var(--fill); border-color: var(--fill); color: var(--inverse);}
.bdk-ov .btn-primary:active {background: var(--fill-hover); border-color: var(--fill-hover); color: var(--inverse);}
.bdk-ov .btn-secondary {background: var(--surface); border-color: var(--border); color: var(--ink);}
.bdk-ov .btn-secondary:hover {background: var(--surface-muted); border-color: var(--field-line);}
.bdk-ov .btn-ghost {color: var(--muted);}
.bdk-ov .btn-ghost:hover {background: var(--surface-muted); color: var(--ink);}
.bdk-ov .btn[aria-expanded="true"], .bdk-ov .btn.is-active {background: var(--selected); border-color: var(--field-line); color: var(--ink);}
.bdk-ov .btn .badge-count, .bdk-ov .rtab .badge-count {display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 4px; border-radius: var(--radius-control); background: var(--brand-text); color: var(--inverse); font-size: var(--font-meta); line-height: 1; font-weight: 600;}
.bdk-ov .btn:disabled {opacity: .45; cursor: not-allowed;}
.bdk-ov .link {color: var(--brand-text); font-weight: 600; text-decoration: none; font-size: var(--font-meta); line-height: var(--line-meta);}
.bdk-ov .link:hover {text-decoration: underline; text-underline-offset: 3px;}
.bdk-ov .field {position: relative; display: flex; align-items: center; min-width: 0;}
.bdk-ov .field input, .bdk-ov .field select, .bdk-ov .select {width: 100%; height: var(--control-height); border: 1px solid var(--field-line); border-radius: var(--radius-control); background: var(--surface); color: var(--ink); font: 400 var(--font-body)/var(--line-body) var(--font-ui); padding: 0 var(--control-padding-x);}
.bdk-ov .field input::placeholder {color: var(--muted);}
.bdk-ov .field input:hover, .bdk-ov .select:hover {border-color: var(--muted);}
.bdk-ov .field-search input {padding-left: 32px; padding-right: 32px;}
.bdk-ov .field-search > .icon {position: absolute; left: 10px; color: var(--muted); pointer-events: none;}
.bdk-ov .field-search .field-clear {position: absolute; right: 4px; width: 24px; height: 24px; display: none; align-items: center; justify-content: center; border-radius: var(--radius-control); color: var(--muted);}
.bdk-ov .field-search .field-clear:hover {background: var(--surface-muted); color: var(--ink);}
.bdk-ov .field-search.has-value .field-clear {display: inline-flex;}
.bdk-ov .field-sm input {height: var(--control-height-sm); font-size: var(--font-meta); line-height: var(--line-meta); padding: 0 var(--gap-related);}
.bdk-ov .field-search.field-sm input {padding-left: 28px; padding-right: 28px;}
.bdk-ov .field-search.field-sm > .icon {left: 8px; width: 14px; height: 14px;}
.bdk-ov .select {width: auto; appearance: none; padding-right: 28px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 8px center;}
.bdk-ov .select-sm {height: var(--control-height-sm); font-size: var(--font-meta); line-height: var(--line-meta); padding: 0 24px 0 var(--gap-related); background-position: right 6px center;}
.bdk-ov .field select, .bdk-ov .select {border-width: 0; box-shadow: inset 0 0 0 var(--select-edge) var(--field-line); padding-left: calc(var(--control-padding-x) + 1px);}
.bdk-ov .select-sm {padding-left: calc(var(--gap-related) + 1px);}
.bdk-ov .field select:hover, .bdk-ov .select:hover {box-shadow: inset 0 0 0 var(--select-edge) var(--muted);}
@media (forced-colors: active) {
.bdk-ov .field select, .bdk-ov .select {border-width: 1px; box-shadow: none;}
}
.bdk-ov input[type="checkbox"] {width: 16px; height: 16px; margin: 0; accent-color: var(--fill); flex: none;}
.bdk-ov .chip {display: inline-flex; align-items: center; gap: 4px; height: var(--chip-height); padding: 0 var(--chip-padding-x); border-radius: var(--radius-chip); font-size: var(--font-meta); line-height: var(--line-meta); font-weight: 600; white-space: nowrap; background: var(--surface-muted); color: var(--muted);}
.bdk-ov .chip-warning {background: var(--warning-tint); color: var(--warning-text);}
.bdk-ov .chip-success {background: var(--success-tint); color: var(--success-text);}
.bdk-ov .token {display: inline-flex; align-items: center; gap: 6px; height: var(--control-height-sm); padding: 0 4px 0 var(--gap-related); border-radius: var(--radius-control); background: var(--selected); color: var(--ink); font-size: var(--font-meta); line-height: var(--line-meta); font-weight: 600;}
.bdk-ov .token .token-key {color: var(--muted); font-weight: 500;}
.bdk-ov .token button {width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; border-radius: calc(var(--radius-control) - 2px); color: var(--muted);}
.bdk-ov .token button:hover {background: var(--surface); color: var(--ink);}
.bdk-ov .dot {display: inline-block; width: 8px; height: 8px; border-radius: var(--radius-chip); flex: none;}
.bdk-ov .disc {display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;}
.bdk-ov .country {display: inline-flex; align-items: center; gap: 4px; white-space: nowrap;}
.bdk-ov .country .flag {font-size: var(--font-body); line-height: 1;}
.bdk-ov .code {cursor: help; text-decoration: underline dotted var(--border); text-underline-offset: 3px;}
.bdk-ov .page {max-width: var(--page-max); margin: 0 auto; padding: var(--gap-section) var(--gutter) 48px;}
.bdk-ov .crumbs {display: flex; gap: 6px; align-items: center; font-size: var(--font-meta); line-height: var(--line-meta); color: var(--muted); margin-bottom: var(--gap-related);}
.bdk-ov .crumbs a {text-decoration: none;}
.bdk-ov .crumbs a:hover {color: var(--ink); text-decoration: underline; text-underline-offset: 3px;}
.bdk-ov .head {display: flex; flex-direction: column; align-items: flex-start;}
.bdk-ov .head-title {display: flex; align-items: center; justify-content: space-between; gap: var(--gap-group); width: 100%;}
.bdk-ov .head-more {margin-top: 2px;}
.bdk-ov .head h1 {margin: 0; font-size: var(--font-page); line-height: var(--line-page); font-weight: 600; color: var(--display); letter-spacing: -0.01em;}
.bdk-ov .head p {margin: 4px 0 0; max-width: 72ch; color: var(--muted);}
.bdk-ov .head-stats {display: flex; gap: var(--gap-group); margin-top: var(--gap-related); font-size: var(--font-meta); line-height: var(--line-meta); color: var(--muted);}
.bdk-ov .head-stats b {color: var(--ink); font-weight: 600;}
.bdk-ov .tabs {display: flex; gap: var(--gap-section); border-bottom: 1px solid var(--border); margin: var(--gap-section) 0 var(--gap-group);}
.bdk-ov .tabs a {display: inline-flex; align-items: center; gap: 6px; height: 36px; font-weight: 600; color: var(--muted); text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px;}
.bdk-ov .tabs a:hover {color: var(--ink);}
.bdk-ov .tabs a[aria-selected="true"] {color: var(--ink); border-bottom-color: var(--brand-text);}
.bdk-ov .tabs .count {font-size: var(--font-meta); line-height: var(--line-meta); font-weight: 500; color: var(--muted);}
.bdk-ov .seg {display: inline-flex; align-items: center; gap: 2px; height: calc(var(--chip-height) + 4px); padding: 2px; border-radius: var(--radius-chip); background: var(--selected);}
.bdk-ov .seg button {position: relative; display: inline-flex; align-items: center; gap: 4px; height: var(--chip-height); padding: 0 10px; border-radius: var(--radius-chip); color: var(--muted); font-size: var(--font-meta); line-height: var(--line-meta); font-weight: 600;}
.bdk-ov .seg button:hover {color: var(--ink);}
.bdk-ov .seg button[aria-pressed="true"] {background: var(--surface); color: var(--ink); box-shadow: 0 0 0 1px var(--field-line);}
.bdk-ov .panel {border: 1px solid var(--border); border-radius: var(--radius-card); background: var(--surface); min-width: 0;}
.bdk-ov .toolbar {display: flex; flex-wrap: wrap; align-items: center; gap: var(--gap-related); padding: var(--gap-related); border-bottom: 1px solid var(--border);}
.bdk-ov .toolbar .grow {flex: 1;}
.bdk-ov .ftrig {padding: 0 var(--gap-related);}
.bdk-ov .toolbar-count {font-size: var(--font-meta); line-height: var(--line-meta); color: var(--muted); white-space: nowrap;}
.bdk-ov .tokens {display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: var(--gap-related); border-bottom: 1px solid var(--border);}
.bdk-ov .panel-foot {display: flex; align-items: center; justify-content: space-between; gap: var(--gap-group); padding: var(--gap-related) var(--gap-group); border-top: 1px solid var(--border); font-size: var(--font-meta); line-height: var(--line-meta); color: var(--muted);}
.bdk-ov .pager {display: flex; align-items: center; gap: var(--gap-related);}
.bdk-ov .tbl-wrap {overflow-x: auto;}
.bdk-ov .tbl {width: 100%; border-collapse: collapse;}
.bdk-ov .tbl th {position: sticky; top: 0; background: var(--surface-muted); text-align: left; font-size: var(--font-meta); line-height: var(--line-meta); font-weight: 600; color: var(--muted); padding: var(--gap-related) var(--gap-group); border-bottom: 1px solid var(--border); white-space: nowrap;}
.bdk-ov .tbl th.r, .bdk-ov .tbl td.r {text-align: right;}
.bdk-ov .tbl th button {display: inline-flex; align-items: center; gap: 2px; font-weight: 600; color: inherit;}
.bdk-ov .tbl th button:hover {color: var(--ink);}
.bdk-ov .tbl th[aria-sort="ascending"] button, .bdk-ov .tbl th[aria-sort="descending"] button {color: var(--ink);}
.bdk-ov .tbl th .sort-ico {width: 12px; height: 12px; opacity: 0;}
.bdk-ov .tbl th button:hover .sort-ico, .bdk-ov .tbl th[aria-sort="ascending"] .sort-ico, .bdk-ov .tbl th[aria-sort="descending"] .sort-ico {opacity: 1;}
.bdk-ov .tbl th[aria-sort="descending"] .sort-ico {transform: rotate(180deg);}
.bdk-ov .tbl td {padding: var(--gap-related) var(--gap-group); border-bottom: 1px solid var(--border); vertical-align: middle; white-space: nowrap;}
.bdk-ov .tbl tbody tr:last-child td {border-bottom: 0;}
.bdk-ov .tbl tbody tr {cursor: pointer;}
.bdk-ov .tbl tbody tr:hover td {background: var(--surface-muted);}
.bdk-ov .tbl tbody tr:focus-within td {background: var(--surface-muted);}
.bdk-ov .tbl .role-title {font-weight: 600; color: var(--display); text-decoration: none;}
.bdk-ov .tbl tbody tr:hover .role-title {color: var(--brand-text);}
.bdk-ov .tbl .row-go {color: var(--muted); opacity: 0;}
.bdk-ov .tbl tbody tr:hover .row-go, .bdk-ov .tbl tbody tr:focus-within .row-go {opacity: 1;}
.bdk-ov .tbl .sub {display: block; font-size: var(--font-meta); line-height: var(--line-meta); color: var(--muted); overflow: hidden; text-overflow: ellipsis; max-width: 52ch;}
.bdk-ov .mix {display: inline-flex; align-items: center; gap: var(--gap-related);}
.bdk-ov .mix-bar {display: inline-flex; width: 56px; height: 6px; border-radius: calc(var(--radius-control) / 2); overflow: hidden; background: var(--mix-supporting);}
.bdk-ov .mix-bar i {display: block; height: 100%;}
.bdk-ov .mix-bar .core {background: var(--mix-core);}
.bdk-ov .mix-bar .primary {background: var(--mix-primary);}
.bdk-ov .mix-bar .supporting {background: var(--mix-supporting);}
.bdk-ov .menu-anchor {position: relative;}
.bdk-ov .menu {position: absolute; top: calc(100% + 4px); left: 0; z-index: 40; min-width: 240px; max-height: 360px; overflow: auto; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-card); box-shadow: var(--overlay-shadow); padding: 4px;}
.bdk-ov .menu[hidden] {display: none;}
.bdk-ov .menu-right {left: auto; right: 0;}
.bdk-ov .menu .field {padding: 4px 4px 6px;}
.bdk-ov .opt {display: flex; align-items: center; gap: var(--gap-related); width: 100%; min-height: var(--control-height-sm); padding: 0 var(--gap-related); border-radius: calc(var(--radius-control) - 2px); text-align: left; font-size: var(--font-body); line-height: var(--line-body); color: var(--ink); cursor: pointer;}
.bdk-ov .opt:hover {background: var(--surface-muted);}
.bdk-ov .opt .opt-label {flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.bdk-ov .opt .opt-count {font-size: var(--font-meta); line-height: var(--line-meta); color: var(--muted); font-variant-numeric: tabular-nums;}
.bdk-ov .opt.is-zero {color: var(--muted); cursor: default;}
.bdk-ov .opt.is-zero input {opacity: .5;}
.bdk-ov .opt[aria-checked="true"], .bdk-ov .opt:has(> input:checked) {font-weight: 600;}
.bdk-ov .menu-sep {height: 1px; background: var(--border); margin: 4px;}
.bdk-ov .menu-head {padding: 6px var(--gap-related) 4px; font-size: var(--font-meta); line-height: var(--line-meta); font-weight: 600; color: var(--muted);}
.bdk-ov .cards {list-style: none; margin: 0; padding: var(--gap-group); display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--gap-group);}
.bdk-ov .card {position: relative; border: 1px solid var(--border); border-radius: var(--radius-card); padding: var(--card-padding-dense); background: var(--surface); cursor: pointer; display: flex; flex-direction: column; gap: 6px; transition: border-color .12s;}
.bdk-ov .card:hover {border-color: var(--field-line);}
.bdk-ov .card:hover .role-title {color: var(--brand-text);}
.bdk-ov .card .card-top {display: flex; align-items: center; justify-content: space-between; gap: var(--gap-related);}
.bdk-ov .card .role-title {font-size: var(--font-title); line-height: var(--line-title); font-weight: 600; color: var(--display); text-decoration: none;}
.bdk-ov .card p {margin: 0; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.bdk-ov .card .card-meta {display: flex; flex-wrap: wrap; align-items: center; gap: 4px var(--gap-group); font-size: var(--font-meta); line-height: var(--line-meta); color: var(--muted); margin-top: 2px;}
.bdk-ov .sheet-scrim {position: fixed; inset: 0; background: var(--scrim); z-index: 60;}
.bdk-ov .sheet {position: fixed; left: 0; right: 0; bottom: 0; z-index: 61; max-height: 85vh; display: flex; flex-direction: column; background: var(--surface); border-radius: var(--radius-card) var(--radius-card) 0 0; box-shadow: var(--overlay-shadow);}
.bdk-ov .sheet[hidden], .bdk-ov .sheet-scrim[hidden] {display: none;}
.bdk-ov .sheet-head {display: flex; align-items: center; justify-content: space-between; padding: var(--gap-group) var(--card-padding); border-bottom: 1px solid var(--border); font-weight: 600;}
.bdk-ov .sheet-body {overflow: auto; padding: var(--gap-related) var(--card-padding) var(--card-padding);}
.bdk-ov .sheet-foot {display: flex; gap: var(--gap-related); padding: var(--gap-group) var(--card-padding); border-top: 1px solid var(--border);}
.bdk-ov .sheet-foot .btn {flex: 1;}
.bdk-ov .toast {position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 70; display: flex; align-items: center; gap: var(--gap-related); max-width: calc(100vw - 32px); padding: var(--gap-related) var(--gap-group); border-radius: var(--radius-card); background: var(--display); color: var(--inverse); font-size: var(--font-meta); line-height: var(--line-meta); box-shadow: var(--overlay-shadow);}
.bdk-ov .toast[hidden] {display: none;}
.bdk-ov .toast code {font-family: var(--font-mono);}
.bdk-ov .empty {padding: 48px var(--card-padding); text-align: center; color: var(--muted);}
.bdk-ov .empty strong {display: block; color: var(--ink); margin-bottom: 4px;}
.bdk-ov :where(button, a, input, select, [tabindex]):focus-visible {outline: 2px solid var(--brand-text); outline-offset: 2px; border-radius: var(--radius-control);}
.bdk-ov .tbl tbody tr:focus-visible {outline: 2px solid var(--brand-text); outline-offset: -2px;}
.bdk-ov .only-mobile {display: none;}
@media (max-width: 767px) {
.bdk-ov .only-mobile {display: initial;}
.bdk-ov button.link {display: inline-flex; align-items: center; min-height: var(--touch-height);}
.bdk-ov .only-desktop {display: none !important;}
.bdk-ov .appbar-nav, .bdk-ov .appbar-actions .hide-sm {display: none;}
.bdk-ov .appbar-menu {display: inline-flex;}
.bdk-ov .crumbs {display: none;}
.bdk-ov .head-more {display: inline-flex; align-items: center; min-height: var(--touch-height); margin: -12px 0;}
.bdk-ov .head-desc:not(.open) {display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.bdk-ov .head-stats {flex-wrap: wrap;}
.bdk-ov .tabs a {height: var(--touch-height);}
.bdk-ov .seg button::after {content: ""; position: absolute; inset: calc((var(--chip-height) - var(--touch-height)) / 2) 0;}
.bdk-ov .seg .lbl {position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0);}
.bdk-ov .opt {min-height: var(--touch-height);}
.bdk-ov .token {height: var(--touch-height);}
.bdk-ov .token button {width: 32px; height: 32px;}
.bdk-ov .toolbar {gap: var(--gap-related);}
.bdk-ov .toolbar .field-search {flex: 1 1 100%;}
.bdk-ov .field-search .field-clear {width: 36px; height: 36px;}
.bdk-ov .cards {grid-template-columns: 1fr; padding: var(--gap-related); gap: var(--gap-related);}
}
.bdk-ov .mlist {list-style: none; margin: 0; padding: 0;}
.bdk-ov .mlist li {border-bottom: 1px solid var(--border);}
.bdk-ov .mlist li:last-child {border-bottom: 0;}
.bdk-ov .mlist a {display: flex; align-items: center; gap: var(--gap-group); min-height: 56px; padding: var(--gap-related) var(--gap-group); text-decoration: none;}
.bdk-ov .mlist .ml-main {flex: 1; min-width: 0;}
.bdk-ov .mlist .ml-title {display: block; font-weight: 600; color: var(--display);}
.bdk-ov .mlist .ml-meta {display: flex; flex-wrap: wrap; gap: 2px var(--gap-related); font-size: var(--font-meta); line-height: var(--line-meta); color: var(--muted); margin-top: 2px;}
.bdk-ov .mlist .icon {color: var(--muted);}
.bdk-ov .tabwrap {display: grid; grid-template-columns: var(--rail-width) minmax(0, 1fr); gap: var(--gutter); align-items: start; margin-top: 24px;}
.bdk-ov .rtabs {display: flex; flex-direction: column; gap: 2px; position: sticky; top: calc(var(--appbar-height) + var(--gap-section));}
.bdk-ov .rtab {display: flex; align-items: center; justify-content: space-between; gap: 6px; height: var(--control-height-lg); padding: 0 var(--gap-group); border-radius: var(--radius-control); white-space: nowrap; color: var(--muted); font-weight: 500;}
.bdk-ov .rtab .lb {display: inline-flex; flex-direction: column;}
.bdk-ov .rtab .lb::after {content: attr(data-label); font-weight: 600; height: 0; overflow: hidden; visibility: hidden;}
.bdk-ov .rtab:hover {background: var(--surface-muted); color: var(--ink);}
.bdk-ov .rtab[aria-selected="true"] {background: var(--selected); color: var(--ink); font-weight: 600; box-shadow: inset 0 0 0 1px var(--field-line);}
.bdk-ov .tcount {display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 4px; border-radius: var(--radius-control); background: var(--surface-muted); color: var(--muted); font-size: var(--font-meta); line-height: 1; font-weight: 600; font-variant-numeric: tabular-nums;}
.bdk-ov .rtab[aria-selected="true"] .tcount {background: var(--surface); color: var(--ink);}
@media (max-width: 1023px) {
.bdk-ov .tabwrap {grid-template-columns: minmax(0, 1fr); gap: var(--gap-group);}
.bdk-ov .rtabs {display: none;}
}
.bdk-ov .chip-danger {background: var(--danger-tint); color: var(--danger-text);}
.bdk-ov {--bd-teal: #0d5951;
  --bd-teal-deep: #0a4741;
  --bd-blue: #3f88a7;
  --bd-magenta: #b14581;
  --bd-plum: #663552;
  --bd-pink: #f4b6d5;
  --bd-sky: #9cc8da;
  --bd-mint: #d3e7e2;

  --ink: #eaf3f1;
  --muted: #b9d3ce;
  --display: #ffffff;
  --inverse: #ffffff;
  --surface: var(--bd-teal);
  --surface-muted: var(--bd-teal-deep);
  --border: #3a8076;
  --field-line: #78aaa2;
  --selected: #1b6e65;
  --fill: var(--bd-magenta);
  --fill-hover: #93356a;
  --brand-text: var(--bd-pink);
  --selection: #7a3a60;
  --journey: var(--bd-pink);
  --journey-tint: var(--bd-plum);
  --journey-line: #eba9cc;
  --success-text: #8fe3bd;
  --warning-text: #ffd590;
  --mix-core: #ffffff;
  --mix-primary: var(--bd-sky);
  --mix-supporting: var(--bd-blue);
  --identity-coral: var(--bd-pink);
  --scrim: rgba(0, 0, 0, .4);
  --overlay-shadow: 0 10px 28px rgba(0, 0, 0, .28);

  --font-ui: Roboto, ui-sans-serif, system-ui, sans-serif;
  --font-reading: Roboto, ui-sans-serif, system-ui, sans-serif;
  --font-slab: "Roboto Slab", Georgia, serif;

  --radius-control: 2px;
  --radius-card: 4px;
  --font-title: 17px;
  --line-title: 24px;
  --font-page: 28px;
  --line-page: 36px;}
.bdk-ov {color-scheme: dark;}
.bdk-ov h1, .bdk-ov h2, .bdk-ov h3 {font-family: var(--font-slab);}
.bdk-ov input::placeholder {color: var(--muted); opacity: 1;}
.bdk-ov .btn-primary {background: var(--fill); border-color: var(--fill); color: #ffffff;}
.bdk-ov .btn-primary:hover, .bdk-ov .btn-primary:active {background: var(--fill-hover); border-color: var(--fill-hover); color: #ffffff;}
.bdk-ov .btn-secondary {border-color: var(--field-line);}
.bdk-ov .btn[aria-pressed] {border-color: var(--field-line) !important;}
.bdk-ov .btn[aria-pressed="true"] {background: var(--bd-pink) !important; border-color: var(--bd-pink) !important; color: var(--bd-plum) !important;}
.bdk-ov .chip-success {background: #d9f3e6; color: #065f46;}
.bdk-ov .chip-warning {background: #ffefcc; color: #8a3b0b;}
.bdk-ov .p2b-band {background: var(--bd-magenta);
  --surface: var(--bd-magenta);
  --surface-muted: #9c3a71;
  --border: #c9709f;
  --field-line: #e7a9c9;
  --ink: #ffffff;
  --display: #ffffff;
  --muted: #fff2f8;
  --brand-text: #ffffff;
  --journey: #ffffff;
  --inverse: var(--bd-plum);
  --success-text: #dcfbe9;
  --warning-text: #fff0cf;
  --mix-primary: var(--bd-pink);
  --mix-core: #ffffff;
  --font-meta: 13px;
  --line-meta: 18px;
  color: var(--ink);}
.bdk-ov .p2b-light {--surface: #ffffff;
  --border: #e5e5e5;
  --field-line: #8a8580;
  --ink: #2d2926;
  --display: #2d2926;
  --muted: #5e5a57;
  color: var(--ink);}

/* One block, two layouts: the wide one from 960px of available width, the narrow one below. */
.bdk-ov { container-type: inline-size; }
@container (max-width: 959px) { .bdk-ov__wide { display: none; } }
@container (min-width: 960px) { .bdk-ov__narrow { display: none; } }
.bdk-ov [data-bdk-slot="courses"] a { color: var(--brand-text); font-weight: 600; text-decoration: none; }
.bdk-ov [data-bdk-slot="courses"] a:hover { text-decoration: underline; }

@media print {
  .bdk-ov, .bdk-ov * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .bdk-ov .p2b-noprint { display: none !important; }
  .bdk-ov .panel[style*="overflow-x"] { overflow: visible !important; }
  /* Seven or eight steps make a taller diagram: draw it smaller so it fits one page with its heading. */
  .bdk-ov .p2b-dense { zoom: 0.76; }
  .bdk-ov section, .bdk-ov .panel, .bdk-ov li, .bdk-ov figure, .bdk-ov dl, .bdk-ov .p2b-band { break-inside: avoid; }
  .bdk-ov h2, .bdk-ov h3 { break-after: avoid; }
}