@layer zs-form-base {
  :root {
    /*Exact tokens recovered from the live “Живой след” build.*/
    --background: hsl(158 44% 7%);
    --foreground: hsl(43 25% 90%);
    --muted: hsl(158 20% 14%);
    --muted-foreground: hsl(43 15% 58%);
    --border: hsl(43 20% 22%);
    --elevated: hsl(158 36% 11%);
    --surface: hsl(158 32% 13%);
    --surface-2: hsl(158 28% 17%);
    --accent: hsl(43 62% 52%);
    --accent-foreground: hsl(158 44% 7%);
    /*Utility shades present in the same site CSS.*/
    --forest-50: hsl(160 25% 96%);
    --forest-100: hsl(160 22% 90%);
    --forest-200: hsl(160 20% 80%);
    --forest-300: hsl(160 18% 65%);
    --forest-400: hsl(160 16% 48%);
    --forest-500: hsl(158 28% 28%);
    --forest-600: hsl(158 32% 20%);
    --forest-700: hsl(158 36% 14%);
    --forest-950: hsl(160 48% 5%);
    --gold-300: hsl(43 68% 68%);
    --gold-400: hsl(43 65% 58%);
    --gold-500: hsl(43 62% 48%);
    --gold-600: hsl(40 65% 40%);
    --danger: hsl(6 37% 57%);
    --max: 1180px;
    --radius: 4px;
    --radius-soft: 7px;
    --focus: 0 0 0 2px hsl(43 62% 52% / .22);
  }

  * {
    box-sizing: border-box;
  }

  html {
    background: var(--background);
    scroll-behavior: smooth;
  }

  body {
    margin: 0;
    min-height: 100vh;
    color: var(--foreground);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }

  button, input, textarea {
    font: inherit;
  }

  button {
    cursor: pointer;
  }

  ::selection {
    background: hsl(43 62% 48% / .3);
    color: #fbf2da;
  }

  .app-shell {
    min-height: 100vh;
  }

  .topbar {
    padding: 0 max(28px, calc((100vw - var(--max)) / 2));
    justify-content: space-between;
  }

  .text-button, .back-link {
    border: 0;
    background: transparent;
    color: var(--muted-foreground);
    padding: 8px 0;
    transition: color .15s ease;
  }

  .text-button:hover, .back-link:hover {
    color: var(--gold-300);
  }

  .workspace {
    width: min(var(--max), calc(100% - 40px));
  }

  .screen {
    animation: fade .18s ease-out;
  }

  @keyframes fade {
    from {
      opacity: 0;
      transform: translateY(3px);
    }

    to {
      opacity: 1;
      transform: none;
    }
  }

  .eyebrow {
    margin: 0 0 11px;
    color: var(--gold-400);
    text-transform: uppercase;
  }

  h1 {
    margin: 0;
    color: var(--foreground);
  }

  .lead {
    margin: 17px 0 0;
  }

  .pedigree-picker {
    position: relative;
  }

  .pedigree-person {
    border: 1px solid var(--forest-600);
    background: transparent;
    color: var(--forest-200);
  }

  .pedigree-person--you {
    border-radius: 50%;
    margin: 0 auto 35px;
    display: grid;
    place-items: center;
    color: var(--foreground);
    position: relative;
  }

  .pedigree-families {
    display: grid;
    grid-template-columns: 1fr 1fr;
    position: relative;
  }

  .parent-family {
    position: relative;
  }

  .parent-family::before {
    display: none;
  }

  .pedigree-person--context {
    min-height: 28px;
    margin: 0 auto 30px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 0;
    position: relative;
    line-height: 1.2;
    background: transparent;
  }

  .parent-branches {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    position: relative;
    background: transparent;
    border-top: 1px solid hsl(43 20% 22% / .48);
    border-bottom: 1px solid hsl(43 20% 22% / .48);
  }

  .branch-option {
    text-align: left;
    border: 0;
    color: var(--foreground);
    position: relative;
    transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
  }

  .branch-option + .branch-option {
    border-left: 2px solid hsl(43 20% 34% / .62);
  }

  .branch-option:last-child {
    border-right: 0;
  }

  .branch-option:hover {
    box-shadow: inset 0 -2px 0 hsl(43 62% 48% / .52);
  }

  .branch-option:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: -2px;
  }

  .branch-option__relation {
    color: var(--forest-100);
    line-height: 1.35;
  }

  .branch-option__path {
    opacity: .72;
  }

  .branch-option__cta {
    color: var(--gold-400);
    font-weight: 600;
    text-transform: uppercase;
  }

  .branch-option[disabled] {
    opacity: .3;
    cursor: not-allowed;
  }

  .note-block {
    display: grid;
    align-items: baseline;
    border-left: 1px solid var(--gold-500);
  }

  .note-block strong {
    font-weight: 500;
  }

  .line-context-strip {
    display: flex;
    align-items: center;
    gap: 0;
    margin: 0 0 30px;
    background: transparent;
    border-top: 1px solid hsl(43 20% 22% / .5);
    border-bottom: 1px solid hsl(43 20% 22% / .5);
    border-left: 0;
    border-right: 0;
    overflow-x: auto;
    position: relative;
  }

  .path-node {
    text-align: center;
    flex: 0 0 auto;
  }

  .path-node__circle {
    margin: 0 auto 7px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    border: 1px solid var(--forest-600);
  }

  .path-node--ancestor .path-node__circle {
    background: var(--gold-500);
    border-color: var(--gold-500);
  }

  .path-connector {
    min-width: 34px;
    flex: 1 1 64px;
    height: 1px;
    background: transparent;
  }

  .primary-button, .secondary-button {
    min-height: 47px;
    border-radius: var(--radius);
    padding: 0 20px;
    font-weight: 600;
    border: 1px solid transparent;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
  }

  .primary-button {
    background: var(--gold-500);
  }

  .primary-button:hover {
    background: var(--gold-400);
    transform: translateY(-1px);
  }

  .secondary-button {
    background: transparent;
  }

  .secondary-button:hover {
    border-color: var(--gold-600);
  }

  .secondary-button--compact {
    min-height: 39px;
  }

  .ancestor-form--expanded {
    display: grid;
    gap: 0;
  }

  .form-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    border-top: 1px solid hsl(43 20% 22% / .58);
    border-bottom: 1px solid hsl(43 20% 22% / .58);
  }

  .form-section {
    background: transparent;
    border: 0;
    border-radius: 0;
  }

  .form-columns > .form-section + .form-section {
    border-left: 1px solid hsl(43 20% 22% / .55);
  }

  .form-section__head {
    display: flex;
    align-items: flex-start;
    border-bottom: 1px solid hsl(43 20% 22% / .65);
  }

  .section-index {
    flex: 0 0 auto;
    color: var(--gold-400);
  }

  .form-section h2 {
    margin: 0;
    color: var(--foreground);
    font-family: "Playfair Display", Georgia, serif;
    font-size: 26px;
    font-weight: 400;
    line-height: 1.1;
  }

  .form-section__head p {
    margin: 7px 0 0;
    color: var(--muted-foreground);
    opacity: .88;
    font-size: 12px;
    max-width: 620px;
    line-height: 1.6;
  }

  .field, .field-group {
    display: block;
    margin: 0 0 20px;
    padding: 0;
    border: 0;
  }

  .field:last-child, .field-group:last-child {
    margin-bottom: 0;
  }

  .field__label, legend {
    display: block;
    padding: 0;
    margin: 0 0 8px;
    color: var(--forest-100);
    font-weight: 500;
    font-size: 12px;
  }

  .field__label b {
    color: var(--danger);
  }

  .field-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }

  input, textarea {
    width: 100%;
    border: 1px solid var(--forest-600);
    border-radius: var(--radius);
    background: var(--elevated);
    color: var(--foreground);
    padding: 12px 13px;
    outline: none;
    transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
  }

  input::placeholder, textarea::placeholder {
    color: var(--muted-foreground);
    opacity: .5;
  }

  textarea {
    resize: vertical;
  }

  input:hover, textarea:hover {
    border-color: hsl(43 20% 22% / .95);
  }

  input:focus, textarea:focus {
    border-color: var(--gold-600);
    box-shadow: var(--focus);
    background: var(--background);
  }

  small {
    display: block;
  }

  .segmented {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border: 1px solid hsl(43 20% 22% / .52);
    overflow: hidden;
  }

  .segmented--three {
    grid-template-columns: repeat(3, 1fr);
  }

  .segmented label {
    position: relative;
  }

  .segmented input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
  }

  .segmented span {
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 0;
    transition: .14s ease;
  }

  .segmented label:hover span {
    color: var(--foreground);
    background: var(--surface-2);
  }

  .segmented input:checked + span {
    color: var(--gold-300);
    background: var(--surface-2);
    box-shadow: inset 0 -2px 0 var(--gold-500);
  }

  .conditional-field {
    margin-top: 9px;
  }

  .conditional-value {
    margin-top: 8px;
  }

  .field-state {
    display: flex;
    align-items: center;
    padding: 0 13px;
    border: 1px solid var(--forest-600);
    opacity: .76;
  }

  .repeatable-block {
    border-top: 1px solid hsl(43 20% 22% / .38);
  }

  .repeatable-block__head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
  }

  .inline-add {
    border: 0;
    padding: 2px 0;
    background: transparent;
    color: var(--gold-400);
    font-weight: 500;
    text-transform: uppercase;
    white-space: nowrap;
  }

  .inline-add:hover {
    color: var(--gold-300);
  }

  .repeatable-list {
    display: grid;
  }

  .repeatable-row {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(110px, .7fr) auto;
    gap: 8px;
    align-items: center;
  }

  .remove-row {
    border: 1px solid var(--forest-600);
    background: transparent;
  }

  .remove-row:hover {
    color: var(--danger);
    border-color: var(--danger);
  }

  .empty-repeatable {
    opacity: .68;
  }

  .clue-toggle-grid {
    display: flex;
    flex-wrap: wrap;
  }

  .clue-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--forest-600);
    background: transparent;
    font-weight: 500;
    transition: .14s ease;
  }

  .clue-toggle:hover {
    border-color: var(--gold-600);
    color: var(--gold-300);
  }

  .clue-toggle.is-active {
    box-shadow: inset 0 -1px 0 hsl(43 62% 48% / .45);
  }

  .clue-toggle.is-active::before {
    content: "";
    width: 5px;
    height: 5px;
    margin-right: 7px;
    display: inline-block;
    vertical-align: 1px;
    border-radius: 50%;
    background: var(--gold-500);
  }

  .clue-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 18px;
  }

  .clue-field {
    margin: 0;
  }

  .clue-field textarea {
    min-height: 92px;
  }

  .upload-zone {
    border: 1px dashed hsl(43 20% 22% / .95);
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-areas: "title action" "meta action";
    align-items: center;
    gap: 3px 18px;
    outline: none;
    transition: .15s ease;
  }

  .upload-zone:focus, .upload-zone.is-dragover {
    border-color: var(--gold-500);
    background: hsl(43 62% 48% / .045);
    box-shadow: var(--focus);
  }

  .upload-zone__title {
    grid-area: title;
    font-weight: 500;
  }

  .upload-zone__meta {
    grid-area: meta;
  }

  .upload-zone .secondary-button {
    grid-area: action;
  }

  .attachment-list {
    display: grid;
    gap: 9px;
    margin-top: 14px;
  }

  .attachment-item {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    border-top: 1px solid hsl(43 20% 22% / .38);
    padding: 10px 0;
    background: transparent;
  }

  .attachment-thumb {
    width: 46px;
    height: 46px;
    border-radius: var(--radius);
    border: 1px solid var(--forest-600);
    background: var(--surface);
    overflow: hidden;
    display: grid;
    place-items: center;
    color: var(--forest-400);
    font-size: 10px;
    font-weight: 600;
  }

  .attachment-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .attachment-name {
    color: var(--forest-100);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .attachment-meta {
    color: var(--muted-foreground);
    opacity: .68;
    margin-top: 2px;
  }

  .attachment-remove {
    border: 0;
    background: transparent;
    color: var(--forest-300);
    opacity: .72;
    padding: 7px;
  }

  .attachment-remove:hover {
    color: var(--danger);
  }

  .form-footer--expanded {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 20px;
    border-top: 1px solid hsl(43 20% 22% / .55);
  }

  .research-summary {
    display: grid;
  }

  .summary-card {
    display: grid;
    align-items: center;
  }

  .summary-card__line {
    color: var(--gold-400);
    font-weight: 600;
    text-transform: uppercase;
  }

  .summary-card__edit {
    border: 0;
    background: transparent;
    color: var(--gold-400);
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .summary-actions {
    display: flex;
    justify-content: space-between;
    gap: 14px;
  }

  .summary-actions .primary-button {
    margin-left: auto;
  }

  .submitted-mark {
    display: grid;
    place-items: center;
    background: var(--gold-500);
    font-size: 22px;
    margin-bottom: 22px;
  }

  /*SVG geometry preserved from the stable version.*/

  .pedigree-picker, .line-context-strip {
    position: relative;
  }

  .pedigree-picker .pedigree-person, .pedigree-picker .pedigree-families, .pedigree-picker .parent-family, .pedigree-picker .parent-branches, .pedigree-picker .branch-option, .line-context-strip .path-node, .line-context-strip .path-connector {
    position: relative;
    z-index: 2;
  }

  .pedigree-connectors, .path-connectors {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
    pointer-events: none;
    z-index: 1;
  }

  .pedigree-connectors path, .path-connectors line {
    fill: none;
    stroke: hsl(43 62% 48% / .42);
    stroke-width: 1.05;
    vector-effect: non-scaling-stroke;
    shape-rendering: geometricPrecision;
  }

  .path-connectors line.is-dotted {
    stroke-dasharray: 5 7;
  }

  :focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
    border-radius: 2px;
  }

  input:focus-visible, textarea:focus-visible {
    outline: none;
  }

  @media (max-width:940px) {
    .workspace {
      width: min(100% - 28px, var(--max));
    }

    .brand__meta {
      display: none;
    }

    .pedigree-families {
      gap: 14px;
    }

    .form-columns {
      grid-template-columns: 1fr;
    }

    .form-columns > .form-section + .form-section {
      border-left: 0;
      border-top: 1px solid hsl(43 20% 22% / .55);
    }

    .clue-fields {
      grid-template-columns: 1fr;
    }

    .summary-card {
      gap: 10px;
    }

    .summary-card__edit {
      justify-self: start;
    }
  }

  @media (max-width:640px) {
    h1 {
      font-size: 39px;
    }

    .workspace {
      width: min(100% - 24px, var(--max));
    }

    .path-connector {
      min-width: 20px;
    }

    .field-row {
      grid-template-columns: 1fr;
    }

    .repeatable-block__head {
      flex-direction: column;
      gap: 8px;
    }

    .upload-zone {
      grid-template-columns: 1fr;
      grid-template-areas: "title" "meta" "action";
    }

    .upload-zone .secondary-button {
      width: 100%;
      margin-top: 10px;
    }

    .form-footer--expanded {
      flex-direction: column;
      align-items: stretch;
    }

    .form-footer--expanded .primary-button {
      width: 100%;
    }

    .summary-actions .primary-button {
      margin-left: 0;
    }

    .primary-button, .secondary-button {
      width: 100%;
    }
  }

  .form-section--documents {
    padding-bottom: 24px;
  }

  :root {
    --background: #061b15;
    --foreground: #f3f0e7;
    --muted: #0a281f;
    --muted-foreground: #b7c2ba;
    --faint: #87998f;
    --border: rgba(225,185,102,.22);
    --elevated: #082119;
    --surface: #09251d;
    --surface-2: #0a281f;
    --accent: #e1b966;
    --accent-foreground: #241d10;
    --forest-100: #e3e8e4;
    --forest-200: #c8d0cb;
    --forest-300: #a9b7ae;
    --forest-400: #87998f;
    --forest-500: #526d60;
    --forest-600: #28483b;
    --gold-300: #f0d89e;
    --gold-400: #e8c778;
    --gold-500: #e1b966;
    --gold-600: #bc9344;
    --max: 1160px;
  }

  body {
    background: radial-gradient(circle at 78% 5%,rgba(225,185,102,.025),transparent 28%),
    linear-gradient(180deg,#071e17 0%,#061b15 56%,#051913 100%);
    font-family: Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    font-size: 16px;
    line-height: 1.6;
  }

  .topbar {
    position: sticky;
    top: 0;
    z-index: 40;
    height: 82px;
    padding: 0 max(24px,calc((100vw - var(--max))/2));
    background: rgba(4,20,15,.94);
    border-bottom: 1px solid rgba(225,185,102,.22);
    backdrop-filter: blur(16px);
  }

  .brand {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    text-decoration: none;
  }

  .brand__name {
    font-family: Georgia,"Times New Roman",serif;
    font-size: 22px;
    line-height: 1;
    letter-spacing: -.01em;
    color: #efeadd;
    text-transform: none;
  }

  .brand__meta {
    margin-top: 7px;
    color: #c5a957;
    font-size: 11.5px;
    line-height: 1;
    letter-spacing: .12em;
    text-transform: uppercase;
  }

  .draft-status {
    color: #7f9187;
    font-size: 12.5px;
    white-space: nowrap;
  }

  .text-button,.back-link {
    font-size: 13.5px;
    color: #b3beb7;
  }

  .text-button:hover,.back-link:hover {
    color: var(--gold-300);
  }

  .workspace {
    width: min(var(--max),calc(100% - 48px));
    margin: 0 auto;
    padding: 34px 0 92px;
  }

  .intake-progress {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 0;
    margin: 0 0 58px;
    border-bottom: 1px solid rgba(225,185,102,.18);
  }

  .intake-progress button {
    appearance: none;
    -webkit-appearance: none;
    position: relative;
    padding: 0 0 15px;
    border: 0;
    background: transparent;
    color: #778a80;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .01em;
    text-align: left;
    cursor: default;
  }

  .intake-progress button:not(:disabled) {
    cursor: pointer;
  }

  .intake-progress button:not(:disabled):hover {
    color: var(--gold-300);
  }

  .intake-progress button:focus-visible {
    outline: 1px solid rgba(225,185,102,.40);
    outline-offset: -3px;
  }

  .intake-progress button:nth-child(2) {
    text-align: center;
  }

  .intake-progress button:nth-child(3) {
    text-align: right;
  }

  .intake-progress button::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: transparent;
  }

  .intake-progress button.is-active {
    color: var(--foreground);
  }

  .intake-progress button.is-active::after {
    background: var(--accent);
  }

  .intake-progress button.is-done {
    color: #aab6af;
  }

  .intake-progress button.is-done::after {
    background: rgba(225,185,102,.34);
  }

  .screen-heading {
    max-width: 860px;
    margin-bottom: 42px;
  }

  .screen-heading--compact {
    margin-bottom: 30px;
  }

  .eyebrow {
    margin-bottom: 14px;
    color: var(--accent);
    font-size: 12.5px;
    font-weight: 750;
    letter-spacing: .16em;
  }

  h1 {
    max-width: 980px;
    font-family: Georgia,"Times New Roman",serif;
    font-size: clamp(44px,5.6vw,72px);
    line-height: 1.01;
    font-weight: 500;
    letter-spacing: -.035em;
  }

  .screen--form h1,.screen--summary h1 {
    font-size: clamp(40px,4.6vw,62px);
  }

  .lead {
    margin-top: 18px;
    max-width: 760px;
    color: #b7c2ba;
    font-size: 17px;
    line-height: 1.72;
  }

  .pedigree-picker {
    padding: 38px 36px 42px;
    background: #082119;
    border: 1px solid rgba(225,185,102,.26);
    border-radius: 0;
  }

  .pedigree-person--you {
    width: 66px;
    height: 66px;
    margin-bottom: 40px;
    background: #0a281f;
    border-color: rgba(225,185,102,.6);
    color: var(--gold-300);
    font-family: Georgia,"Times New Roman",serif;
    font-size: 18px;
  }

  .pedigree-families {
    gap: 28px;
  }

  .pedigree-person--context {
    max-width: none;
    margin-bottom: 34px;
    color: #e1e7e3;
    font-family: Georgia,"Times New Roman",serif;
    font-size: 21px;
    font-weight: 500;
  }

  .parent-branches {
    border-color: rgba(225,185,102,.22);
  }

  .branch-option {
    min-height: 156px;
    padding: 24px 22px 20px;
    background: #09251d;
  }

  .branch-option + .branch-option {
    border-left-color: rgba(225,185,102,.28);
  }

  .branch-option:hover {
    background: #0a2a20;
    box-shadow: inset 0 -2px 0 var(--accent);
  }

  .branch-option__relation {
    font-family: Georgia,"Times New Roman",serif;
    color: var(--foreground);
    font-size: 20px;
    font-weight: 500;
  }

  .branch-option__path {
    margin-top: 11px;
    color: #91a097;
    font-size: 13.5px;
    line-height: 1.5;
  }

  .branch-option__cta {
    margin-top: 23px;
    color: var(--gold-300);
    font-size: 12.5px;
    letter-spacing: .055em;
  }

  .note-block {
    margin-top: 26px;
    grid-template-columns: 220px minmax(0,1fr);
    gap: 24px;
    padding: 20px 0 0 22px;
    color: #a6b3ab;
    font-size: 14.5px;
    line-height: 1.65;
    opacity: 1;
  }

  .note-block strong {
    color: #e3e8e4;
    font-size: 14.5px;
  }

  .back-link {
    margin-bottom: 28px;
  }

  .line-context-strip {
    margin-bottom: 34px;
    padding: 20px 4px;
    border-color: rgba(225,185,102,.22);
    scrollbar-width: none;
  }

  .line-context-strip::-webkit-scrollbar {
    display: none;
  }

  .path-node {
    min-width: 116px;
  }

  .path-node__circle {
    width: 40px;
    height: 40px;
    margin-bottom: 8px;
    border-color: #355748;
    background: #09251d;
    color: #aebbb3;
    font-family: Georgia,"Times New Roman",serif;
    font-size: 14px;
  }

  .path-node--future .path-node__circle {
    border-color: rgba(225,185,102,.76);
    color: var(--gold-300);
  }

  .path-node--ancestor .path-node__circle {
    background: var(--accent);
    color: #231d10;
  }

  .path-node__label {
    color: #c2cbc5;
    font-size: 13px;
    line-height: 1.35;
  }

  .pedigree-connectors path,.path-connectors line {
    stroke: rgba(225,185,102,.5);
    stroke-width: 1.15;
  }

  .form-columns {
    background: #071f18;
    border: 1px solid rgba(225,185,102,.24);
  }

  .form-columns>.form-section+.form-section {
    border-left-color: rgba(225,185,102,.22);
  }

  .form-section {
    padding: 38px 38px 42px;
  }

  .form-section--wide {
    margin-top: 0;
    padding: 40px 38px 44px;
    background: #082119;
    border: 1px solid rgba(225,185,102,.20);
    border-top: 0;
  }

  .form-section__head {
    gap: 18px;
    padding-bottom: 22px;
    margin-bottom: 28px;
    border-bottom-color: rgba(225,185,102,.18);
  }

  .form-columns .form-section__head {
    padding-bottom: 18px;
    margin-bottom: 27px;
    border-bottom: 1px solid rgba(225,185,102,.14);
  }

  .section-index {
    color: var(--accent);
    font-size: 13px;
    font-weight: 750;
    letter-spacing: .12em;
    padding-top: 5px;
  }

  .form-section h2,.contact-section h2 {
    margin: 0;
    color: var(--foreground);
    font-family: Georgia,"Times New Roman",serif;
    font-size: 30px;
    font-weight: 500;
    line-height: 1.08;
    letter-spacing: -.02em;
  }

  .form-section__head p,.contact-section__head p {
    margin: 8px 0 0;
    color: #aab6af;
    font-size: 14px;
    line-height: 1.6;
  }

  .field,.field-group {
    margin-bottom: 24px;
  }

  .field__label,legend {
    margin-bottom: 9px;
    color: #dce2de;
    font-size: 14.5px;
    font-weight: 600;
  }

  input,textarea {
    min-height: 50px;
    padding: 13px 14px;
    border-color: #2a4b3e;
    border-radius: 0;
    background: #061b15;
    color: var(--foreground);
    font-size: 16px;
  }

  textarea {
    min-height: 110px;
  }

  input::placeholder,textarea::placeholder {
    color: #71847a;
    opacity: 1;
  }

  input:hover,textarea:hover {
    border-color: #4c665a;
  }

  input:focus,textarea:focus {
    border-color: var(--accent);
    background: #061b15;
    box-shadow: 0 0 0 2px rgba(225,185,102,.08);
  }

  small {
    margin-top: 7px;
    color: #899990;
    font-size: 13px;
    line-height: 1.55;
    opacity: 1;
  }

  .segmented {
    gap: 0;
    margin-bottom: 12px;
    background: transparent;
    border-color: #2d4d40;
    border-radius: 0;
  }

  .segmented span {
    min-height: 45px;
    background: #09251d;
    color: #a8b5ad;
    font-size: 13px;
  }

  .segmented label+label span {
    border-left: 1px solid #2d4d40;
  }

  .segmented input:checked+span {
    color: var(--gold-300);
    background: #0a2a20;
    box-shadow: inset 0 -2px 0 var(--accent);
  }

  .field-state {
    min-height: 50px;
    border-radius: 0;
    border-color: #2d4d40;
    background: #071f18;
    color: #9eaaa3;
    font-size: 14px;
  }

  .repeatable-block {
    padding-top: 22px;
    margin-top: 22px;
    border-top-color: rgba(225,185,102,.14);
  }

  .repeatable-block__head {
    align-items: center;
  }

  .inline-add {
    color: var(--gold-300);
    font-size: 12.5px;
    letter-spacing: .04em;
  }

  .repeatable-list {
    gap: 10px;
    margin-top: 15px;
  }

  .repeatable-row input {
    padding: 11px 12px;
  }

  .remove-row {
    width: 38px;
    height: 38px;
    border-radius: 0;
    border-color: #345246;
    color: #8fa097;
    font-size: 17px;
  }

  .empty-repeatable {
    color: #87998f;
    font-size: 13px;
    padding: 8px 0;
  }

  .clue-toggle-grid {
    gap: 10px;
  }

  .clue-toggle {
    min-height: 44px;
    padding: 0 17px;
    border-radius: 0;
    border-color: #315044;
    color: #c4cdc7;
    font-size: 13.5px;
  }

  .clue-toggle.is-active {
    background: #0a2a20;
    color: var(--gold-300);
    border-color: rgba(225,185,102,.62);
  }

  .upload-zone {
    padding: 22px 24px;
    border-radius: 0;
    border-color: rgba(225,185,102,.28);
    background: #071f18;
  }

  .upload-zone__title {
    color: #e1e7e3;
    font-size: 15px;
  }

  .upload-zone__meta {
    color: #94a299;
    font-size: 13px;
    opacity: 1;
  }

  .attachment-name {
    font-size: 14px;
  }

  .attachment-meta {
    font-size: 12px;
  }

  .primary-button,.secondary-button {
    min-height: 48px;
    border-radius: 0;
    padding: 0 21px;
    font-size: 13px;
    font-weight: 750;
    letter-spacing: .025em;
  }

  .primary-button {
    background: var(--accent);
    color: #2c2414;
    border-color: var(--accent);
  }

  .primary-button:hover {
    background: var(--gold-300);
  }

  .secondary-button {
    border-color: rgba(225,185,102,.34);
    color: #e3e8e4;
  }

  .secondary-button:hover {
    border-color: var(--accent);
    color: var(--gold-300);
    background: rgba(225,185,102,.05);
  }

  .form-footer--expanded {
    padding: 22px 0 4px;
    border-top-color: rgba(225,185,102,.18);
  }

  .research-summary {
    gap: 0;
    border: 1px solid rgba(225,185,102,.22);
  }

  .summary-card {
    grid-template-columns: 240px minmax(0,1fr) auto;
    gap: 26px;
    padding: 28px 30px;
    background: #082119;
    border: 0;
    border-radius: 0;
  }

  .summary-card+.summary-card {
    border-top: 1px solid rgba(225,185,102,.18);
  }

  .summary-card__line {
    color: var(--accent);
    font-size: 12.5px;
    letter-spacing: .1em;
  }

  .summary-card__path {
    margin-top: 7px;
    color: #8e9d94;
    font-size: 13px;
  }

  .summary-card__name {
    font-family: Georgia,"Times New Roman",serif;
    font-size: 27px;
    color: var(--foreground);
  }

  .summary-card__meta {
    margin-top: 6px;
    color: #aab6af;
    font-size: 14px;
  }

  .summary-card__facts {
    margin-top: 9px;
    color: #c3ccc6;
    font-size: 13px;
  }

  .summary-card__edit {
    color: var(--gold-300);
    font-size: 13px;
  }

  .contact-section {
    margin-top: 28px;
    padding: 34px 36px 38px;
    background: #071f18;
    border: 1px solid rgba(225,185,102,.22);
  }

  .contact-section__head {
    display: flex;
    gap: 18px;
    align-items: flex-start;
    padding-bottom: 24px;
    margin-bottom: 26px;
    border-bottom: 1px solid rgba(225,185,102,.16);
  }

  .contact-grid {
    display: grid;
    grid-template-columns: 1.05fr 1fr 1fr;
    gap: 14px;
  }

  .contact-grid .field {
    margin: 0;
  }

  .contact-error {
    margin: 14px 0 0;
    color: #d99484;
    font-size: 14px;
  }

  .summary-actions {
    margin-top: 28px;
    align-items: center;
  }

  .screen--submitted {
    max-width: 960px;
  }

  .submitted-mark {
    width: 58px;
    height: 58px;
    border-radius: 0;
    background: var(--accent);
    color: #251f12;
  }

  .research-summary--submitted {
    margin-top: 34px;
  }

  .submitted-contact {
    margin-top: 20px;
    padding: 16px 0;
    border-top: 1px solid rgba(225,185,102,.18);
    border-bottom: 1px solid rgba(225,185,102,.18);
    color: #cbd3ce;
    font-size: 14px;
  }

  .topbar {
    display: grid;
    grid-template-columns: minmax(180px,1fr) auto;
    align-items: center;
    column-gap: 28px;
  }

  .brand {
    justify-self: start;
  }

  .topbar__actions {
    grid-column: 2;
    justify-self: end;
    display: flex;
    align-items: center;
    gap: 22px;
    white-space: nowrap;
  }

  @media (max-width:940px) {
    .workspace {
      width: min(100% - 32px,var(--max));
      padding-top: 28px;
    }

    .topbar {
      padding: 0 18px;
      grid-template-columns: minmax(120px,1fr) auto;
      column-gap: 18px;
    }

    .draft-status {
      display: none;
    }

    .intake-progress {
      margin-bottom: 46px;
    }

    .form-section {
      padding: 32px 28px 36px;
    }

    .form-section--wide {
      padding: 34px 28px 38px;
    }

    .contact-grid {
      grid-template-columns: 1fr 1fr;
    }

    .contact-grid .field:first-child {
      grid-column: 1/-1;
    }

    .summary-card {
      grid-template-columns: 1fr auto;
    }

    .summary-card>div:first-child {
      grid-column: 1/-1;
    }
  }

  @media (max-width:640px) {
    .topbar {
      height: 68px;
      position: relative;
      grid-template-columns: 1fr auto;
      column-gap: 10px;
      padding: 0 12px;
    }

    .brand__name {
      font-size: 18px;
    }

    .brand__meta {
      display: none;
    }

    .text-button {
      font-size: 12px;
    }

    .topbar__actions {
      gap: 0;
    }

    .workspace {
      width: min(100% - 24px,var(--max));
      padding: 24px 0 64px;
    }

    .intake-progress {
      margin-bottom: 36px;
    }

    .intake-progress button {
      padding-bottom: 12px;
    }

    .intake-progress button {
      color: transparent;
      font-size: 0;
    }

    .intake-progress button::before {
      font-size: 12px;
      color: #778a80;
    }

    .intake-progress button:nth-child(1)::before {
      content: "Линия";
    }

    .intake-progress button:nth-child(2)::before {
      content: "Сведения";
    }

    .intake-progress button:nth-child(3)::before {
      content: "Передача сведений";
      display: block;
      white-space: normal;
      line-height: 1.35;
    }

    .intake-progress button.is-active::before {
      color: var(--foreground);
    }

    .intake-progress button.is-done::before {
      color: #aab6af;
    }

    h1,.screen--form h1,.screen--summary h1 {
      font-size: 39px;
      line-height: 1.04;
    }

    .lead {
      font-size: 16px;
      line-height: 1.65;
    }

    .pedigree-picker {
      padding: 28px 16px 30px;
    }

    .pedigree-families {
      grid-template-columns: 1fr;
      gap: 30px;
    }

    .pedigree-person--context {
      margin-bottom: 22px;
      font-size: 20px;
    }

    .parent-branches {
      grid-template-columns: 1fr 1fr;
    }

    .branch-option {
      min-height: 138px;
      padding: 18px 14px;
    }

    .branch-option__relation {
      font-size: 17px;
    }

    .branch-option__path {
      font-size: 12.5px;
    }

    .branch-option__cta {
      font-size: 11.5px;
    }

    .note-block {
      grid-template-columns: 1fr;
      gap: 5px;
      padding-left: 16px;
      font-size: 14px;
    }

    .line-context-strip {
      margin-inline: -4px;
      padding: 16px 4px;
    }

    .path-node {
      min-width: 100px;
    }

    .form-section {
      padding: 27px 18px 31px;
    }

    .form-section--wide {
      padding: 30px 18px 34px;
    }

    .form-section h2,.contact-section h2 {
      font-size: 27px;
    }

    .section-index {
      font-size: 12.5px;
    }

    .field__label,legend {
      font-size: 14px;
    }

    input,textarea {
      font-size: 16px;
    }

    .segmented {
      grid-template-columns: 1fr 1fr;
    }

    .segmented--three {
      grid-template-columns: repeat(3,1fr);
    }

    .segmented span {
      font-size: 12.5px;
      min-height: 44px;
      padding: 4px 7px;
    }

    .repeatable-row {
      grid-template-columns: 1fr 96px 38px;
    }

    .clue-toggle {
      font-size: 13px;
    }

    .upload-zone {
      padding: 19px 18px;
    }

    .summary-card {
      grid-template-columns: 1fr;
      padding: 24px 20px;
    }

    .summary-card>div:first-child {
      grid-column: auto;
    }

    .summary-card__edit {
      justify-self: start;
    }

    .contact-section {
      padding: 28px 20px 30px;
    }

    .contact-grid {
      grid-template-columns: 1fr;
    }

    .contact-grid .field:first-child {
      grid-column: auto;
    }

    .summary-actions {
      flex-direction: column-reverse;
      align-items: stretch;
    }

    .summary-actions .primary-button {
      margin: 0;
    }

    .primary-button,.secondary-button {
      width: 100%;
    }

    .pedigree-connectors {
      display: block;
    }
  }

  .word-alternative {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid rgba(225,185,102,.20);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    color: #98a79f;
    font-size: 13.5px;
  }

  .word-alternative strong {
    color: #c6d0ca;
    font-weight: 500;
  }

  .word-alternative a {
    flex: 0 0 auto;
    color: var(--gold-300);
    text-decoration: none;
    border-bottom: 1px solid rgba(225,185,102,.36);
    padding-bottom: 2px;
    transition: color .18s ease,border-color .18s ease,transform .18s ease;
  }

  .word-alternative a:hover {
    color: #f0d89e;
    border-color: #f0d89e;
    transform: translateX(2px);
  }

  .branch-option.has-data:after {
    content: attr(data-status);
    position: absolute;
    top: 14px;
    right: 14px;
    color: #7f9187;
    font-size: 10px;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .branch-option.has-data .branch-option__cta {
    color: #f0d89e;
  }

  @media (max-width:680px) {
    .word-alternative {
      align-items: flex-start;
      flex-direction: column;
      gap: 9px;
    }
  }

  .summary-legal {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid hsl(43 20% 22% / .72);
  }

  .summary-legal__consent {
    display: grid;
    grid-template-columns: 18px 1fr;
    gap: 10px;
    align-items: start;
    color: var(--forest-300);
    font-size: 12.5px;
    line-height: 1.55;
  }

  .summary-legal__consent input {
    width: 15px;
    height: 15px;
    margin: 3px 0 0;
    accent-color: var(--accent);
  }

  .summary-legal__consent a,.anketa-legal-links a {
    color: var(--gold-300);
    text-decoration: none;
    border-bottom: 1px solid hsl(43 62% 52% / .28);
  }

  .summary-legal__consent a:hover,.anketa-legal-links a:hover {
    color: #f4dfa6;
    border-color: hsl(43 62% 52% / .62);
  }

  .summary-legal__error {
    margin: 8px 0 0 28px;
    color: var(--danger);
    font-size: 12px;
  }

  .anketa-legal-links {
    width: min(var(--max),calc(100% - 40px));
    margin: 0 auto;
    padding: 0 0 30px;
    color: var(--forest-400);
    font-size: 11.5px;
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
  }

  @media (max-width:760px) {

    .summary-legal__consent {
      font-size: 12px;
    }
  }
}

[hidden] {
  display: none;
}

.pedigree-person--you::after, .pedigree-families::before, .pedigree-person--context::before, .pedigree-person--context::after, .parent-branches::before, .branch-option::before {
  display: none;
}

.path-connector, .path-connector--dotted {
  background: transparent;
}
.summary-submit-error {
  margin: 10px 0 0;
  color: #d6a39b;
  font-size: 13px;
  line-height: 1.5;
}
html {
  scrollbar-width: thin;
  scrollbar-color: rgba(184, 157, 83, .62) #041b15;
}
html::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
html::-webkit-scrollbar-track {
  background: #041b15;
}
html::-webkit-scrollbar-thumb {
  background: rgba(184, 157, 83, .55);
  border: 2px solid #041b15;
  border-radius: 999px;
}
html::-webkit-scrollbar-thumb:hover {
  background: rgba(211, 180, 92, .76);
}
html::-webkit-scrollbar-corner {
  background: #041b15;
}

/* Cursor-light tactility: the surface is the unit, never its child controls. */
@media (hover:hover) and (pointer:fine) {
  .tactile-surface {
    --touch-x: 50%;
    --touch-y: 50%;
    --touch-radius: 210px;
    --touch-size: 420px;
    position: relative;
    isolation: isolate;
  }

  .tactile-surface::after {
    content: "";
    position: absolute;
    z-index: 2;
    width: var(--touch-size);
    height: var(--touch-size);
    left: calc(var(--touch-x) - var(--touch-radius));
    top: calc(var(--touch-y) - var(--touch-radius));
    pointer-events: none;
    opacity: 0;
    background: radial-gradient(circle at 50% 50%,
      rgba(225,185,102,.070) 0%,
      rgba(225,185,102,.026) 34%,
      transparent 72%);
    transition: opacity .24s ease;
  }

  .tactile-surface:hover::after {
    opacity: 1;
  }

  /* These surfaces already have a real frame; the light ends at that frame. */
  .pedigree-picker.tactile-surface,
  .form-section.tactile-surface,
  .summary-card.tactile-surface,
  .contact-section.tactile-surface {
    overflow: hidden;
  }

  .topbar.tactile-surface,
  .intake-progress.tactile-surface {
    --touch-radius: 160px;
    --touch-size: 320px;
    overflow: visible;
  }
}

@media (prefers-reduced-motion:reduce) {
  .tactile-surface::after {
    display: none;
  }
}


/* Anti-spam honeypot: visible to simple bots, off-screen for people. */
.hp-field {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}


/* === PRODUCTION MOBILE PASS 2026-10-17 === */
@media (max-width:760px) {
  .topbar {
    min-height: 68px;
  }

  .topbar button,
  .back-link,
  .inline-add,
  .summary-card__edit,
  .word-alternative a,
  .anketa-legal-links a {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
  }

  .summary-legal__consent input {
    width: 20px;
    height: 20px;
    margin-top: 1px;
  }

  .summary-legal__consent {
    grid-template-columns: 20px minmax(0,1fr);
    gap: 11px;
  }
}

@media (max-width:420px) {
  .workspace {
    width: min(100% - 20px, var(--max));
  }

  .screen-heading h1,
  .screen--form h1,
  .screen--summary h1 {
    font-size: 36px;
    line-height: 1.05;
  }

  .pedigree-picker {
    padding-left: 12px;
    padding-right: 12px;
  }

  .branch-option {
    padding-left: 12px;
    padding-right: 12px;
  }
}

/* === LANDSCAPE TEXT-SIZE STABILITY V7 === */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}


/* V16: same gold brand as the main site; third-stage contacts are unnumbered. */
.brand__name,
.brand:hover .brand__name,
.brand:focus-visible .brand__name {
  color:#d8b968 !important;
}
.contact-section__head { gap:0; }
@media (hover:none) and (pointer:coarse) {
  .brand, .text-button, .primary-button, .secondary-button,
  .intake-progress button, .upload-zone button, .summary-actions button {
    -webkit-tap-highlight-color:transparent;
    touch-action:manipulation;
  }
  .primary-button, .secondary-button, .text-button, .intake-progress button {
    transition:transform .20s cubic-bezier(.2,.72,.2,1),
               border-color .20s ease, box-shadow .20s ease, color .20s ease;
  }
  .primary-button:active, .secondary-button:active {
    transform:translateY(1px) scale(.985);
    box-shadow:0 5px 21px rgba(197,162,76,.13);
  }
  .intake-progress button:not(:disabled):active,
  .text-button:active { transform:translateY(1px);color:#e9cf8a; }
  input:focus-visible, textarea:focus-visible {
    border-color:rgba(222,188,99,.70);
    box-shadow:0 0 0 3px rgba(204,170,87,.11);
  }
}
@media (prefers-reduced-motion:no-preference) {
  .screen { animation:fade .3s cubic-bezier(.2,.72,.2,1); }
}
@media (prefers-reduced-motion:reduce) {
  .screen { animation:none !important; }
}

/* V19: selecting options never changes geometry; don't flash focus rings on touch. */
@media (pointer:coarse) {
 .tactile-surface:focus-within::after,.tactile-surface::after{display:none!important;}
 .branch-option,.intake-progress button,.summary-card,.primary-button,.secondary-button,
 .text-button,.upload-zone button,.pedigree-picker button,.inline-add {
   transform:none!important; translate:none!important; scale:1!important;
   -webkit-tap-highlight-color:transparent!important;
   transition:background-color .22s ease,color .22s ease,border-color .22s ease,box-shadow .22s ease!important;
 }
 .branch-option:focus:not(:focus-visible),.primary-button:focus:not(:focus-visible),
 .secondary-button:focus:not(:focus-visible),.intake-progress button:focus:not(:focus-visible),
 .summary-card__edit:focus:not(:focus-visible){outline:none!important;box-shadow:none!important;}
}


/* V20 — interaction geometry must never depend on selected values.
   The previous active ::before dot changed a chip's intrinsic width and
   caused the wrapping row to reflow on every tap. */
.clue-toggle, .clue-toggle.is-active {
  box-sizing:border-box;
  transform:none !important;
  translate:none !important;
  scale:1 !important;
  white-space:normal;
  transition:background-color .18s ease,border-color .18s ease,color .18s ease !important;
  -webkit-tap-highlight-color:transparent;
}
.clue-toggle::before, .clue-toggle.is-active::before {
  display:none !important;
  content:none !important;
  width:0 !important;
  margin:0 !important;
}
.clue-toggle:focus:not(:focus-visible),
.segmented label:focus:not(:focus-visible) {
  outline:none !important;
  box-shadow:none;
}
/* Radio selection must NEVER lose its gold state while focused. */
.segmented input:focus:not(:focus-visible) + span { outline:none !important; }
/* Reserve a fixed, identical footprint regardless of date precision. */
.conditional-value { min-height:50px; }
.conditional-value input, .conditional-value .field-state {
  box-sizing:border-box;
  display:flex;
  align-items:center;
  width:100%;
  min-height:50px;
  height:50px;
  margin:0;
  border:1px solid #2a4b3e;
  padding:12px 14px;
  background:#061b15;
  line-height:24px;
  border-radius:0;
}
.conditional-value input[hidden],.conditional-value .field-state[hidden] {display:none!important;}
.segmented {grid-auto-rows:minmax(45px,auto);}
.segmented label, .segmented span { min-width:0; }
.segmented span {
  min-height:45px;
  height:100%;
  box-sizing:border-box;
  transform:none!important;
  outline-offset:-3px;
  transition:color .18s ease,background-color .18s ease,box-shadow .18s ease!important;
  -webkit-tap-highlight-color:transparent;
}
.segmented input:checked + span {box-shadow:inset 0 -2px 0 var(--accent);}
@media (max-width:760px) {
 .segmented {grid-auto-rows:minmax(54px,auto);}
 .segmented span {min-height:54px; height:100%;}
}

/* V23: pedigree context always fits the width of the phone; no horizontal scrubbing. */
@media (max-width:900px) {
  .line-context-strip {
    display:grid;
    grid-template-columns:minmax(0,.69fr) minmax(7px,.22fr) minmax(0,.69fr)
      minmax(7px,.22fr) minmax(0,.69fr) minmax(7px,.22fr) minmax(0,1.48fr);
    align-items:start;
    width:100%;max-width:100%;gap:0;
    overflow:hidden; padding:14px 1px; box-sizing:border-box;
  }
  .line-context-strip .path-node {min-width:0;width:auto;max-width:100%;}
  .line-context-strip .path-node__circle {width:30px;height:30px;max-width:100%;font-size:12px;margin-bottom:7px;}
  .line-context-strip .path-node__label {
    font-size:11px;line-height:1.25;hyphens:auto;overflow-wrap:anywhere;
  }
  .line-context-strip .path-connector {min-width:0;width:auto;flex:initial;}
}
@media (max-width:360px) {
  .line-context-strip .path-node__circle {width:27px;height:27px;font-size:11px;}
  .line-context-strip .path-node__label {font-size:10px;}
}
/* Only UI chrome is non-selectable: typed text, draft contents and explanations remain copyable. */
.form-section h2,.form-section h3,.form-section legend,.contact-section h2,
.form-section .section-index,.form-section .field__label,.form-section .field-label,
.line-context-strip,
.pedigree-picker .pedigree-person,.pedigree-picker .branch-option,
.brand,.form-progress,.topbar,.form-section .section-heading h2,.form-section .section-heading h3,
.form-section .section-kicker, .app-shell button {
  -webkit-user-select:none;user-select:none;cursor:default;
}
.app-shell button,.pedigree-picker .branch-option {cursor:pointer;}

/* V24 brand identity & UI selection: actual values and instructions stay copyable. */
.topbar .brand__name {color:#f2efe6!important;}
.topbar .brand__meta {color:#d8b968!important;}
@media(min-width:901px){.topbar .brand__meta {font-size:12.5px!important;letter-spacing:.04em!important;}}
.topbar,.topbar *, .intake-progress, .intake-progress *,
.screen-heading h1,.screen-heading .eyebrow,.form-section .section-heading h2,
.form-section .section-heading h3,.form-section .section-heading .section-index, .form-section label,
.form-section button,.form-section button *, button,button *,
[role="button"],[role="button"] * {
  -webkit-user-select:none!important; user-select:none!important;
}
.form-section input,.form-section textarea,.form-section select,
input,textarea,select { -webkit-user-select:text!important;user-select:text!important;cursor:text; }


/* V26 — restore normal text selection for all readable content.
   Disable selection only on actual UI chrome; never on body, paragraphs,
   legal terms, FAQ answers, research narratives or ordinary copy. */
body { cursor:default; }
body :is(button,[role="button"],[role="tab"],[role="switch"],summary,
  a,input[type="checkbox"],input[type="radio"],input[type="range"],select),
body :is(button,[role="button"],[role="tab"],[role="switch"],summary,
  a,input[type="checkbox"],input[type="radio"],input[type="range"],select) * {
  -webkit-user-select:none !important;
  user-select:none !important;
  -webkit-touch-callout:none;
}
/* Re-enable inline citations and links when embedded inside prose. */
body :is(p,li,blockquote,dd,td) a:not(.button):not([role="button"]) {
  -webkit-user-select:text !important;
  user-select:text !important;
  -webkit-touch-callout:default;
}
body :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
  textarea,[contenteditable="true"],[contenteditable="plaintext-only"]) {
  -webkit-user-select:text !important;
  user-select:text !important;
  -webkit-touch-callout:default;
  caret-color:auto !important;
  cursor:text;
}
body :is(input[type="checkbox"],input[type="radio"],input[type="range"],select) {
  -webkit-user-select:none !important;
  user-select:none !important;
  caret-color:transparent !important;
}
/* Non-editable prose is selectable but never pretends to be an input. */
body :is(h1,h2,h3,h4,h5,h6,p,span,small,strong,em,label,legend,blockquote,dt,dd,li) {
  caret-color:transparent !important;
  cursor:inherit;
}
body :is(a,button,[role="button"],label:has(input[type="checkbox"]),
  label:has(input[type="radio"]),label[for],input[type="checkbox"],input[type="radio"]) {cursor:pointer;}
body :is(a,button,[role="button"]) * {cursor:inherit;}
/* Click/touch focus should not show a frame; keyboard focus remains visible. */
body :is(button,a,input[type="checkbox"],input[type="radio"],select,[role="button"]):focus:not(:focus-visible) {
  outline:none !important;
}
@media (pointer:coarse) {body * {-webkit-tap-highlight-color:transparent;}}


/* V25 — no browser-style focus frame around checkbox and its label on mouse click. */
.app-shell input[type="checkbox"]:focus:not(:focus-visible),
.app-shell input[type="radio"]:focus:not(:focus-visible),
.app-shell label:focus:not(:focus-visible),
.app-shell .segmented label:focus:not(:focus-visible),
.app-shell .consent-row:focus-within:not(:has(:focus-visible)) {
  outline:none !important;
  filter:none !important;
  box-shadow:none !important;
}


/* V27: Copyable editorial content, non-selectable interface controls.
   Older global V24/V25 overrides were overly broad. Reset those rules, then
   reapply nonselection exclusively to active UI and imagery. */
body, body * {
  -webkit-user-select: auto !important;
  user-select: auto !important;
}
body :is(button, [role="button"], [role="tab"], [role="switch"],
  input[type="checkbox"], input[type="radio"], input[type="range"],
  select, summary),
body :is(button, [role="button"], [role="tab"], [role="switch"],
  input[type="checkbox"], input[type="radio"], input[type="range"],
  select, summary) *,
body :is(nav, .site-header, .topbar, .brand, .intake-progress,
  .presentation-tabs, .presentation-rail, .book-toolbar,
  .book-footer, .book-canvas, .line-context-strip,
  .segmented, .pedigree-picker .branch-option),
body :is(nav, .site-header, .topbar, .brand, .intake-progress,
  .presentation-tabs, .presentation-rail, .book-toolbar,
  .book-footer, .book-canvas, .line-context-strip,
  .segmented, .pedigree-picker .branch-option) *,
body a:is(.button, .price-cta, .header-cta, .presentation-page-link, .back-link),
body a:is(.button, .price-cta, .header-cta, .presentation-page-link, .back-link) *,
body :is(img, svg, canvas, video),
body :is(img, svg, canvas, video) * {
  -webkit-user-select: none !important;
  user-select: none !important;
}
/* Text inside paragraphs, headings, labels and historical descriptions stays copyable.
   Link text embedded in copy is selectable, unlike actual CTA buttons. */
body :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
  textarea, [contenteditable="true"], [contenteditable="plaintext-only"]) {
  -webkit-user-select: text !important;
  user-select: text !important;
  cursor: text;
}
body :is(button, [role="button"], [role="tab"], [role="switch"],
  input[type="checkbox"], input[type="radio"], input[type="range"], select) { cursor: pointer; }
/* High-specificity legacy rules suppressed first-screen headings despite V26. */
body .screen-heading :is(h1,h2,h3,.eyebrow),
body .form-section .section-heading :is(h2,h3),
body .form-section :is(.field__label, .field-label, legend),
body .legal-section :is(h1,h2,h3,h4) {
  -webkit-user-select: text !important;
  user-select: text !important;
}


/* V27: two genuinely independent, content-height form cards.
   Previously CSS Grid stretched the shorter 'Основные сведения' card to the
   taller 'Семья' panel and produced an empty framed floor beneath its fields. */
.ancestor-form .form-columns {
  align-items: start;
  gap: 16px;
  background: transparent;
  border: 0;
}
.ancestor-form .form-columns > .form-section {
  min-width: 0;
  align-self: start;
  background: #071f18;
  border: 1px solid rgba(225,185,102,.24);
}
.ancestor-form .form-columns > .form-section + .form-section {
  border-left: 1px solid rgba(225,185,102,.24);
  border-top: 1px solid rgba(225,185,102,.24);
}
.ancestor-form > .form-section--wide {
  margin-top: 16px;
  border-top: 1px solid rgba(225,185,102,.20);
}


/* V28 — Quiet native selection inside real form fields.
   No bright gold selection blocks; editing/copying stays available. */
.ancestor-form :is(input, textarea)::selection,
.app-shell :is(input, textarea)::selection {
  background: rgba(137, 166, 151, .24);
  color: #f2efe6;
}


/* V29: one uninterrupted segmented control, independent of pointer/focus state.
   All four variants share the same geometry; focus no longer erases selection. */
.app-shell .segmented {
  display:grid;
  gap:0;
  padding:0;
  margin-bottom:12px;
  grid-auto-rows:minmax(46px,auto);
  border:1px solid #2d4d40;
  background:#09251d;
  overflow:hidden;
  border-radius:0;
  box-sizing:border-box;
}
.app-shell .segmented label {
  position:relative;
  display:flex;
  align-self:stretch;
  justify-self:stretch;
  min-width:0;
  min-height:0;
  height:100%;
  margin:0;
  padding:0;
  border:0;
  background:#09251d;
  cursor:pointer;
}
.app-shell .segmented label > span {
  box-sizing:border-box;
  display:flex;
  flex:1 1 auto;
  width:100%;
  min-height:46px;
  height:auto;
  padding:8px 4px;
  align-items:center;
  justify-content:center;
  text-align:center;
  line-height:1.24;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none!important;
  transform:none!important;
  -webkit-user-select:none;
  user-select:none;
  transition:background-color .14s ease,color .14s ease!important;
}
.app-shell .segmented label+label > span {border-left:1px solid #2d4d40;}
.app-shell .segmented label:hover > span {background-color:#0e3025;color:#ece8dc;}
.app-shell .segmented input:checked + span,
.app-shell .segmented input:checked:focus + span,
.app-shell .segmented label:hover input:checked + span {
  color:#e2cc86!important;
  background:linear-gradient(to top,#c6a451 0 2px,#0c3024 2px 100%)!important;
  box-shadow:none!important;
}
.app-shell .segmented input:focus:not(:focus-visible) + span {outline:0!important;}
.app-shell .segmented input:focus-visible + span {
  outline:2px solid #cfb96f!important;
  outline-offset:-4px;
}
@media (max-width:760px) {
 .app-shell .segmented {grid-auto-rows:minmax(54px,auto);}
 .app-shell .segmented label > span {min-height:54px;}
}

/* V29: hidden radios are NOT text fields. Their old 50px height protruded
   below 46px visual buttons and contributed to the broken lower edge. */
.app-shell .segmented input[type="radio"] {
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  min-width:0!important;
  min-height:0!important;
  max-width:1px!important;
  max-height:1px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  opacity:0!important;
  overflow:hidden!important;
  clip-path:inset(50%);
  pointer-events:none!important;
}


/* V31: segmented choice geometry on touch displays. A 2x2 selector needs
   a real horizontal row separator and NO phantom left border on row two.
   Selection stays inside the same cell without box-shadow or reflow. */
@media (max-width:760px) {
  .app-shell .segmented:not(.segmented--three) {
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-auto-rows:54px;
    gap:0 !important;
    padding:0 !important;
    overflow:hidden;
    align-items:stretch;
  }
  .app-shell .segmented:not(.segmented--three) > label {
    height:54px !important;
    min-height:54px !important;
  }
  .app-shell .segmented:not(.segmented--three) > label > span {
    height:54px !important;
    min-height:54px !important;
    border:0 !important;
  }
  .app-shell .segmented:not(.segmented--three) > label:nth-child(even) > span {
    border-left:1px solid #2d4d40 !important;
  }
  .app-shell .segmented:not(.segmented--three) > label:nth-child(n+3) > span {
    border-top:1px solid #2d4d40 !important;
  }
  .app-shell .segmented--three {
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    grid-auto-rows:54px !important;
  }
  .app-shell .segmented--three > label {height:54px !important;min-height:54px !important;}
  .app-shell .segmented--three > label > span {height:54px !important;min-height:54px !important;}
}

/* V34: only the free connection between stacked parent groups is dotted. */
.pedigree-connectors path.is-dotted {
  stroke-dasharray: 3 6;
  stroke-linecap: round;
}