.gna-pedigree-app {
	--gna-purple: #8335A3;
	--gna-purple-dark: #4B1764;
	--gna-purple-soft: #F1E8F7;
	--gna-bg: #F8F5FB;
	--gna-surface: #FFFFFF;
	--gna-surface-2: #FCFAFD;
	--gna-text: #1F2937;
	--gna-muted: #6B7280;
	--gna-line: #E5E7EB;
	--gna-line-purple: #E6DAEF;
	--gna-accent: #10B981;
	--gna-accent-dark: #047857;
	--gna-danger: #B42318;
	--gna-danger-soft: #FEE4E2;
	--gna-shadow: 0 18px 45px rgba(75, 23, 100, 0.12);
	--gna-shadow-soft: 0 10px 28px rgba(31, 41, 55, 0.08);
	background: var(--gna-bg);
	border: 1px solid var(--gna-line-purple);
	border-radius: 8px;
	box-sizing: border-box;
	color: var(--gna-text);
	font-family: inherit;
	margin: 24px 0;
	overflow: hidden;
}

.gna-pedigree-app *,
.gna-pedigree-app *::before,
.gna-pedigree-app *::after {
	box-sizing: border-box;
}

.gna-pedigree-app [hidden] {
	display: none !important;
}

.gna-pedigree-app .screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

.gna-app-header {
	align-items: center;
	background:
		linear-gradient(135deg, rgba(75, 23, 100, 0.96), rgba(131, 53, 163, 0.94)),
		linear-gradient(90deg, rgba(16, 185, 129, 0.14), transparent);
	color: #fff;
	display: flex;
	gap: 24px;
	justify-content: space-between;
	padding: 30px;
	position: relative;
}

.gna-app-header::after {
	background: rgba(255, 255, 255, 0.14);
	content: "";
	height: 100%;
	position: absolute;
	right: 0;
	top: 0;
	width: 18%;
}

.gna-header-copy,
.gna-header-actions {
	position: relative;
	z-index: 1;
}

.gna-header-copy {
	max-width: 720px;
}

.gna-app-header h1,
.gna-dashboard-panel h2,
.gna-editor-title h2,
.gna-stage-header h3,
.gna-side-heading h3,
.gna-modal-header h2,
.gna-pedigree-access-card h2 {
	letter-spacing: 0;
	margin: 0;
}

.gna-app-header h1 {
	font-size: 32px;
	font-weight: 800;
	line-height: 1.15;
}

.gna-header-copy > p:not(.gna-kicker) {
	color: rgba(255, 255, 255, 0.86);
	font-size: 16px;
	line-height: 1.5;
	margin: 8px 0 0;
}

.gna-kicker,
.gna-section-kicker {
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0;
	margin: 0 0 7px;
	text-transform: uppercase;
}

.gna-kicker {
	color: rgba(255, 255, 255, 0.78);
}

.gna-section-kicker {
	color: var(--gna-accent-dark);
}

.gna-header-actions,
.gna-editor-actions,
.gna-form-actions,
.gna-toolbar,
.gna-toolbar-actions,
.gna-stage-tools,
.gna-legend,
.gna-zoom-controls {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.gna-app-main {
	padding: 24px;
}

.gna-dashboard-panel {
	align-items: center;
	background: var(--gna-surface);
	border: 1px solid var(--gna-line-purple);
	border-radius: 8px;
	box-shadow: var(--gna-shadow-soft);
	display: grid;
	gap: 18px;
	grid-template-columns: minmax(0, 1fr) auto;
	margin-bottom: 18px;
	padding: 22px;
}

.gna-dashboard-panel h2 {
	color: var(--gna-purple-dark);
	font-size: 24px;
	line-height: 1.2;
}

.gna-dashboard-panel p {
	color: var(--gna-muted);
	line-height: 1.55;
	margin: 7px 0 0;
}

.gna-dashboard-metric {
	align-items: center;
	background: var(--gna-purple-soft);
	border: 1px solid #DFCBEA;
	border-radius: 8px;
	color: var(--gna-purple-dark);
	display: grid;
	justify-items: center;
	min-width: 126px;
	padding: 14px 18px;
}

.gna-dashboard-metric strong {
	font-size: 28px;
	line-height: 1;
}

.gna-dashboard-metric span {
	color: var(--gna-muted);
	font-size: 12px;
	font-weight: 700;
	margin-top: 5px;
	text-align: center;
}

.gna-toolbar {
	background: rgba(255, 255, 255, 0.72);
	border: 1px solid rgba(230, 218, 239, 0.9);
	border-radius: 8px;
	justify-content: space-between;
	margin-bottom: 18px;
	padding: 12px;
}

.gna-search-wrap {
	flex: 1 1 320px;
	min-width: 0;
}

.gna-search {
	display: block;
	margin: 0;
	position: relative;
}

.gna-search::before {
	color: var(--gna-purple);
	content: "⌕";
	font-size: 22px;
	left: 14px;
	line-height: 1;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

.gna-search input,
.gna-field input,
.gna-field select,
.gna-field textarea {
	background: #fff;
	border: 1px solid #D8CBE3;
	border-radius: 8px;
	color: var(--gna-text);
	display: block;
	font: inherit;
	min-height: 44px;
	padding: 10px 12px;
	width: 100%;
}

.gna-search input {
	padding-left: 44px;
}

.gna-field textarea {
	line-height: 1.45;
	min-height: 98px;
	resize: vertical;
}

.gna-search input:focus,
.gna-field input:focus,
.gna-field select:focus,
.gna-field textarea:focus {
	border-color: var(--gna-purple);
	box-shadow: 0 0 0 3px rgba(131, 53, 163, 0.15);
	outline: none;
}

.gna-pedigree-app button,
.gna-btn,
.gna-pedigree-btn,
.gna-icon-btn {
	align-items: center;
	border: 1px solid transparent;
	border-radius: 8px;
	cursor: pointer;
	display: inline-flex;
	font: inherit;
	font-weight: 750;
	gap: 8px;
	justify-content: center;
	line-height: 1;
	min-height: 40px;
	padding: 10px 14px;
	text-decoration: none;
	transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease, box-shadow 160ms ease;
	white-space: nowrap;
}

.gna-pedigree-app button {
	background: #F3F4F6;
	border-color: #D1D5DB;
	color: var(--gna-text);
}

.gna-btn-large,
.gna-pedigree-btn-large {
	font-size: 15px;
	min-height: 48px;
	padding: 13px 18px;
}

.gna-btn-compact {
	min-height: 32px;
	padding: 7px 10px;
}

.gna-btn:disabled,
.gna-pedigree-btn:disabled,
.gna-pedigree-app button:disabled {
	background: #E5E7EB;
	border-color: #D1D5DB;
	color: #6B7280;
	cursor: not-allowed;
	opacity: 1;
	transform: none;
}

.gna-btn:hover,
.gna-pedigree-btn:hover,
.gna-icon-btn:hover {
	box-shadow: 0 8px 18px rgba(75, 23, 100, 0.14);
	transform: translateY(-1px);
}

.gna-btn-primary,
.gna-pedigree-btn-primary {
	background: var(--gna-purple);
	border-color: var(--gna-purple);
	color: #fff;
}

.gna-btn-primary:hover,
.gna-pedigree-btn-primary:hover {
	background: var(--gna-purple-dark);
	border-color: var(--gna-purple-dark);
	color: #fff;
}

.gna-btn-secondary,
.gna-pedigree-btn-secondary {
	background: #fff;
	border-color: var(--gna-purple);
	color: var(--gna-purple);
}

.gna-btn-secondary:hover,
.gna-pedigree-btn-secondary:hover {
	background: var(--gna-bg);
	border-color: var(--gna-purple-dark);
	color: var(--gna-purple-dark);
}

.gna-btn-ghost,
.gna-btn-neutral,
.gna-pedigree-btn-neutral {
	background: #F3F4F6;
	border-color: #D1D5DB;
	color: var(--gna-text);
}

.gna-btn-ghost:hover,
.gna-btn-neutral:hover,
.gna-pedigree-btn-neutral:hover {
	background: #E5E7EB;
	border-color: #D1D5DB;
	color: var(--gna-text);
}

.gna-btn-success,
.gna-pedigree-btn-success {
	background: var(--gna-accent);
	border-color: var(--gna-accent);
	color: #fff;
}

.gna-btn-success:hover,
.gna-pedigree-btn-success:hover {
	background: var(--gna-accent-dark);
	border-color: var(--gna-accent-dark);
	color: #fff;
}

.gna-btn-danger,
.gna-pedigree-btn-danger {
	background: #DC2626;
	border-color: #DC2626;
	color: #fff;
}

.gna-btn-danger:hover,
.gna-pedigree-btn-danger:hover {
	background: #991B1B;
	border-color: #991B1B;
	color: #fff;
}

.gna-icon-btn {
	background: #fff;
	border-color: var(--gna-purple);
	color: var(--gna-purple);
	font-size: 18px;
	height: 36px;
	min-height: 36px;
	padding: 0;
	width: 36px;
}

.gna-case-grid {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.gna-case-card,
.gna-empty-state,
.gna-loading-card,
.gna-side-section,
.gna-pedigree-stage,
.gna-case-summary,
.gna-editor-topbar {
	background: var(--gna-surface);
	border: 1px solid var(--gna-line-purple);
	border-radius: 8px;
	box-shadow: var(--gna-shadow-soft);
}

.gna-case-card {
	display: flex;
	flex-direction: column;
	gap: 14px;
	min-height: 240px;
	padding: 18px;
	position: relative;
}

.gna-case-card::before {
	background: var(--gna-purple);
	border-radius: 8px 8px 0 0;
	content: "";
	height: 4px;
	left: -1px;
	position: absolute;
	right: -1px;
	top: -1px;
}

.gna-case-card-top {
	align-items: flex-start;
	display: flex;
	gap: 12px;
}

.gna-case-icon {
	align-items: center;
	background: var(--gna-purple-soft);
	border: 1px solid #DFCBEA;
	border-radius: 8px;
	color: var(--gna-purple-dark);
	display: inline-flex;
	flex: 0 0 42px;
	font-weight: 850;
	height: 42px;
	justify-content: center;
}

.gna-case-card h2 {
	color: var(--gna-purple-dark);
	font-size: 20px;
	line-height: 1.2;
	margin: 0;
	overflow-wrap: anywhere;
}

.gna-case-card p {
	color: var(--gna-muted);
	line-height: 1.48;
	margin: 0;
}

.gna-case-description {
	display: -webkit-box;
	min-height: 44px;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.gna-case-meta {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.gna-pill {
	background: #EEFDF7;
	border: 1px solid #C6F4E2;
	border-radius: 999px;
	color: var(--gna-accent-dark);
	display: inline-flex;
	font-size: 12px;
	font-weight: 800;
	line-height: 1;
	padding: 7px 9px;
}

.gna-pill-muted {
	background: #F9FAFB;
	border-color: var(--gna-line);
	color: var(--gna-muted);
}

.gna-card-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: auto;
}

.gna-card-actions .gna-btn {
	flex: 1 1 auto;
}

.gna-empty-state,
.gna-loading-card {
	color: var(--gna-muted);
	grid-column: 1 / -1;
	padding: 30px;
	text-align: center;
}

.gna-empty-state {
	background: linear-gradient(180deg, #fff, #FCFAFD);
}

.gna-empty-state strong {
	color: var(--gna-purple-dark);
	display: block;
	font-size: 18px;
	margin-bottom: 6px;
}

.gna-editor-topbar {
	align-items: center;
	display: grid;
	gap: 18px;
	grid-template-columns: minmax(0, 1fr) auto;
	margin-bottom: 14px;
	padding: 18px;
}

.gna-editor-title-group {
	align-items: center;
	display: flex;
	gap: 14px;
	min-width: 0;
}

.gna-editor-title {
	min-width: 0;
}

.gna-editor-title h2 {
	color: var(--gna-purple-dark);
	font-size: 25px;
	line-height: 1.2;
	overflow-wrap: anywhere;
}

.gna-editor-title p:not(.gna-section-kicker) {
	color: var(--gna-muted);
	margin: 6px 0 0;
	overflow-wrap: anywhere;
}

.gna-editor-actions {
	justify-content: flex-end;
}

.gna-case-summary {
	display: grid;
	gap: 12px;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin-bottom: 18px;
	padding: 14px;
}

.gna-tabs {
	background: var(--gna-surface);
	border: 1px solid var(--gna-line-purple);
	border-radius: 8px;
	box-shadow: var(--gna-shadow-soft);
	display: flex;
	gap: 6px;
	margin-bottom: 18px;
	overflow-x: auto;
	padding: 8px;
}

.gna-tab {
	background: #F3F4F6;
	border: 1px solid var(--gna-line);
	border-radius: 8px;
	color: var(--gna-text);
	flex: 0 0 auto;
	font-size: 13px;
	font-weight: 800;
	min-height: 38px;
	padding: 9px 12px;
}

.gna-tab:hover {
	background: var(--gna-bg);
	border-color: var(--gna-purple);
	color: var(--gna-purple-dark);
}

.gna-tab.is-active {
	background: var(--gna-purple);
	border-color: var(--gna-purple);
	color: #fff;
}

.gna-tab-panel {
	margin-bottom: 18px;
}

.gna-panel-card {
	background: var(--gna-surface);
	border: 1px solid var(--gna-line-purple);
	border-radius: 8px;
	box-shadow: var(--gna-shadow-soft);
	padding: 16px;
}

.gna-panel-header {
	align-items: center;
	border-bottom: 1px solid var(--gna-line);
	display: flex;
	gap: 14px;
	justify-content: space-between;
	margin-bottom: 14px;
	padding-bottom: 14px;
}

.gna-panel-header h3,
.gna-transfer-card h4 {
	color: var(--gna-purple-dark);
	font-size: 20px;
	line-height: 1.2;
	margin: 0;
}

.gna-table-wrap {
	overflow-x: auto;
}

.gna-data-table {
	border-collapse: collapse;
	min-width: 760px;
	width: 100%;
}

.gna-data-table th,
.gna-data-table td {
	border-bottom: 1px solid var(--gna-line);
	color: var(--gna-text);
	font-size: 13px;
	padding: 10px;
	text-align: left;
	vertical-align: top;
}

.gna-data-table th {
	background: #F9FAFB;
	color: var(--gna-purple-dark);
	font-weight: 850;
}

.gna-data-table td {
	background: #fff;
}

.gna-status-badge {
	background: var(--gna-purple-soft);
	border-radius: 999px;
	color: var(--gna-purple-dark);
	display: inline-flex;
	font-size: 12px;
	font-weight: 800;
	padding: 5px 8px;
}

.gna-transfer-grid {
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.gna-transfer-card {
	background: var(--gna-surface-2);
	border: 1px solid #ECE1F3;
	border-radius: 8px;
	display: grid;
	gap: 10px;
	padding: 14px;
}

.gna-transfer-card p,
.gna-report-preview p,
.gna-import-summary {
	color: var(--gna-muted);
	font-size: 13px;
	line-height: 1.45;
	margin: 0;
}

.gna-import-summary {
	background: #fff;
	border: 1px solid var(--gna-line);
	border-radius: 8px;
	padding: 10px;
}

.gna-audit-filters {
	display: grid;
	gap: 10px;
	grid-template-columns: minmax(0, 1fr) 220px;
	margin-bottom: 12px;
}

.gna-audit-filters input,
.gna-audit-filters select {
	background: #fff;
	border: 1px solid #D8CBE3;
	border-radius: 8px;
	color: var(--gna-text);
	font: inherit;
	min-height: 40px;
	padding: 9px 10px;
	width: 100%;
}

.gna-summary-tile {
	background: var(--gna-surface-2);
	border: 1px solid #EEE4F4;
	border-radius: 8px;
	display: grid;
	gap: 5px;
	min-width: 0;
	padding: 12px;
}

.gna-summary-tile span {
	color: var(--gna-muted);
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
}

.gna-summary-tile strong {
	color: var(--gna-purple-dark);
	font-size: 18px;
	line-height: 1.2;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.gna-editor-layout {
	align-items: start;
	display: grid;
	gap: 18px;
	grid-template-columns: minmax(0, 1fr) 350px;
}

.gna-pedigree-stage {
	min-width: 0;
	overflow: hidden;
}

.gna-stage-header {
	align-items: flex-start;
	border-bottom: 1px solid var(--gna-line-purple);
	display: flex;
	gap: 16px;
	justify-content: space-between;
	padding: 16px;
}

.gna-stage-header h3 {
	color: var(--gna-purple-dark);
	font-size: 20px;
}

.gna-stage-tools {
	justify-content: flex-end;
}

.gna-legend {
	background: #F9FAFB;
	border: 1px solid var(--gna-line);
	border-radius: 8px;
	padding: 8px;
}

.gna-legend span {
	align-items: center;
	color: var(--gna-muted);
	display: inline-flex;
	font-size: 12px;
	font-weight: 750;
	gap: 6px;
}

.gna-legend-symbol {
	border: 2px solid var(--gna-purple-dark);
	display: inline-block;
	height: 14px;
	width: 14px;
}

.gna-legend-square {
	border-radius: 2px;
}

.gna-legend-circle {
	border-radius: 50%;
}

.gna-legend-diamond {
	transform: rotate(45deg);
}

.gna-legend-filled {
	background: var(--gna-purple);
}

.gna-legend [data-condition-legend] {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 8px;
}

.gna-legend-carrier {
	background: linear-gradient(90deg, var(--gna-purple) 0 50%, #fff 50% 100%);
}

.gna-legend-proband {
	border: 0;
	height: 14px;
	position: relative;
	width: 18px;
}

.gna-legend-proband::before {
	background: var(--gna-accent);
	content: "";
	height: 3px;
	left: 0;
	position: absolute;
	top: 6px;
	transform: rotate(-35deg);
	width: 18px;
}

.gna-zoom-controls {
	background: #fff;
	border: 1px solid var(--gna-line);
	border-radius: 8px;
	padding: 6px;
}

.gna-zoom-controls span {
	color: var(--gna-purple-dark);
	font-size: 12px;
	font-weight: 800;
	min-width: 46px;
	text-align: center;
}

.gna-pedigree-print-area {
	background: #fff;
	padding: 16px;
}

.gna-print-title {
	display: none;
}

.gna-svg-wrap {
	background:
		linear-gradient(rgba(131, 53, 163, 0.05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(131, 53, 163, 0.05) 1px, transparent 1px),
		#fff;
	background-size: 24px 24px;
	border: 1px solid #E6DAEF;
	border-radius: 8px;
	cursor: grab;
	min-height: 560px;
	overflow: auto;
	position: relative;
	touch-action: none;
}

.gna-pedigree-svg {
	display: block;
	min-height: 560px;
	transform-origin: 0 0;
	width: 100%;
}

.gna-pedigree-canvas {
	transform-box: fill-box;
	transform-origin: 0 0;
	will-change: transform;
}

.gna-pedigree-overlay-layer {
	cursor: default;
	pointer-events: auto;
}

.gna-pedigree-edges-layer {
	pointer-events: none;
}

.gna-pedigree-nodes-layer {
	pointer-events: auto;
}

.gna-clinical-legend-panel {
	background: #fff;
	border: 1px solid var(--gna-line);
	border-radius: 8px;
	box-shadow: 0 10px 24px rgba(75, 23, 100, 0.06);
	display: grid;
	gap: 12px;
	margin-top: 12px;
	padding: 14px;
}

.gna-clinical-legend-heading {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 12px;
	justify-content: space-between;
}

.gna-clinical-legend-heading strong {
	color: var(--gna-purple-dark);
}

.gna-clinical-legend-heading span {
	color: var(--gna-muted);
	font-size: 12px;
}

.gna-clinical-legend-grid {
	display: grid;
	gap: 8px;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.gna-clinical-legend-item {
	align-items: center;
	color: var(--gna-text);
	display: inline-flex;
	font-size: 12px;
	font-weight: 700;
	gap: 8px;
	min-width: 0;
}

.gna-clinical-legend-marker {
	--legend-color: var(--gna-purple);
	background: #fff;
	border: 2px solid var(--gna-purple-dark);
	display: inline-block;
	height: 16px;
	position: relative;
	width: 16px;
}

.gna-clinical-legend-marker.is-circle {
	border-radius: 999px;
}

.gna-clinical-legend-marker.is-diamond {
	transform: rotate(45deg);
}

.gna-clinical-legend-marker.is-filled,
.gna-clinical-legend-marker.is-condition {
	background: var(--legend-color);
	border-color: var(--legend-color);
}

.gna-clinical-legend-marker.is-carrier {
	background: linear-gradient(90deg, var(--legend-color) 0 50%, #fff 50% 100%);
}

.gna-clinical-legend-marker.is-deceased::after {
	background: #B42318;
	content: "";
	height: 2px;
	left: -3px;
	position: absolute;
	top: 7px;
	transform: rotate(-45deg);
	width: 22px;
}

.gna-clinical-legend-marker.is-proband {
	background: transparent;
	border: 0;
}

.gna-clinical-legend-marker.is-proband::after {
	background: var(--gna-accent);
	content: "";
	height: 3px;
	left: 0;
	position: absolute;
	top: 7px;
	transform: rotate(-35deg);
	width: 20px;
}

.gna-pedigree-empty {
	align-items: center;
	background: rgba(255, 255, 255, 0.92);
	border: 1px dashed #D8CBE3;
	border-radius: 8px;
	display: grid;
	gap: 10px;
	justify-items: center;
	left: 50%;
	max-width: min(420px, calc(100% - 32px));
	padding: 24px;
	position: absolute;
	text-align: center;
	top: 50%;
	transform: translate(-50%, -50%);
}

.gna-pedigree-empty h3 {
	color: var(--gna-purple-dark);
	font-size: 20px;
	line-height: 1.25;
	margin: 0;
}

.gna-pedigree-empty p {
	color: var(--gna-muted);
	margin: 0;
}

.gna-svg-person {
	cursor: grab;
	pointer-events: auto;
	user-select: none;
}

.gna-svg-person:active {
	cursor: grabbing;
}

.gna-svg-person:focus-visible .gna-person-symbol,
.gna-svg-person:hover .gna-person-symbol {
	filter: drop-shadow(0 8px 10px rgba(75, 23, 100, 0.22));
}

.gna-svg-person.is-highlighted .gna-person-symbol {
	filter: drop-shadow(0 0 12px rgba(16, 185, 129, 0.9));
}

.gna-person-label {
	pointer-events: none;
	user-select: none;
}

.gna-person-context {
	background: #fff;
	border: 1px solid var(--gna-line);
	border-radius: 8px;
	box-shadow: 0 18px 45px rgba(31, 41, 55, 0.18);
	display: grid;
	gap: 4px;
	min-width: 210px;
	padding: 8px;
	position: absolute;
	z-index: 8;
}

.gna-person-context[hidden] {
	display: none;
}

.gna-person-context strong {
	border-bottom: 1px solid var(--gna-line);
	color: var(--gna-purple-dark);
	font-size: 13px;
	margin-bottom: 4px;
	padding: 5px 7px 8px;
}

.gna-person-context button {
	background: #fff;
	border: 0;
	border-radius: 6px;
	color: var(--gna-text);
	cursor: pointer;
	font-size: 13px;
	font-weight: 700;
	padding: 8px 10px;
	text-align: left;
}

.gna-person-context button:hover,
.gna-person-context button:focus-visible {
	background: var(--gna-soft);
	color: var(--gna-purple-dark);
	outline: 0;
}

.gna-template-actions {
	display: grid;
	gap: 8px;
}

.gna-side-panel {
	display: grid;
	gap: 14px;
	min-width: 0;
}

.gna-side-section {
	padding: 14px;
}

.gna-clinical-summary {
	background: linear-gradient(180deg, #FFFFFF, #FCFAFD);
}

.gna-clinical-grid {
	display: grid;
	gap: 8px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-bottom: 12px;
}

.gna-clinical-grid div {
	background: #fff;
	border: 1px solid var(--gna-line);
	border-radius: 8px;
	display: grid;
	gap: 4px;
	min-width: 0;
	padding: 10px;
}

.gna-clinical-grid span {
	color: var(--gna-muted);
	font-size: 11px;
	font-weight: 800;
	text-transform: uppercase;
}

.gna-clinical-grid strong {
	color: var(--gna-purple-dark);
	font-size: 15px;
	line-height: 1.2;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.gna-side-actions,
.gna-person-filters {
	display: grid;
	gap: 8px;
}

.gna-person-filters {
	margin-bottom: 12px;
}

.gna-person-filters input,
.gna-person-filters select {
	background: #fff;
	border: 1px solid #D8CBE3;
	border-radius: 8px;
	color: var(--gna-text);
	font: inherit;
	min-height: 38px;
	padding: 8px 10px;
	width: 100%;
}

.gna-side-heading {
	align-items: center;
	display: flex;
	justify-content: space-between;
	margin-bottom: 12px;
}

.gna-side-heading h3 {
	color: var(--gna-purple-dark);
	font-size: 16px;
}

.gna-side-heading span {
	background: var(--gna-purple-soft);
	border-radius: 999px;
	color: var(--gna-purple-dark);
	font-size: 12px;
	font-weight: 850;
	min-width: 28px;
	padding: 5px 8px;
	text-align: center;
}

.gna-person-list,
.gna-relationship-list {
	display: grid;
	gap: 8px;
	max-height: 360px;
	overflow: auto;
}

.gna-person-item,
.gna-relationship-item {
	align-items: center;
	background: var(--gna-surface-2);
	border: 1px solid #ECE1F3;
	border-radius: 8px;
	display: grid;
	gap: 8px;
	grid-template-columns: minmax(0, 1fr) auto;
	padding: 10px;
}

.gna-person-item.is-active {
	border-color: var(--gna-accent);
	box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.14);
}

.gna-person-item strong,
.gna-relationship-item strong {
	color: var(--gna-text);
	display: block;
	font-size: 14px;
	overflow-wrap: anywhere;
}

.gna-person-item span,
.gna-relationship-item span {
	color: var(--gna-muted);
	display: block;
	font-size: 12px;
	margin-top: 2px;
	overflow-wrap: anywhere;
}

.gna-person-actions,
.gna-relationship-actions {
	display: flex;
	gap: 6px;
}

.gna-modal {
	align-items: center;
	background: rgba(31, 41, 55, 0.58);
	display: none;
	inset: 0;
	justify-content: center;
	padding: 22px;
	position: fixed;
	z-index: 99999;
}

.gna-modal.is-open {
	display: flex;
}

.gna-modal-panel {
	background: #fff;
	border: 1px solid rgba(255, 255, 255, 0.7);
	border-radius: 8px;
	box-shadow: var(--gna-shadow);
	max-height: min(88vh, 860px);
	max-width: 760px;
	overflow: auto;
	padding: 20px;
	width: min(100%, 760px);
}

.gna-modal-panel-small {
	max-width: 460px;
}

.gna-modal-header {
	align-items: flex-start;
	border-bottom: 1px solid var(--gna-line);
	display: flex;
	gap: 16px;
	justify-content: space-between;
	margin-bottom: 16px;
	padding-bottom: 14px;
}

.gna-modal-header h2 {
	color: var(--gna-purple-dark);
	font-size: 22px;
}

.gna-modal-header p {
	color: var(--gna-muted);
	font-size: 14px;
	line-height: 1.45;
	margin: 6px 0 0;
}

.gna-form {
	display: grid;
	gap: 14px;
}

.gna-form-section {
	border: 1px solid var(--gna-line);
	border-radius: 8px;
	display: grid;
	gap: 14px;
	margin: 0;
	padding: 14px;
}

.gna-form-section legend {
	color: var(--gna-purple-dark);
	font-size: 14px;
	font-weight: 850;
	padding: 0 6px;
}

.gna-form-grid {
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.gna-field {
	display: grid;
	gap: 6px;
	margin: 0;
}

.gna-field span,
.gna-check span {
	color: var(--gna-text);
	font-size: 13px;
	font-weight: 800;
}

.gna-check-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.gna-check {
	align-items: center;
	background: var(--gna-surface-2);
	border: 1px solid #ECE1F3;
	border-radius: 8px;
	display: inline-flex;
	gap: 8px;
	margin: 0;
	padding: 10px 12px;
}

.gna-check input {
	accent-color: var(--gna-purple);
}

.gna-conditions-list {
	display: grid;
	gap: 12px;
}

.gna-condition-row {
	background: var(--gna-surface-2);
	border: 1px solid #ECE1F3;
	border-radius: 8px;
	display: grid;
	gap: 10px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	padding: 12px;
}

.gna-condition-row .gna-condition-notes,
.gna-condition-row .gna-btn {
	grid-column: 1 / -1;
}

.gna-form-actions {
	justify-content: flex-end;
	margin-top: 4px;
}

.gna-form-actions-split {
	justify-content: space-between;
}

.gna-form-actions-split > div {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: flex-end;
}

.gna-toast-region {
	display: grid;
	gap: 8px;
	position: fixed;
	right: 18px;
	top: 18px;
	width: min(380px, calc(100vw - 36px));
	z-index: 100000;
}

.gna-toast {
	background: #fff;
	border: 1px solid var(--gna-line);
	border-left: 5px solid var(--gna-accent);
	border-radius: 8px;
	box-shadow: var(--gna-shadow);
	color: var(--gna-text);
	font-weight: 650;
	line-height: 1.4;
	padding: 13px 14px;
}

.gna-toast.is-error {
	border-left-color: var(--gna-danger);
}

.gna-toast.is-info {
	border-left-color: var(--gna-purple);
}

.gna-pedigree-access-card {
	align-items: center;
	display: flex;
	gap: 18px;
	padding: 24px;
}

.gna-access-mark {
	align-items: center;
	background: var(--gna-purple);
	border-radius: 8px;
	color: #fff;
	display: inline-flex;
	flex: 0 0 64px;
	font-weight: 850;
	height: 64px;
	justify-content: center;
}

.gna-pedigree-access-card h2 {
	color: var(--gna-purple-dark);
	font-size: 22px;
}

.gna-pedigree-access-card p {
	color: var(--gna-muted);
	margin: 8px 0 0;
}

@media (max-width: 1160px) {
	.gna-editor-topbar {
		grid-template-columns: 1fr;
	}

	.gna-editor-actions {
		justify-content: flex-start;
	}

	.gna-editor-layout {
		grid-template-columns: 1fr;
	}

	.gna-side-panel {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 860px) {
	.gna-app-header,
	.gna-dashboard-panel,
	.gna-stage-header {
		align-items: flex-start;
		flex-direction: column;
		grid-template-columns: 1fr;
	}

	.gna-dashboard-metric {
		justify-items: start;
		width: 100%;
	}

	.gna-case-summary {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.gna-stage-tools {
		justify-content: flex-start;
		width: 100%;
	}

	.gna-panel-header {
		align-items: flex-start;
		flex-direction: column;
	}

	.gna-transfer-grid,
	.gna-audit-filters {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 720px) {
	.gna-app-header {
		padding: 22px;
	}

	.gna-app-header h1 {
		font-size: 28px;
	}

	.gna-app-main {
		padding: 14px;
	}

	.gna-toolbar,
	.gna-toolbar-actions,
	.gna-editor-title-group,
	.gna-editor-actions,
	.gna-stage-tools,
	.gna-zoom-controls {
		align-items: stretch;
		flex-direction: column;
		width: 100%;
	}

	.gna-legend {
		align-items: flex-start;
		width: 100%;
	}

	.gna-tabs {
		flex-direction: column;
		overflow-x: visible;
	}

	.gna-tab {
		width: 100%;
	}

	.gna-toolbar-actions .gna-btn,
	.gna-editor-actions .gna-btn,
	.gna-stage-tools .gna-btn,
	.gna-zoom-controls .gna-btn {
		width: 100%;
	}

	.gna-case-grid {
		grid-template-columns: 1fr;
	}

	.gna-card-actions .gna-btn {
		flex-basis: 100%;
	}

	.gna-form-grid,
	.gna-side-panel,
	.gna-case-summary {
		grid-template-columns: 1fr;
	}

	.gna-person-item,
	.gna-relationship-item {
		grid-template-columns: 1fr;
	}

	.gna-condition-row,
	.gna-clinical-grid {
		grid-template-columns: 1fr;
	}

	.gna-person-actions,
	.gna-relationship-actions,
	.gna-form-actions,
	.gna-form-actions-split,
	.gna-form-actions-split > div {
		align-items: stretch;
		flex-direction: column;
		width: 100%;
	}

	.gna-form-actions .gna-btn,
	.gna-form-actions-split .gna-btn {
		width: 100%;
	}

	.gna-modal {
		padding: 12px;
	}

	.gna-modal-panel {
		padding: 16px;
	}

	.gna-svg-wrap {
		min-height: 440px;
	}

	.gna-pedigree-svg {
		min-height: 440px;
	}
}

@media print {
	body * {
		visibility: hidden !important;
	}

	.gna-pedigree-print-area,
	.gna-pedigree-print-area * {
		visibility: visible !important;
	}

	.gna-pedigree-print-area {
		background: #fff !important;
		left: 0;
		padding: 0 !important;
		position: absolute;
		top: 0;
		width: 100% !important;
	}

	.gna-print-title {
		display: block !important;
		margin: 0 0 12px;
		text-align: center;
	}

	.gna-print-title h2 {
		color: #1F2937;
		font-size: 22px;
		margin: 0;
	}

	.gna-print-title p {
		color: #4B5563;
		margin: 4px 0 0;
	}

	.gna-svg-wrap {
		background: #fff !important;
		border: 0 !important;
		min-height: auto !important;
		overflow: visible !important;
	}

	.gna-pedigree-svg {
		height: auto !important;
		min-height: 0 !important;
		min-width: 0 !important;
		transform: none !important;
		width: 100% !important;
	}

	.gna-pedigree-empty,
	.gna-stage-header,
	.gna-editor-topbar,
	.gna-case-summary,
	.gna-side-panel,
	.gna-toast-region,
	.gna-modal {
		display: none !important;
	}

	@page {
		margin: 12mm;
		size: landscape;
	}
}

/* FASE 8 - Corrección definitiva de botones, canvas y contraste */
.gna-pedigree-app .gna-pedigree-pan-surface {
	cursor: grab;
	pointer-events: all;
}

.gna-pedigree-app .gna-pedigree-node {
	cursor: move;
	transform-box: fill-box;
	transform-origin: center;
}

.gna-pedigree-app .gna-pedigree-canvas {
	transform: none !important;
}

.gna-pedigree-app .gna-pedigree-symbol-wrap {
	pointer-events: none;
}

.gna-pedigree-app .gna-pedigree-node-name,
.gna-pedigree-app .gna-pedigree-node-meta {
	pointer-events: none;
	text-anchor: middle;
}

.gna-pedigree-app .gna-pedigree-btn,
.gna-pedigree-app .gna-btn,
.gna-pedigree-app button.gna-pedigree-btn,
.gna-pedigree-app button.gna-btn,
.gna-pedigree-app a.gna-pedigree-btn,
.gna-pedigree-app .gna-tab {
	align-items: center !important;
	border-radius: 10px !important;
	box-shadow: 0 4px 12px rgba(31, 41, 55, 0.12) !important;
	cursor: pointer !important;
	display: inline-flex !important;
	filter: none !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	gap: 8px !important;
	justify-content: center !important;
	line-height: 1.2 !important;
	min-height: 38px !important;
	opacity: 1 !important;
	padding: 10px 16px !important;
	text-decoration: none !important;
	text-shadow: none !important;
	visibility: visible !important;
	white-space: nowrap !important;
}

.gna-pedigree-app .gna-pedigree-btn-primary,
.gna-pedigree-app .gna-btn-primary {
	background: #8335A3 !important;
	border: 1px solid #8335A3 !important;
	color: #FFFFFF !important;
}

.gna-pedigree-app .gna-pedigree-btn-primary:hover,
.gna-pedigree-app .gna-pedigree-btn-primary:focus-visible,
.gna-pedigree-app .gna-btn-primary:hover,
.gna-pedigree-app .gna-btn-primary:focus-visible {
	background: #4B1764 !important;
	border-color: #4B1764 !important;
	color: #FFFFFF !important;
}

.gna-pedigree-app .gna-pedigree-btn-secondary,
.gna-pedigree-app .gna-btn-secondary {
	background: #FFFFFF !important;
	border: 1px solid #8335A3 !important;
	color: #4B1764 !important;
}

.gna-pedigree-app .gna-pedigree-btn-secondary:hover,
.gna-pedigree-app .gna-pedigree-btn-secondary:focus-visible,
.gna-pedigree-app .gna-btn-secondary:hover,
.gna-pedigree-app .gna-btn-secondary:focus-visible {
	background: #F8F5FB !important;
	border-color: #4B1764 !important;
	color: #4B1764 !important;
}

.gna-pedigree-app .gna-pedigree-btn-neutral,
.gna-pedigree-app .gna-btn-neutral {
	background: #F3F4F6 !important;
	border: 1px solid #D1D5DB !important;
	color: #111827 !important;
}

.gna-pedigree-app .gna-pedigree-btn-neutral:hover,
.gna-pedigree-app .gna-pedigree-btn-neutral:focus-visible,
.gna-pedigree-app .gna-btn-neutral:hover,
.gna-pedigree-app .gna-btn-neutral:focus-visible {
	background: #E5E7EB !important;
	border-color: #9CA3AF !important;
	color: #111827 !important;
}

.gna-pedigree-app .gna-pedigree-btn-success,
.gna-pedigree-app .gna-btn-success {
	background: #10B981 !important;
	border: 1px solid #10B981 !important;
	color: #FFFFFF !important;
}

.gna-pedigree-app .gna-pedigree-btn-success:hover,
.gna-pedigree-app .gna-pedigree-btn-success:focus-visible,
.gna-pedigree-app .gna-btn-success:hover,
.gna-pedigree-app .gna-btn-success:focus-visible {
	background: #059669 !important;
	border-color: #059669 !important;
	color: #FFFFFF !important;
}

.gna-pedigree-app .gna-pedigree-btn-danger,
.gna-pedigree-app .gna-btn-danger {
	background: #DC2626 !important;
	border: 1px solid #DC2626 !important;
	color: #FFFFFF !important;
}

.gna-pedigree-app .gna-pedigree-btn-danger:hover,
.gna-pedigree-app .gna-pedigree-btn-danger:focus-visible,
.gna-pedigree-app .gna-btn-danger:hover,
.gna-pedigree-app .gna-btn-danger:focus-visible {
	background: #991B1B !important;
	border-color: #991B1B !important;
	color: #FFFFFF !important;
}

.gna-pedigree-app .gna-pedigree-btn-ghost,
.gna-pedigree-app .gna-btn-ghost {
	background: transparent !important;
	border: 1px solid transparent !important;
	color: #4B1764 !important;
}

.gna-pedigree-app .gna-pedigree-btn-ghost:hover,
.gna-pedigree-app .gna-pedigree-btn-ghost:focus-visible,
.gna-pedigree-app .gna-btn-ghost:hover,
.gna-pedigree-app .gna-btn-ghost:focus-visible {
	background: #F8F5FB !important;
	border-color: #E6DAEF !important;
	color: #4B1764 !important;
}

.gna-pedigree-app .gna-pedigree-btn:disabled,
.gna-pedigree-app .gna-pedigree-btn[disabled],
.gna-pedigree-app .gna-btn:disabled,
.gna-pedigree-app .gna-btn[disabled],
.gna-pedigree-app button:disabled {
	background: #E5E7EB !important;
	border: 1px solid #9CA3AF !important;
	color: #374151 !important;
	cursor: not-allowed !important;
	filter: none !important;
	opacity: 1 !important;
	transform: none !important;
}

.gna-pedigree-app .gna-tab {
	background: #FFFFFF !important;
	border: 1px solid #E5E7EB !important;
	color: #4B1764 !important;
	box-shadow: none !important;
}

.gna-pedigree-app .gna-tab.is-active {
	background: #8335A3 !important;
	border-color: #8335A3 !important;
	color: #FFFFFF !important;
}

.gna-pedigree-app input,
.gna-pedigree-app select,
.gna-pedigree-app textarea {
	background: #FFFFFF !important;
	border-color: #CBD5E1 !important;
	color: #111827 !important;
	filter: none !important;
	opacity: 1 !important;
}

.gna-pedigree-app .gna-person-context button {
	background: #FFFFFF !important;
	border: 1px solid #E5E7EB !important;
	color: #4B1764 !important;
	justify-content: flex-start !important;
	width: 100% !important;
}

.gna-pedigree-app .gna-quality-panel {
	display: grid;
	gap: 14px;
}

.gna-pedigree-app .gna-quality-score-card {
	align-items: center;
	background: linear-gradient(135deg, #F8F5FB, #FFFFFF);
	border: 1px solid #E6DAEF;
	border-radius: 8px;
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	justify-content: space-between;
	padding: 16px;
}

.gna-pedigree-app .gna-quality-score-card span {
	color: #4B1764;
	display: block;
	font-size: 13px;
	font-weight: 800;
	text-transform: uppercase;
}

.gna-pedigree-app .gna-quality-score-card strong {
	color: #1F2937;
	font-size: 34px;
	line-height: 1;
}

.gna-pedigree-app .gna-quality-score-card p,
.gna-pedigree-app .gna-quality-empty p,
.gna-pedigree-app .gna-quality-finding p {
	color: #4B5563;
	margin: 4px 0 0;
}

.gna-pedigree-app .gna-quality-empty,
.gna-pedigree-app .gna-quality-group {
	background: #FFFFFF;
	border: 1px solid #E5E7EB;
	border-radius: 8px;
	padding: 14px;
}

.gna-pedigree-app .gna-quality-group h4 {
	color: #4B1764;
	margin: 0 0 10px;
}

.gna-pedigree-app .gna-quality-group.is-critical h4 {
	color: #B91C1C;
}

.gna-pedigree-app .gna-quality-group.is-warning h4 {
	color: #92400E;
}

.gna-pedigree-app .gna-quality-finding {
	align-items: center;
	border-top: 1px solid #E5E7EB;
	display: grid;
	gap: 12px;
	grid-template-columns: minmax(0, 1fr) auto;
	padding: 12px 0;
}

.gna-pedigree-app .gna-quality-finding:first-of-type {
	border-top: 0;
}

.gna-pedigree-app .gna-quality-finding strong {
	color: #1F2937;
}

.gna-pedigree-app .gna-quality-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: flex-end;
}

@media (max-width: 720px) {
	.gna-pedigree-app .gna-quality-finding {
		grid-template-columns: 1fr;
	}

	.gna-pedigree-app .gna-quality-actions {
		justify-content: stretch;
	}

	.gna-pedigree-app .gna-quality-actions .gna-pedigree-btn {
		width: 100%;
	}
}

/* FASE 8.1 - Canvas tipo editor profesional: sin scroll accidental, drag preciso */
.gna-pedigree-app .gna-svg-wrap {
	overflow: hidden !important;
	position: relative !important;
	touch-action: none !important;
	user-select: none !important;
	cursor: grab !important;
}

.gna-pedigree-app .gna-svg-wrap:active {
	cursor: grabbing !important;
}

.gna-pedigree-app .gna-pedigree-svg {
	width: 100% !important;
	height: 640px !important;
	min-height: 640px !important;
	max-width: none !important;
	display: block !important;
	touch-action: none !important;
	user-select: none !important;
}

.gna-pedigree-app .gna-pedigree-node,
.gna-pedigree-app .gna-pedigree-person-node {
	cursor: grab !important;
	pointer-events: all !important;
}

.gna-pedigree-app .gna-pedigree-node:active,
.gna-pedigree-app .gna-pedigree-person-node:active {
	cursor: grabbing !important;
}

.gna-pedigree-app .gna-pedigree-node text {
	pointer-events: none !important;
	user-select: none !important;
}

/* FASE 8.4 - Canvas libre tipo editor profesional */
.gna-pedigree-app .gna-pedigree-svg {
  touch-action: none !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  cursor: grab !important;
}
.gna-pedigree-app .gna-pedigree-node,
.gna-pedigree-app .gna-pedigree-person-node,
.gna-pedigree-app .gna-svg-person {
  cursor: grab !important;
  pointer-events: all !important;
}
.gna-pedigree-app .gna-pedigree-node:active,
.gna-pedigree-app .gna-pedigree-person-node:active,
.gna-pedigree-app .gna-svg-person:active {
  cursor: grabbing !important;
}
.gna-pedigree-app .gna-pedigree-edges-layer {
  pointer-events: none !important;
}
.gna-pedigree-app .gna-pedigree-pan-surface {
  cursor: grab !important;
}


/* FASE 9A - Herramientas de canvas tipo editor profesional */
.gna-pedigree-app .gna-canvas-tool-controls {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  align-items: center !important;
}
.gna-pedigree-app .gna-canvas-tool {
  opacity: 1 !important;
  filter: none !important;
  min-height: 38px !important;
}
.gna-pedigree-app .gna-canvas-tool.is-active,
.gna-pedigree-app .gna-canvas-tool[aria-pressed="true"] {
  background: #8335A3 !important;
  color: #FFFFFF !important;
  border-color: #8335A3 !important;
  box-shadow: 0 0 0 3px rgba(131, 53, 163, .18), 0 6px 16px rgba(31,41,55,.14) !important;
}
.gna-pedigree-app[data-canvas-tool="select"] .gna-pedigree-pan-surface {
  cursor: default !important;
}
.gna-pedigree-app[data-canvas-tool="pan"] .gna-pedigree-pan-surface {
  cursor: grab !important;
}
.gna-pedigree-app[data-canvas-tool="pan"] .gna-pedigree-pan-surface:active {
  cursor: grabbing !important;
}
.gna-pedigree-app .gna-pedigree-node,
.gna-pedigree-app .gna-pedigree-person-node {
  cursor: grab !important;
  pointer-events: all !important;
}
.gna-pedigree-app .gna-pedigree-node:active,
.gna-pedigree-app .gna-pedigree-person-node:active {
  cursor: grabbing !important;
}
.gna-pedigree-app .gna-svg-wrap,
.gna-pedigree-app .gna-pedigree-svg {
  touch-action: none !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}


/* FASE 10 - Corrección definitiva del canvas editable */
.gna-pedigree-app .gna-pedigree-node-hitbox {
  pointer-events: all !important;
  cursor: grab !important;
}
.gna-pedigree-app .gna-pedigree-node,
.gna-pedigree-app .gna-pedigree-node * {
  vector-effect: non-scaling-stroke;
}
.gna-pedigree-app .gna-pedigree-node .gna-pedigree-node-hitbox {
  pointer-events: all !important;
}
.gna-pedigree-app .gna-pedigree-node .gna-pedigree-symbol-wrap,
.gna-pedigree-app .gna-pedigree-node .gna-pedigree-symbol-wrap *,
.gna-pedigree-app .gna-pedigree-node text {
  pointer-events: none !important;
}
.gna-pedigree-app[data-canvas-tool="select"] .gna-pedigree-pan-surface {
  pointer-events: none !important;
}
.gna-pedigree-app[data-canvas-tool="pan"] .gna-pedigree-pan-surface {
  pointer-events: all !important;
}
.gna-pedigree-app[data-canvas-tool="select"] .gna-pedigree-svg {
  cursor: default !important;
}
.gna-pedigree-app[data-canvas-tool="select"] .gna-pedigree-node {
  cursor: grab !important;
}
.gna-pedigree-app[data-canvas-tool="select"] .gna-pedigree-node:active {
  cursor: grabbing !important;
}

/* FASE 10.1 - Suavidad de arrastre sin tocar persistencia */
.gna-pedigree-app.is-dragging-node .gna-pedigree-node,
.gna-pedigree-app.is-dragging-node .gna-pedigree-node *,
.gna-pedigree-app.is-dragging-node .gna-person-symbol {
  transition: none !important;
  animation: none !important;
  filter: none !important;
}
.gna-pedigree-app.is-dragging-node .gna-pedigree-svg,
.gna-pedigree-app.is-dragging-node .gna-svg-wrap {
  cursor: grabbing !important;
}
.gna-pedigree-app .gna-pedigree-node {
  will-change: transform;
}

/* FASE 9 - Interfaz profesional tipo software de pedigrees */
.gna-pedigree-app.gna-progeny-shell {
	--gna-pro-topbar: #2f3f46;
	--gna-pro-topbar-dark: #26343a;
	--gna-pro-border: #cfd4d8;
	--gna-pro-bg: #eef0f2;
	--gna-pro-panel: #ffffff;
	--gna-pro-blue: #1388c9;
	background: var(--gna-pro-bg) !important;
	border: 1px solid #bfc6ca !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	font-size: 13px;
	margin: 0 !important;
}

.gna-pro-topbar {
	align-items: center;
	background: var(--gna-pro-topbar);
	color: #fff;
	display: grid;
	gap: 18px;
	grid-template-columns: auto 1fr auto;
	min-height: 48px;
	padding: 0 12px;
}

.gna-pro-brand {
	align-items: center;
	display: inline-flex;
	font-size: 21px;
	gap: 8px;
	letter-spacing: 0.4px;
	text-transform: uppercase;
}

.gna-pro-brand-orb {
	background: radial-gradient(circle at 35% 35%, #fff, #f26b7d 30%, #9e1027 72%);
	border-radius: 50%;
	display: inline-block;
	height: 25px;
	width: 25px;
}

.gna-pro-mainnav {
	display: flex;
	gap: 0;
	height: 48px;
	overflow-x: auto;
}

.gna-pro-mainnav span {
	align-items: center;
	color: #fff;
	display: inline-flex;
	font-size: 12px;
	font-weight: 800;
	padding: 0 15px;
	text-transform: uppercase;
	white-space: nowrap;
}

.gna-pro-mainnav span.is-active,
.gna-pro-mainnav span:hover {
	background: var(--gna-pro-topbar-dark);
}

.gna-pro-user-tools {
	align-items: center;
	display: inline-flex;
	gap: 14px;
}

.gna-pro-avatar {
	background: #fff;
	border-radius: 50%;
	display: inline-block;
	height: 28px;
	width: 28px;
}

.gna-pro-worktabs {
	align-items: end;
	background: #e3e5e7;
	border-bottom: 1px solid #bfc6ca;
	display: flex;
	min-height: 37px;
	padding: 8px 8px 0;
}

.gna-pro-worktab {
	background: #f6f7f8 !important;
	border: 1px solid #c8cdd1 !important;
	border-bottom: 0 !important;
	border-radius: 0 !important;
	color: #344047 !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	min-height: 29px !important;
	padding: 6px 13px !important;
}

.gna-pro-worktab.is-active {
	background: #fff !important;
	color: #0b78ad !important;
}

.gna-pro-main {
	padding: 0 !important;
}

.gna-pro-manager {
	display: grid;
	grid-template-columns: 295px 1fr;
	min-height: 720px;
}

.gna-pro-manager-sidebar {
	background: #f5f6f7;
	border-right: 1px solid #cfd4d8;
	padding: 14px 14px 20px;
}

.gna-pro-pane-title {
	align-items: center;
	display: flex;
	justify-content: space-between;
	margin-bottom: 12px;
}

.gna-pro-mini-btn {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	color: #0875ad !important;
	font-size: 18px !important;
	min-height: 22px !important;
	padding: 0 4px !important;
}

.gna-pro-folder-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.gna-pro-folder-list li {
	align-items: center;
	border-radius: 3px;
	color: #222;
	display: flex;
	gap: 8px;
	min-height: 26px;
	padding: 4px 6px;
}

.gna-pro-folder-list li.is-active,
.gna-pro-folder-list li:hover {
	background: #e9edf0;
}

.gna-folder-icon {
	background: #f6d76b;
	border: 1px solid #d2aa27;
	border-radius: 2px;
	display: inline-block;
	height: 11px;
	width: 15px;
}

.gna-pro-manager-content {
	background: #fff;
	display: grid;
	grid-template-rows: auto minmax(330px, 1fr) 230px;
	min-width: 0;
}

.gna-pro-manager-header {
	align-items: center;
	background: #fff;
	border-bottom: 1px solid #d7dbde;
	display: flex;
	justify-content: space-between;
	padding: 18px 18px 14px;
}

.gna-pro-manager-header h2 {
	color: #0875ad;
	font-size: 20px;
	font-weight: 500;
	line-height: 1;
	margin: 0 0 8px;
}

.gna-pro-manager-header span {
	color: #777;
	font-size: 12px;
}

.gna-pro-manager-actions {
	align-items: center;
	display: flex;
	gap: 8px;
}

.gna-pro-search input {
	background: #fff !important;
	border: 1px solid #bfc6ca !important;
	border-radius: 2px !important;
	color: #111 !important;
	height: 32px !important;
	min-height: 32px !important;
	padding: 5px 28px 5px 10px !important;
	width: 280px !important;
}

.gna-pro-table-panel {
	background: #fff;
	overflow: auto;
}

.gna-pro-pedigree-table {
	border-collapse: collapse !important;
	box-shadow: none !important;
	font-size: 13px;
	width: 100%;
}

.gna-pro-pedigree-table th {
	background: #f0f1f2 !important;
	border-bottom: 1px solid #cfd4d8 !important;
	color: #222 !important;
	font-size: 12px !important;
	font-weight: 800 !important;
	height: 32px;
	padding: 7px 8px !important;
	text-align: left;
}

.gna-pro-pedigree-table td {
	border-bottom: 1px solid #e1e4e6 !important;
	color: #333;
	padding: 7px 8px !important;
	vertical-align: middle;
}

.gna-pro-pedigree-table tr.is-selected,
.gna-pro-pedigree-table tbody tr:hover {
	background: #f1f8fc;
}

.gna-pro-link-button {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	color: #0a74ae !important;
	font-weight: 600 !important;
	min-height: 20px !important;
	padding: 0 !important;
	text-align: left !important;
}

.gna-pro-table-actions {
	display: flex;
	gap: 5px;
}

.gna-pro-bottom-panel {
	background: #fff;
	border-top: 1px solid #bfc6ca;
	display: grid;
	grid-template-rows: auto 1fr;
	min-height: 220px;
}

.gna-pro-bottom-tabs {
	align-items: end;
	background: #f0f1f2;
	border-bottom: 1px solid #d2d7da;
	display: flex;
	gap: 3px;
	padding: 6px 8px 0;
}

.gna-pro-bottom-tabs button {
	background: #f8f9fa !important;
	border: 1px solid #c7cdd1 !important;
	border-bottom: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	color: #3b4650 !important;
	font-size: 12px !important;
	min-height: 26px !important;
	padding: 5px 12px !important;
}

.gna-pro-bottom-tabs button.is-active {
	background: #fff !important;
	color: #0a74ae !important;
}

.gna-pro-individuals-preview {
	overflow: auto;
	padding: 0;
}

.gna-pro-individuals-preview > p {
	color: #8a8f95;
	margin: 55px auto;
	text-align: center;
}

.gna-pro-editor {
	background: #fff;
	min-height: 820px;
}

.gna-pro-editor-header {
	align-items: center;
	background: #fff;
	border-bottom: 1px solid #d1d5d9;
	display: flex;
	justify-content: space-between;
	padding: 10px 12px;
}

.gna-pro-editor-name {
	align-items: center;
	display: flex;
	gap: 14px;
}

.gna-pro-editor-name h2 {
	color: #111;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.1;
	margin: 0;
}

.gna-pro-editor-name p {
	color: #555;
	font-size: 12px;
	margin: 3px 0 0;
}

.gna-pro-editor-status {
	color: #667;
	font-size: 12px;
}

.gna-pro-editor-toolbar {
	align-items: center;
	background: #f4f5f6;
	border-bottom: 1px solid #cdd3d7;
	display: flex;
	gap: 4px;
	overflow-x: auto;
	padding: 7px 8px;
}

.gna-pro-editor-toolbar .gna-btn,
.gna-pro-editor-toolbar .gna-pedigree-btn {
	border-radius: 3px !important;
	box-shadow: none !important;
	font-size: 12px !important;
	min-height: 36px !important;
	padding: 8px 12px !important;
}

.gna-pro-secondary-actions {
	border-left: 0 !important;
	border-right: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	margin: 0 !important;
}

.gna-pro-editor .gna-case-summary {
	border-left: 0 !important;
	border-radius: 0 !important;
	border-right: 0 !important;
	box-shadow: none !important;
	margin: 0 !important;
}

.gna-pro-editor .gna-tabs {
	background: #efeff0;
	border-bottom: 1px solid #cdd3d7;
	border-top: 1px solid #e3e6e8;
	padding: 5px 8px 0;
}

.gna-pro-editor .gna-tab {
	border-radius: 0 !important;
	box-shadow: none !important;
	font-size: 12px !important;
	min-height: 28px !important;
	padding: 6px 11px !important;
}

.gna-pro-editor .gna-tab.is-active {
	background: #fff !important;
	border-bottom-color: #fff !important;
}

.gna-pro-editor .gna-editor-layout {
	grid-template-columns: minmax(0, 1fr) 360px;
}

.gna-pro-editor .gna-pedigree-stage {
	border-radius: 0 !important;
	box-shadow: none !important;
}

.gna-pro-editor .gna-stage-header {
	background: #fff;
	border-bottom: 1px solid #e1e4e7;
	padding: 8px 10px;
}

.gna-pro-editor .gna-svg-wrap {
	background: #fff !important;
	border: 0 !important;
	min-height: 680px !important;
	position: relative;
}

.gna-pro-editor .gna-svg-wrap::before,
.gna-pro-editor .gna-svg-wrap::after {
	border-left: 1px dashed #6962ff;
	bottom: 0;
	content: "";
	opacity: .8;
	pointer-events: none;
	position: absolute;
	top: 0;
	z-index: 1;
}

.gna-pro-editor .gna-svg-wrap::before {
	left: 33.33%;
}

.gna-pro-editor .gna-svg-wrap::after {
	left: 66.66%;
}

.gna-pro-editor .gna-pedigree-svg {
	background: #fff !important;
	min-height: 680px !important;
}

.gna-pro-editor .gna-side-panel {
	background: #f6f7f8;
	border-left: 1px solid #d1d6d9;
}

.gna-pro-editor .gna-side-section {
	border-radius: 0 !important;
	box-shadow: none !important;
	margin-bottom: 8px;
}

.gna-pro-row-actions {
	display: flex;
	gap: 6px;
}

@media (max-width: 1100px) {
	.gna-pro-manager {
		grid-template-columns: 1fr;
	}
	.gna-pro-manager-sidebar {
		display: none;
	}
	.gna-pro-editor .gna-editor-layout {
		grid-template-columns: 1fr;
	}
	.gna-pro-mainnav {
		display: none;
	}
}

/* FASE 10 - Datasheet y campos configurables tipo software clínico */
.gna-pedigree-app .gna-pro-mainnav button {
	appearance: none !important;
	background: transparent !important;
	border: 0 !important;
	color: #fff !important;
	font: inherit !important;
	font-weight: 700 !important;
	padding: 0 10px !important;
	min-height: 34px !important;
	cursor: pointer !important;
	opacity: 1 !important;
}

.gna-pedigree-app .gna-pro-mainnav button:hover {
	background: rgba(255,255,255,.12) !important;
	border-radius: 4px !important;
}

.gna-pedigree-app .gna-datasheet-workbench,
.gna-pedigree-app .gna-fields-workbench {
	min-height: 520px;
}

.gna-pedigree-app .gna-datasheet-toolbar {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	margin: 14px 0;
	padding: 12px;
	background: #f8f5fb;
	border: 1px solid #e7d9ef;
	border-radius: 12px;
}

.gna-pedigree-app .gna-datasheet-toolbar .gna-pro-search {
	min-width: min(420px, 100%);
	flex: 1 1 280px;
}

.gna-pedigree-app .gna-datasheet-toolbar select,
.gna-pedigree-app .gna-datasheet-toolbar input {
	min-height: 38px !important;
}

.gna-pedigree-app .gna-datasheet-table-wrap {
	max-height: 560px;
	overflow: auto;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	background: #fff;
}

.gna-pedigree-app .gna-datasheet-table-wrap .gna-data-table {
	min-width: 1080px;
}

.gna-pedigree-app .gna-datasheet-table-wrap thead th {
	position: sticky;
	top: 0;
	z-index: 2;
	background: #f3f4f6;
}

.gna-pedigree-app .gna-datasheet-actions,
.gna-pedigree-app .gna-datasheet-actions-inline {
	display: inline-flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
}

.gna-pedigree-app .gna-fields-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr);
	gap: 18px;
}

.gna-pedigree-app .gna-fields-card {
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 14px;
	box-shadow: 0 10px 24px rgba(31,41,55,.07);
	padding: 18px;
}

.gna-pedigree-app .gna-fields-card h4 {
	margin: 0 0 6px;
	color: #4b1764;
	font-size: 18px;
}

.gna-pedigree-app .gna-fields-card p {
	margin: 0 0 14px;
	color: #4b5563;
}

.gna-pedigree-app .gna-field-toggle-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.gna-pedigree-app .gna-field-toggle {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 10px;
	align-items: start;
	padding: 12px;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	background: #f9fafb;
	cursor: pointer;
}

.gna-pedigree-app .gna-field-toggle input {
	margin-top: 3px;
}

.gna-pedigree-app .gna-field-toggle strong {
	display: block;
	color: #111827;
	font-size: 14px;
}

.gna-pedigree-app .gna-field-toggle em {
	display: block;
	font-style: normal;
	color: #6b7280;
	font-size: 12px;
	line-height: 1.35;
	margin-top: 3px;
}

.gna-pedigree-app .gna-fields-list {
	margin: 0;
	padding-left: 18px;
	color: #1f2937;
	columns: 2;
}

.gna-pedigree-app .gna-fields-list li {
	break-inside: avoid;
	margin-bottom: 6px;
}

@media (max-width: 900px) {
	.gna-pedigree-app .gna-fields-grid,
	.gna-pedigree-app .gna-field-toggle-grid {
		grid-template-columns: 1fr;
	}
	.gna-pedigree-app .gna-fields-list {
		columns: 1;
	}
}

/* FASE 11 - Herramientas profesionales de selección y edición visual */
.gna-pedigree-app .gna-pedigree-node.is-selected .gna-pedigree-node-hitbox,
.gna-pedigree-app .gna-pedigree-node.is-selected .gna-person-symbol {
	stroke: #10b981 !important;
	stroke-width: 4 !important;
}

.gna-pedigree-app .gna-pedigree-node.is-selected .gna-pedigree-node-hitbox {
	fill: rgba(16, 185, 129, .08) !important;
	stroke-dasharray: 7 5 !important;
}

.gna-pedigree-app .gna-pedigree-node.is-selected .gna-pedigree-node-name {
	font-weight: 800 !important;
	fill: #065f46 !important;
}

.gna-pedigree-app [data-selection-label],
.gna-pedigree-app [data-selection-count] {
	font-weight: 800;
}

.gna-pedigree-app .gna-pedigree-btn.is-active,
.gna-pedigree-app .gna-btn.is-active {
	outline: 3px solid rgba(16,185,129,.28) !important;
	box-shadow: 0 0 0 1px #10b981 inset, 0 8px 16px rgba(16,185,129,.18) !important;
}

/* FASE 12 - Módulo global de individuos y ficha avanzada */
.gna-pedigree-app .gna-individuals-module {
	background: #f3f4f6;
	min-height: 720px;
}

.gna-pedigree-app .gna-individuals-shell {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 18px;
}

.gna-pedigree-app .gna-individuals-header,
.gna-pedigree-app .gna-individuals-searchbar {
	background: #ffffff;
	border: 1px solid #e5e7eb;
	border-radius: 14px;
	box-shadow: 0 10px 24px rgba(31,41,55,.06);
	padding: 16px;
}

.gna-pedigree-app .gna-individuals-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.gna-pedigree-app .gna-individuals-header h2 {
	margin: 0;
	color: #111827;
	font-size: 24px;
}

.gna-pedigree-app .gna-individuals-header p {
	margin: 4px 0 0;
	color: #4b5563;
}

.gna-pedigree-app .gna-individuals-actions,
.gna-pedigree-app .gna-profile-actions {
	display: inline-flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
}

.gna-pedigree-app .gna-individuals-searchbar {
	display: grid;
	grid-template-columns: minmax(280px, 1fr) 210px 210px;
	gap: 12px;
	align-items: center;
}

.gna-pedigree-app .gna-individuals-layout {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(380px, .8fr);
	gap: 16px;
	align-items: start;
}

.gna-pedigree-app .gna-individuals-results-card,
.gna-pedigree-app .gna-individual-profile-card {
	min-height: 420px;
}

.gna-pedigree-app .gna-profile-hero {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 14px;
	padding: 16px;
	border: 1px solid #e5e7eb;
	border-radius: 14px;
	background: linear-gradient(135deg, #ffffff 0%, #f8f5fb 100%);
	margin-bottom: 14px;
}

.gna-pedigree-app .gna-profile-hero h3 {
	margin: 0;
	font-size: 22px;
	color: #4b1764;
}

.gna-pedigree-app .gna-profile-hero p {
	margin: 5px 0 0;
	color: #4b5563;
}

.gna-pedigree-app .gna-profile-tags {
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
	margin-top: 10px;
}

.gna-pedigree-app .gna-profile-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
}

.gna-pedigree-app .gna-profile-section {
	background: #ffffff;
	border: 1px solid #e5e7eb;
	border-radius: 14px;
	padding: 14px;
	box-shadow: 0 8px 18px rgba(31,41,55,.04);
	margin-bottom: 14px;
}

.gna-pedigree-app .gna-profile-section h4 {
	margin: 0 0 10px;
	font-size: 16px;
	color: #4b1764;
}

.gna-pedigree-app .gna-profile-dl {
	display: grid;
	grid-template-columns: 130px 1fr;
	gap: 8px 12px;
	margin: 0;
}

.gna-pedigree-app .gna-profile-dl dt {
	font-weight: 800;
	color: #374151;
}

.gna-pedigree-app .gna-profile-dl dd {
	margin: 0;
	color: #111827;
}

.gna-pedigree-app .gna-profile-roadmap ul {
	margin: 0;
	padding-left: 18px;
	columns: 2;
}

@media (max-width: 1100px) {
	.gna-pedigree-app .gna-individuals-layout,
	.gna-pedigree-app .gna-individuals-searchbar {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 760px) {
	.gna-pedigree-app .gna-individuals-header,
	.gna-pedigree-app .gna-profile-hero {
		flex-direction: column;
		align-items: stretch;
	}
	.gna-pedigree-app .gna-profile-dl {
		grid-template-columns: 1fr;
	}
	.gna-pedigree-app .gna-profile-roadmap ul {
		columns: 1;
	}
}

/* FASE 13 - Campos personalizados tipo Fields */
.gna-pedigree-app .gna-custom-fields-admin {
  grid-column: 1 / -1;
}
.gna-pedigree-app .gna-custom-field-form {
  margin: 14px 0 18px;
  padding: 16px;
  border: 1px solid #E5E7EB;
  border-radius: 14px;
  background: #FFFFFF;
}
.gna-pedigree-app .gna-custom-field-input small,
.gna-pedigree-app .gna-muted {
  display: block;
  margin-top: 6px;
  color: #6B7280 !important;
  font-size: 12px;
  line-height: 1.35;
}
.gna-pedigree-app .gna-custom-check-inline {
  min-height: 42px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid #CBD5E1;
  border-radius: 10px;
  background: #FFFFFF;
}
.gna-pedigree-app .gna-empty-note {
  margin: 10px 0;
  padding: 14px 16px;
  border: 1px dashed #C4B5FD;
  border-radius: 12px;
  background: #F8F5FB;
  color: #4B1764;
  font-weight: 700;
}
.gna-pedigree-app .gna-person-custom-label {
  paint-order: stroke fill;
  stroke: #FFFFFF;
  stroke-width: 3px;
  stroke-linejoin: round;
}

/* FASE 14 - Constructor de consultas / Spreadsheets */
.gna-pedigree-app .gna-query-workbench {
  min-height: 620px;
}

.gna-pedigree-app .gna-query-actions,
.gna-pedigree-app .gna-saved-query-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.gna-pedigree-app .gna-query-layout {
  display: grid;
  grid-template-columns: 290px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.gna-pedigree-app .gna-query-sidebar {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 14px;
  box-shadow: 0 8px 24px rgba(31,41,55,.08);
  max-height: 620px;
  overflow: auto;
}

.gna-pedigree-app .gna-query-sidebar h4 {
  margin: 0 0 12px;
  color: #111827;
  font-size: 15px;
}

.gna-pedigree-app .gna-query-main {
  min-width: 0;
}

.gna-pedigree-app .gna-query-form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap: 12px;
  padding: 14px;
  background: #f8f5fb;
  border: 1px solid #e9d5ff;
  border-radius: 14px;
  margin-bottom: 12px;
}

.gna-pedigree-app .gna-query-result-summary {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 7px 12px;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  color: #4b1764;
  font-weight: 700;
  margin-bottom: 10px;
}

.gna-pedigree-app .gna-saved-query-list {
  display: grid;
  gap: 10px;
}

.gna-pedigree-app .gna-saved-query-card {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 10px;
  background: #f9fafb;
}

.gna-pedigree-app .gna-saved-query-card strong {
  display: block;
  color: #111827;
  margin-bottom: 4px;
}

.gna-pedigree-app .gna-saved-query-card p {
  color: #4b5563;
  font-size: 13px;
  margin: 0 0 8px;
}

.gna-pedigree-app .gna-query-results {
  max-height: 540px;
  overflow: auto;
  border-radius: 14px;
  border: 1px solid #e5e7eb;
  background: #ffffff;
}

.gna-pedigree-app .gna-query-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #4b1764 !important;
  color: #ffffff !important;
}

.gna-pedigree-app .gna-query-table td {
  vertical-align: top;
}

@media (max-width: 1100px) {
  .gna-pedigree-app .gna-query-layout {
    grid-template-columns: 1fr;
  }
  .gna-pedigree-app .gna-query-form-grid {
    grid-template-columns: repeat(2, minmax(150px, 1fr));
  }
}

@media (max-width: 680px) {
  .gna-pedigree-app .gna-query-form-grid {
    grid-template-columns: 1fr;
  }
}

/* FASE 15 - Navegación Progeny-like, carpetas funcionales y módulos superiores */
.gna-pedigree-app.gna-progeny-shell {
  --gna-pro-topbar: #2d3d44;
  --gna-pro-topbar-dark: #243238;
  --gna-pro-blue: #087fbc;
}
.gna-pedigree-app .gna-pro-brand strong {
  letter-spacing: 1.2px;
}
.gna-pedigree-app .gna-pro-mainnav button {
  align-items: center !important;
  align-self: stretch !important;
  border-radius: 0 !important;
  color: #fff !important;
  display: inline-flex !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  min-height: 48px !important;
  padding: 0 16px !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}
.gna-pedigree-app .gna-pro-mainnav button.is-active,
.gna-pedigree-app .gna-pro-mainnav button:hover {
  background: #233137 !important;
}
.gna-pedigree-app .gna-pro-worktabs {
  gap: 0;
  overflow-x: auto;
  padding-left: 14px;
}
.gna-pedigree-app .gna-pro-worktab {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  border-top: 3px solid transparent !important;
  margin-right: 2px !important;
}
.gna-pedigree-app .gna-pro-worktab.is-active {
  border-top-color: #0a8ccc !important;
}
.gna-pedigree-app .gna-pro-folder-list li {
  padding: 0 !important;
  display: block !important;
}
.gna-pedigree-app .gna-pro-folder-list button {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 3px !important;
  box-shadow: none !important;
  color: #333 !important;
  cursor: pointer !important;
  display: flex !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  gap: 7px !important;
  justify-content: flex-start !important;
  min-height: 28px !important;
  opacity: 1 !important;
  padding: 4px 6px !important;
  text-align: left !important;
  width: 100% !important;
}
.gna-pedigree-app .gna-pro-folder-list button.is-active,
.gna-pedigree-app .gna-pro-folder-list button:hover {
  background: #e6ebef !important;
  color: #111827 !important;
}
.gna-pedigree-app .gna-folder-caret {
  color: #4b5563;
  display: inline-block;
  width: 12px;
}
.gna-pedigree-app .gna-pro-folder-select {
  background: #fff !important;
  border: 1px solid #cfd4d8 !important;
  border-radius: 3px !important;
  color: #1f2937 !important;
  font-size: 12px !important;
  min-height: 28px !important;
  padding: 4px 8px !important;
  width: 160px !important;
}
.gna-pedigree-app .gna-pro-module {
  background: #fff;
  min-height: 760px;
  padding: 20px 24px;
}
.gna-pedigree-app .gna-pro-module-header {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin-bottom: 18px;
}
.gna-pedigree-app .gna-pro-module-header h2 {
  color: #0875ad;
  font-size: 24px;
  font-weight: 500;
  margin: 0;
}
.gna-pedigree-app .gna-pro-module-header > div:last-child {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.gna-pedigree-app .gna-pro-search-row {
  align-items: center;
  display: flex;
  gap: 12px;
  margin-bottom: 24px;
}
.gna-pedigree-app .gna-pro-search-row input,
.gna-pedigree-app .gna-pro-search-row select {
  border-radius: 3px !important;
  min-height: 36px !important;
  max-width: 460px;
}
.gna-pedigree-app .gna-pro-module-card {
  background: #fff;
  border: 1px solid #d8dde1;
  border-radius: 4px;
  box-shadow: none;
  color: #374151;
  padding: 18px;
}
.gna-pedigree-app .gna-pro-empty-row {
  color: #8b949b !important;
  font-size: 16px;
  height: 120px;
  text-align: center !important;
}
.gna-pedigree-app .gna-pro-pedigree-table .gna-pro-link-button::before {
  content: "▧";
  color: #d8b52f;
  margin-right: 8px;
}
.gna-pedigree-app .gna-pro-table-actions .gna-btn-ghost {
  color: #087fbc !important;
}
.gna-pedigree-app .gna-pro-manager-actions .gna-btn-primary,
.gna-pedigree-app .gna-pro-module-header .gna-btn-primary {
  background: #0788c8 !important;
  border-color: #0788c8 !important;
  color: #fff !important;
  border-radius: 3px !important;
}
.gna-pedigree-app .gna-pro-manager-actions .gna-btn-secondary,
.gna-pedigree-app .gna-pro-module-header .gna-btn-secondary {
  background: #fff !important;
  border-color: #c9d1d6 !important;
  color: #344047 !important;
  border-radius: 3px !important;
}
.gna-pedigree-app .gna-pro-editor-toolbar .gna-btn {
  background: #fff !important;
  border: 1px solid #c8d0d6 !important;
  color: #344047 !important;
}
.gna-pedigree-app .gna-pro-editor-toolbar .gna-btn-primary {
  background: #fff !important;
  color: #087fbc !important;
}

/* FASE 16 - Pestañas cerrables y carpetas administrables */
.gna-pedigree-app .gna-pro-worktab-close {
  align-items: center !important;
  border-radius: 2px !important;
  color: #475569 !important;
  cursor: pointer !important;
  display: inline-flex !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  height: 18px !important;
  justify-content: center !important;
  line-height: 1 !important;
  margin-left: 6px !important;
  min-width: 18px !important;
  opacity: 1 !important;
}
.gna-pedigree-app .gna-pro-worktab-close:hover {
  background: #dbe3e8 !important;
  color: #111827 !important;
}
.gna-pedigree-app .gna-pro-worktab.is-active .gna-pro-worktab-close:hover {
  background: #edf2f7 !important;
}
.gna-pedigree-app .gna-pro-folder-item {
  align-items: center !important;
  display: flex !important;
  gap: 4px !important;
  padding: 0 !important;
  width: 100% !important;
}
.gna-pedigree-app .gna-pro-folder-item > button[data-action="select-folder"] {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
.gna-pedigree-app .gna-pro-folder-item > .gna-pro-folder-delete {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 3px !important;
  box-shadow: none !important;
  color: #64748b !important;
  cursor: pointer !important;
  display: inline-flex !important;
  flex: 0 0 24px !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  height: 24px !important;
  justify-content: center !important;
  min-height: 24px !important;
  opacity: 1 !important;
  padding: 0 !important;
  width: 24px !important;
}
.gna-pedigree-app .gna-pro-folder-item > .gna-pro-folder-delete:hover {
  background: #fee2e2 !important;
  color: #b91c1c !important;
}
.gna-pedigree-app .gna-folder-label {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.gna-pedigree-app .gna-pro-editor-name h2[data-case-title],
.gna-pedigree-app .gna-pro-worktab [data-case-title] {
  max-width: 360px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* FASE 17 - Pestañas cerrables robustas, carpetas y papelera */
.gna-pedigree-app .gna-pro-worktab {
  align-items: center !important;
  background: #f6f7f8 !important;
  border: 1px solid #c8cdd1 !important;
  border-bottom: 0 !important;
  border-radius: 0 !important;
  color: #344047 !important;
  display: inline-flex !important;
  gap: 4px !important;
  min-height: 29px !important;
  padding: 0 !important;
  margin-right: 2px !important;
  border-top: 3px solid transparent !important;
}
.gna-pedigree-app .gna-pro-worktab.is-active {
  background: #fff !important;
  color: #0b78ad !important;
  border-top-color: #0a8ccc !important;
}
.gna-pedigree-app .gna-pro-worktab-main,
.gna-pedigree-app .gna-pro-worktab-close {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: inherit !important;
  cursor: pointer !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  min-height: 26px !important;
  opacity: 1 !important;
  padding: 5px 8px !important;
}
.gna-pedigree-app .gna-pro-worktab-main { max-width: 280px !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
.gna-pedigree-app .gna-pro-worktab-close {
  align-items: center !important;
  color: #475569 !important;
  display: inline-flex !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  justify-content: center !important;
  min-width: 24px !important;
  padding: 4px 6px !important;
}
.gna-pedigree-app .gna-pro-worktab-close:hover { background: #fee2e2 !important; color: #b91c1c !important; }
.gna-pedigree-app .gna-pro-folder-item.is-trash > button[data-action="select-folder"] { color: #b91c1c !important; }
.gna-pedigree-app .gna-pro-trash-note { background: #fff7ed; border: 1px solid #fed7aa; color: #9a3412; font-size: 12px; padding: 8px 10px; }
.gna-pedigree-app .gna-order-grid { display: grid; grid-template-columns: repeat(3, minmax(180px, 1fr)); gap: 12px; }
.gna-pedigree-app .gna-order-grid .gna-field-wide { grid-column: 1 / -1; }
@media (max-width: 900px) { .gna-pedigree-app .gna-order-grid { grid-template-columns: 1fr; } }

/* FASE 18 - Correcciones reales de pestañas, papelera y carpetas */
.gna-pedigree-app .gna-pro-worktab[hidden],
.gna-pedigree-app [data-worktab-view][hidden] {
  display: none !important;
}
.gna-pedigree-app .gna-pro-worktab-close {
  pointer-events: auto !important;
  position: relative !important;
  z-index: 3 !important;
}
.gna-pedigree-app .gna-pro-worktab-main {
  pointer-events: auto !important;
}
.gna-pedigree-app .gna-pro-folder-select:disabled {
  background: #e5e7eb !important;
  color: #374151 !important;
  opacity: 1 !important;
}
.gna-pedigree-app .gna-pro-table-actions .gna-btn-danger {
  background: #dc2626 !important;
  border-color: #dc2626 !important;
  color: #fff !important;
}
.gna-pedigree-app [data-modal="confirm"] .gna-btn-success {
  background: #10b981 !important;
  border-color: #10b981 !important;
  color: #fff !important;
}
.gna-pedigree-app [data-modal="confirm"] .gna-btn-primary {
  background: #8335a3 !important;
  border-color: #8335a3 !important;
  color: #fff !important;
}

/* FASE 19 - Mover a carpeta visible + Letters profesional */
.gna-pedigree-app .gna-pro-folder-select-inline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.gna-pedigree-app .gna-letter-grid,
.gna-pedigree-app .gna-letter-preview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 14px;
}
.gna-pedigree-app .gna-letter-preview-grid .gna-form-actions {
  align-self: end;
}
.gna-pedigree-app .gna-letter-preview-output {
  margin-top: 14px;
  border: 1px solid #E5E7EB;
  border-radius: 14px;
  background: #fff;
  padding: 16px;
  min-height: 120px;
  color: #111827;
}
.gna-pedigree-app .gna-letter-preview-document {
  max-width: 900px;
  margin: 0 auto;
}
.gna-pedigree-app .gna-letter-preview-subject {
  font-weight: 800;
  color: #4B1764;
  border-bottom: 2px solid #8335A3;
  padding-bottom: 10px;
  margin-bottom: 14px;
  font-size: 18px;
}
.gna-pedigree-app .gna-letter-preview-body {
  line-height: 1.6;
  color: #111827;
}
.gna-pedigree-app .gna-letter-preview-body p {
  margin: 0 0 12px;
}
.gna-pedigree-app .gna-pro-help {
  background: #F8F5FB;
  border: 1px solid #E9D5FF;
  color: #4B1764;
  padding: 10px 12px;
  border-radius: 12px;
  font-size: 13px;
}
.gna-pedigree-app .gna-pro-table-actions .gna-btn {
  white-space: nowrap !important;
}
@media (max-width: 820px) {
  .gna-pedigree-app .gna-letter-grid,
  .gna-pedigree-app .gna-letter-preview-grid {
    grid-template-columns: 1fr;
  }
}

/* FASE 21 - Invites seguros y cuestionario publico */
.gna-pedigree-app .gna-pro-module-subtitle {
  color: #475569;
  font-size: 13px;
  margin: 4px 0 0;
}
.gna-pedigree-app .gna-invite-response-panel[hidden] {
  display: none !important;
}
.gna-pedigree-app .gna-invite-response-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.gna-pedigree-app .gna-invite-response-head h3 { margin: 0; color: #4B1764; }
.gna-pedigree-app .gna-invite-response-head p { margin: 3px 0 0; color: #64748b; }
.gna-pedigree-app .gna-invite-response-card {
  background: #fff;
  border: 1px solid #E5E7EB;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(31,41,55,.08);
  margin-top: 12px;
  padding: 14px;
}
.gna-pedigree-app .gna-invite-response-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  color: #334155;
  margin-bottom: 10px;
}
.gna-pedigree-app .gna-invite-response-history {
  background: #F8F5FB;
  border: 1px solid #E9D5FF;
  border-radius: 12px;
  color: #111827;
  margin-bottom: 12px;
  padding: 10px 12px;
}
.gna-pedigree-app .gna-invite-response-history p { margin: 5px 0 0; white-space: pre-wrap; }
.gna-pedigree-app .gna-pro-muted { color: #64748b; }
.gna-pedigree-public-body {
  background: #f1f5f9;
  margin: 0;
}
.gna-pedigree-public-wrap {
  box-sizing: border-box;
  font-family: Arial, Helvetica, sans-serif;
  min-height: 100vh;
  padding: 28px 16px;
}
.gna-public-card {
  background: #fff;
  border: 1px solid #E5E7EB;
  border-radius: 18px;
  box-shadow: 0 18px 45px rgba(31, 41, 55, .14);
  color: #111827;
  margin: 0 auto;
  max-width: 1050px;
  padding: 22px;
}
.gna-public-header {
  align-items: center;
  border-bottom: 3px solid #8335A3;
  display: flex;
  gap: 14px;
  margin-bottom: 18px;
  padding-bottom: 14px;
}
.gna-public-mark {
  align-items: center;
  background: linear-gradient(135deg, #8335A3, #4B1764);
  border-radius: 14px;
  color: #fff;
  display: inline-flex;
  font-weight: 900;
  height: 54px;
  justify-content: center;
  letter-spacing: .08em;
  width: 54px;
}
.gna-public-header h1 { font-size: 24px; margin: 0; color: #4B1764; }
.gna-public-header p { margin: 4px 0 0; color: #475569; }
.gna-public-context,
.gna-public-alert {
  border-radius: 12px;
  margin: 12px 0;
  padding: 11px 13px;
}
.gna-public-context { background: #F8F5FB; border: 1px solid #E9D5FF; color: #4B1764; }
.gna-public-alert-error { background: #FEF2F2; border: 1px solid #FECACA; color: #991B1B; }
.gna-public-alert-success { background: #ECFDF5; border: 1px solid #BBF7D0; color: #065F46; }
.gna-public-alert-info { background: #EFF6FF; border: 1px solid #BFDBFE; color: #1E3A8A; }
.gna-public-form label { display: block; font-weight: 700; color: #334155; }
.gna-public-form label span { display: block; margin-bottom: 5px; }
.gna-public-form input,
.gna-public-form select,
.gna-public-form textarea {
  background: #fff;
  border: 1px solid #CBD5E1;
  border-radius: 10px;
  box-sizing: border-box;
  color: #111827;
  font: inherit;
  padding: 10px 12px;
  width: 100%;
}
.gna-public-form textarea { resize: vertical; }
.gna-public-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}
.gna-public-full { margin: 14px 0; }
.gna-public-help { color: #64748b; margin-top: -6px; }
.gna-public-family-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr .8fr 1.2fr 1.2fr;
  gap: 8px;
}
.gna-public-family-head {
  background: #F3F4F6;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  color: #4B1764;
  font-size: 12px;
  font-weight: 900;
  padding: 8px;
}
.gna-public-check { align-items: flex-start; display: flex !important; gap: 9px; }
.gna-public-check input { flex: 0 0 auto; margin-top: 4px; width: auto; }
.gna-public-actions { margin-top: 18px; text-align: right; }
.gna-public-actions .gna-btn,
.gna-public-form .gna-btn {
  background: #8335A3 !important;
  border: 1px solid #8335A3 !important;
  border-radius: 10px !important;
  color: #fff !important;
  cursor: pointer !important;
  font-weight: 800 !important;
  padding: 12px 18px !important;
}
@media (max-width: 820px) {
  .gna-public-grid { grid-template-columns: 1fr; }
  .gna-public-family-grid { grid-template-columns: 1fr; }
  .gna-public-family-head { display: none; }
}

/* FASE 22 - Canvas profesional y guías de impresión multipágina */
.gna-pedigree-app .gna-pedigree-page-guides {
  pointer-events: none !important;
  opacity: .78;
}
.gna-pedigree-app .gna-page-guide-sheet {
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 3px 8px rgba(15,23,42,.08));
}
.gna-pedigree-app .gna-page-guide-line {
  vector-effect: non-scaling-stroke;
}
.gna-pedigree-app .gna-page-guide-label {
  pointer-events: none !important;
  user-select: none !important;
}
.gna-pedigree-app .gna-pedigree-svg .gna-pedigree-edges-layer,
.gna-pedigree-app .gna-pedigree-svg .gna-pedigree-page-guides {
  pointer-events: none !important;
}
.gna-pedigree-app .gna-pro-editor-toolbar .gna-btn[data-action="print-poster"],
.gna-pedigree-app .gna-editor-actions .gna-btn[data-action="print-poster"] {
  background: #FFFFFF !important;
  border-color: #8335A3 !important;
  color: #4B1764 !important;
}
.gna-pedigree-app .gna-pro-editor-toolbar .gna-btn[data-action="toggle-page-guides"] {
  background: #EEF2FF !important;
  border-color: #C7D2FE !important;
  color: #3730A3 !important;
}


/* FASE 23 - revisión/importación de cuestionarios familiares */
.gna-pedigree-app .gna-invite-response-meta-actions {
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.gna-pedigree-app .gna-status-badge {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 10px;
  border-radius: 999px;
  background: #f3f4f6;
  color: #374151;
  border: 1px solid #d1d5db;
  font-weight: 800;
  font-size: 12px;
}
.gna-pedigree-app .gna-status-badge.gna-status-ok {
  background: #ecfdf5;
  color: #047857;
  border-color: #a7f3d0;
}

/* FASE 25 - Review response robusto y asociación explícita a pedigree */
.gna-pedigree-app .gna-invite-associate-inline {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  max-width: 100%;
}
.gna-pedigree-app .gna-invite-case-select {
  background: #fff !important;
  border: 1px solid #8335A3 !important;
  border-radius: 10px !important;
  color: #111827 !important;
  min-height: 36px !important;
  min-width: 220px;
  opacity: 1 !important;
  padding: 7px 10px !important;
}
.gna-pedigree-app .gna-invite-response-meta-actions {
  align-items: center;
}

/* FASE 26 - Exportación Excel organizada / Progeny + Cyrillic */
.gna-pedigree-app .gna-transfer-card-featured {
	border-color: rgba(131, 53, 163, 0.35) !important;
	box-shadow: 0 14px 32px rgba(131, 53, 163, 0.12) !important;
}
.gna-pedigree-app .gna-transfer-card-featured h4 {
	color: #4B1764 !important;
}

/* FASE 27 - Genetics / Cyrillic workspace */
.gna-pedigree-app .gna-genetic-grid{
	display:grid;
	grid-template-columns:repeat(2,minmax(220px,1fr));
	gap:14px;
}
.gna-pedigree-app .gna-genetic-grid .gna-field-wide{
	grid-column:1 / -1;
}
.gna-pedigree-app .gna-cyrillic-intro{
	border-left:4px solid #8335A3;
}
.gna-pedigree-app .gna-genetic-quality-grid{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
}
.gna-pedigree-app .gna-quality-pill{
	display:inline-flex;
	align-items:center;
	border:1px solid #E5E7EB;
	background:#FFFFFF;
	color:#111827;
	border-radius:999px;
	padding:7px 11px;
	font-weight:700;
	font-size:12px;
}
@media (max-width: 760px){
	.gna-pedigree-app .gna-genetic-grid{
		grid-template-columns:1fr;
	}
}


/* FASE 28 - Validacion genetica tipo Cyrillic */
.gna-pedigree-app .gna-genetic-validation-report {
  margin-top: 14px;
  padding: 14px;
  border: 1px solid #d8c8e6;
  border-radius: 14px;
  background: #fbf8ff;
}
.gna-pedigree-app .gna-genetic-validation-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
}
.gna-pedigree-app .gna-genetic-validation-summary span,
.gna-pedigree-app .gna-genetic-validation-summary strong {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 6px 10px;
  border-radius: 999px;
  background: #ffffff;
  color: #4B1764;
  border: 1px solid #e5d7ef;
  font-weight: 700;
}

/* FASE 29 - Marca GENEALOGY + Risk/Clinical Insights */
.gna-pedigree-app .gna-pro-brand {
	min-width: 220px;
}
.gna-pedigree-app .gna-pro-brand-logo {
	background: #ffffff;
	border: 1px solid rgba(255,255,255,.35);
	border-radius: 8px;
	height: 34px;
	max-width: 96px;
	object-fit: contain;
	padding: 3px 6px;
	width: auto;
}
.gna-pedigree-app .gna-pro-brand strong {
	font-size: 18px !important;
	letter-spacing: .2px !important;
	text-transform: none !important;
	white-space: nowrap;
}
.gna-pedigree-app .gna-risk-grid {
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(4, minmax(150px, 1fr));
	margin-bottom: 16px;
}
.gna-pedigree-app .gna-risk-card {
	background: #fff;
	border: 1px solid #e5d7ef;
	border-radius: 14px;
	box-shadow: 0 10px 24px rgba(31,41,55,.06);
	padding: 14px;
}
.gna-pedigree-app .gna-risk-card span {
	color: #6b7280;
	display: block;
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
}
.gna-pedigree-app .gna-risk-card strong {
	color: #4B1764;
	display: block;
	font-size: 28px;
	line-height: 1.1;
	margin-top: 6px;
}
.gna-pedigree-app .gna-risk-score {
	align-items: center;
	background: linear-gradient(135deg,#4B1764,#8335A3);
	border-radius: 16px;
	color: #fff;
	display: flex;
	gap: 16px;
	justify-content: space-between;
	margin-bottom: 16px;
	padding: 18px;
}
.gna-pedigree-app .gna-risk-score strong {
	font-size: 34px;
}
.gna-pedigree-app .gna-risk-score p {
	color: rgba(255,255,255,.86);
	margin: 4px 0 0;
}
.gna-pedigree-app .gna-risk-findings {
	display: grid;
	gap: 12px;
}
.gna-pedigree-app .gna-risk-finding {
	align-items: flex-start;
	background: #fff;
	border: 1px solid #E5E7EB;
	border-left: 5px solid #8335A3;
	border-radius: 12px;
	display: grid;
	gap: 10px;
	grid-template-columns: minmax(0,1fr) auto;
	padding: 13px;
}
.gna-pedigree-app .gna-risk-finding.is-high { border-left-color: #DC2626; background: #fff7f7; }
.gna-pedigree-app .gna-risk-finding.is-medium { border-left-color: #D97706; background: #fffbeb; }
.gna-pedigree-app .gna-risk-finding.is-low { border-left-color: #10B981; background: #f0fdf4; }
.gna-pedigree-app .gna-risk-finding h4 {
	color: #111827;
	font-size: 14px;
	margin: 0 0 4px;
}
.gna-pedigree-app .gna-risk-finding p {
	color: #374151;
	line-height: 1.45;
	margin: 0;
}
.gna-pedigree-app .gna-risk-pill {
	border-radius: 999px;
	font-size: 12px;
	font-weight: 800;
	padding: 6px 10px;
	white-space: nowrap;
}
.gna-pedigree-app .gna-risk-pill.is-high { background:#fee2e2; color:#991b1b; }
.gna-pedigree-app .gna-risk-pill.is-medium { background:#fef3c7; color:#92400e; }
.gna-pedigree-app .gna-risk-pill.is-low { background:#dcfce7; color:#166534; }
.gna-pedigree-app .gna-risk-empty {
	background:#fff;
	border:1px dashed #d8c8e6;
	border-radius:14px;
	color:#4b5563;
	padding:18px;
}
@media (max-width: 900px) {
	.gna-pedigree-app .gna-risk-grid { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
	.gna-pedigree-app .gna-pro-brand { min-width: auto; }
}
@media (max-width: 620px) {
	.gna-pedigree-app .gna-risk-grid { grid-template-columns: 1fr; }
	.gna-pedigree-app .gna-risk-score { align-items:flex-start; flex-direction:column; }
	.gna-pedigree-app .gna-risk-finding { grid-template-columns: 1fr; }
	.gna-pedigree-app .gna-pro-brand-logo { height: 30px; max-width: 78px; }
	.gna-pedigree-app .gna-pro-brand strong { font-size: 15px !important; }
}
.gna-public-logo {
	background:#fff;
	border:1px solid #eadff2;
	border-radius:12px;
	height:54px;
	object-fit:contain;
	padding:6px 10px;
	width:auto;
	max-width:150px;
}

/* FASE 30 - Logo GNA visible + Versiones/Snapshots */
.gna-pedigree-app .gna-pro-brand {
	align-items: center !important;
	gap: 12px !important;
}
.gna-pedigree-app .gna-pro-brand-logo {
	background: linear-gradient(135deg, #4B1764, #8335A3) !important;
	border: 1px solid rgba(255,255,255,.28) !important;
	border-radius: 12px !important;
	box-shadow: 0 6px 18px rgba(0,0,0,.22) !important;
	height: 38px !important;
	max-width: 142px !important;
	object-fit: contain !important;
	padding: 7px 10px !important;
	width: auto !important;
}
.gna-public-logo {
	background: linear-gradient(135deg, #4B1764, #8335A3) !important;
	border: 1px solid rgba(131,53,163,.35) !important;
	border-radius: 14px !important;
	box-shadow: 0 8px 20px rgba(75,23,100,.18) !important;
	height: 58px !important;
	max-width: 190px !important;
	object-fit: contain !important;
	padding: 8px 12px !important;
	width: auto !important;
}
.gna-pedigree-app .gna-snapshot-panel .gna-pro-help {
	background: #f8f5fb;
	border: 1px solid #eadff2;
	border-radius: 12px;
	color: #4B1764;
	font-weight: 700;
	margin-bottom: 14px;
	padding: 12px 14px;
}
.gna-pedigree-app .gna-snapshot-actions {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: flex-end;
}
@media (max-width: 620px) {
	.gna-pedigree-app .gna-pro-brand-logo {
		height: 34px !important;
		max-width: 118px !important;
		padding: 6px 8px !important;
	}
	.gna-public-logo {
		height: 52px !important;
		max-width: 160px !important;
	}
}


/* FASE 31 - Logo GNA transparente y versiones corregidas */
.gna-pedigree-app .gna-pro-topbar {
	min-height: 60px !important;
}
.gna-pedigree-app .gna-pro-brand {
	align-items: center !important;
	gap: 12px !important;
	min-width: 260px !important;
}
.gna-pedigree-app .gna-pro-brand-logo {
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	display: block !important;
	filter: none !important;
	height: 48px !important;
	max-height: 48px !important;
	max-width: 170px !important;
	object-fit: contain !important;
	padding: 0 !important;
	width: auto !important;
}
.gna-pedigree-app .gna-pro-brand strong {
	font-size: 19px !important;
	line-height: 1.1 !important;
}
.gna-public-header {
	background: #2d3d44 !important;
	border-bottom: 0 !important;
	border-radius: 16px !important;
	padding: 16px 18px !important;
}
.gna-public-header h1,
.gna-public-header p {
	color: #ffffff !important;
}
.gna-public-logo {
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	display: block !important;
	filter: none !important;
	height: 64px !important;
	max-height: 64px !important;
	max-width: 210px !important;
	object-fit: contain !important;
	padding: 0 !important;
	width: auto !important;
}
@media (max-width: 760px) {
	.gna-pedigree-app .gna-pro-topbar {
		min-height: 56px !important;
	}
	.gna-pedigree-app .gna-pro-brand {
		min-width: 190px !important;
	}
	.gna-pedigree-app .gna-pro-brand-logo {
		height: 42px !important;
		max-height: 42px !important;
		max-width: 145px !important;
	}
	.gna-public-logo {
		height: 54px !important;
		max-height: 54px !important;
		max-width: 180px !important;
	}
}

/* FASE 32 - Limpieza visual senior: toolbar compacta, acciones agrupadas y contraste definitivo */
.gna-pedigree-app .gna-pro-editor-toolbar-compact {
  align-items: center !important;
  background: #f6f8fa !important;
  border-bottom: 1px solid #cfd8df !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  overflow-x: visible !important;
  padding: 6px 8px !important;
}
.gna-pedigree-app .gna-toolbar-group {
  align-items: center !important;
  border-right: 1px solid #d8e0e6 !important;
  display: inline-flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
  padding-right: 7px !important;
}
.gna-pedigree-app .gna-toolbar-group:last-child {
  border-right: 0 !important;
}
.gna-pedigree-app .gna-toolbar-group-right {
  margin-left: auto !important;
}
.gna-pedigree-app .gna-pro-editor-toolbar-compact .gna-btn,
.gna-pedigree-app .gna-stage-tools .gna-btn,
.gna-pedigree-app .gna-stage-tools .gna-pedigree-btn,
.gna-pedigree-app .gna-stage-tools .gna-icon-btn {
  border-radius: 4px !important;
  box-shadow: none !important;
  font-size: 12px !important;
  min-height: 30px !important;
  padding: 6px 9px !important;
}
.gna-pedigree-app .gna-pro-editor-toolbar-compact .gna-btn-primary {
  background: #8335A3 !important;
  border-color: #8335A3 !important;
  color: #fff !important;
}
.gna-pedigree-app .gna-pro-editor-toolbar-compact .gna-btn-secondary {
  background: #fff !important;
  border-color: #8b5aa1 !important;
  color: #4B1764 !important;
}
.gna-pedigree-app .gna-pro-editor-toolbar-compact .gna-btn-neutral {
  background: #eef2f6 !important;
  border-color: #cbd5e1 !important;
  color: #111827 !important;
}
.gna-pedigree-app .gna-editor-actions-menu[hidden] {
  display: none !important;
}
.gna-pedigree-app .gna-editor-actions-menu {
  background: #ffffff !important;
  border-bottom: 1px solid #cfd8df !important;
  box-shadow: 0 10px 22px rgba(15, 23, 42, .12) !important;
  padding: 10px 12px !important;
  position: relative !important;
  z-index: 12 !important;
}
.gna-pedigree-app .gna-editor-actions-menu-grid {
  display: grid !important;
  gap: 7px !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  max-width: 1120px !important;
}
.gna-pedigree-app .gna-editor-actions-menu .gna-btn {
  justify-content: flex-start !important;
  min-height: 32px !important;
  padding: 7px 10px !important;
}
.gna-pedigree-app .gna-pro-secondary-actions {
  display: none !important;
}
.gna-pedigree-app .gna-stage-tools {
  align-items: center !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  justify-content: flex-end !important;
}
.gna-pedigree-app .gna-canvas-tool-controls,
.gna-pedigree-app .gna-zoom-controls {
  align-items: center !important;
  display: inline-flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
}
.gna-pedigree-app .gna-canvas-tool.is-active,
.gna-pedigree-app .gna-pedigree-btn.is-active,
.gna-pedigree-app .gna-btn.is-active {
  background: #8335A3 !important;
  border-color: #8335A3 !important;
  color: #ffffff !important;
}
.gna-pedigree-app .gna-btn,
.gna-pedigree-app .gna-pedigree-btn,
.gna-pedigree-app .gna-icon-btn,
.gna-pedigree-app .gna-tab,
.gna-pedigree-app .gna-pro-worktab-main,
.gna-pedigree-app .gna-pro-worktab-close {
  opacity: 1 !important;
  filter: none !important;
  text-shadow: none !important;
  visibility: visible !important;
}
.gna-pedigree-app .gna-btn:not(.gna-btn-primary):not(.gna-btn-danger):not(.gna-btn-success),
.gna-pedigree-app .gna-pedigree-btn:not(.gna-pedigree-btn-primary):not(.gna-pedigree-btn-danger):not(.gna-pedigree-btn-success) {
  color: #111827 !important;
}
.gna-pedigree-app .gna-btn-primary,
.gna-pedigree-app .gna-pedigree-btn-primary,
.gna-pedigree-app .gna-btn-danger,
.gna-pedigree-app .gna-pedigree-btn-danger,
.gna-pedigree-app .gna-btn-success,
.gna-pedigree-app .gna-pedigree-btn-success {
  color: #ffffff !important;
}
.gna-pedigree-app .gna-pro-module-header > div {
  align-items: center !important;
  display: inline-flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}
.gna-pedigree-app .gna-pro-module-header .gna-btn {
  min-height: 32px !important;
  padding: 7px 11px !important;
}
@media (max-width: 920px) {
  .gna-pedigree-app .gna-toolbar-group-right {
    margin-left: 0 !important;
  }
  .gna-pedigree-app .gna-editor-actions-menu-grid {
    grid-template-columns: 1fr 1fr !important;
  }
}
@media (max-width: 560px) {
  .gna-pedigree-app .gna-editor-actions-menu-grid {
    grid-template-columns: 1fr !important;
  }
  .gna-pedigree-app .gna-pro-editor-toolbar-compact .gna-btn,
  .gna-pedigree-app .gna-stage-tools .gna-btn,
  .gna-pedigree-app .gna-stage-tools .gna-pedigree-btn {
    flex: 1 1 auto !important;
  }
}

/* FASE 33 - Corrección de marca y navegación superior sin tocar canvas */
.gna-pedigree-app .gna-pro-brand strong {
  color: #ffffff !important;
  font-size: 20px !important;
  font-weight: 900 !important;
  letter-spacing: 1.4px !important;
  text-transform: uppercase !important;
}
.gna-pedigree-app .gna-pro-brand-logo {
  height: 48px !important;
  width: auto !important;
  max-width: 190px !important;
  object-fit: contain !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  filter: none !important;
}
.gna-pedigree-app .gna-pro-mainnav button,
.gna-pedigree-app .gna-pro-mainnav button.gna-btn,
.gna-pedigree-app .gna-pro-mainnav button.gna-pedigree-btn {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
  min-height: 48px !important;
  padding: 0 16px !important;
}
.gna-pedigree-app .gna-pro-mainnav button.is-active,
.gna-pedigree-app .gna-pro-mainnav button:hover,
.gna-pedigree-app .gna-pro-mainnav button:focus-visible {
  background: #3f535c !important;
  color: #ffffff !important;
  outline: 2px solid rgba(255,255,255,.28) !important;
  outline-offset: -2px !important;
}
.gna-pedigree-app .gna-pro-mainnav button.is-active {
  background: #8335A3 !important;
}
.gna-pedigree-app .gna-pro-topbar {
  background: #2d3d44 !important;
}

/* FASE 34 - Identidad GENEALOGY y navegación superior clínica premium */
.gna-pedigree-app.gna-progeny-shell {
  --gna-pro-topbar: #172A32 !important;
  --gna-pro-topbar-dark: #102128 !important;
  --gna-nav-accent: #38BDF8 !important;
  --gna-nav-accent-2: #A78BFA !important;
}
.gna-pedigree-app .gna-pro-topbar {
  background: linear-gradient(90deg, #14262e 0%, #203942 48%, #14262e 100%) !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: 0 8px 24px rgba(15,23,42,.20) !important;
  color: #ffffff !important;
}
.gna-pedigree-app .gna-pro-brand {
  min-width: 268px !important;
  gap: 14px !important;
}
.gna-pedigree-app .gna-pro-brand-logo {
  height: 50px !important;
  max-height: 50px !important;
  max-width: 178px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.20)) !important;
}
.gna-pedigree-app .gna-pro-brand strong {
  color: #ffffff !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  letter-spacing: 1.8px !important;
  line-height: 1 !important;
  text-shadow: 0 1px 8px rgba(56,189,248,.20) !important;
  text-transform: uppercase !important;
}
.gna-pedigree-app .gna-pro-mainnav {
  gap: 3px !important;
  scrollbar-width: thin !important;
}
.gna-pedigree-app .gna-pro-mainnav button,
.gna-pedigree-app .gna-pro-mainnav button.gna-btn,
.gna-pedigree-app .gna-pro-mainnav button.gna-pedigree-btn {
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  color: rgba(255,255,255,.88) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .35px !important;
  min-height: 38px !important;
  padding: 0 13px !important;
  position: relative !important;
  text-transform: uppercase !important;
}
.gna-pedigree-app .gna-pro-mainnav button::after,
.gna-pedigree-app .gna-pro-mainnav button.gna-btn::after,
.gna-pedigree-app .gna-pro-mainnav button.gna-pedigree-btn::after {
  background: linear-gradient(90deg, var(--gna-nav-accent), var(--gna-nav-accent-2)) !important;
  border-radius: 999px !important;
  bottom: 4px !important;
  content: "" !important;
  height: 3px !important;
  left: 18px !important;
  opacity: 0 !important;
  position: absolute !important;
  right: 18px !important;
  transform: scaleX(.35) !important;
  transition: opacity .16s ease, transform .16s ease !important;
}
.gna-pedigree-app .gna-pro-mainnav button:hover,
.gna-pedigree-app .gna-pro-mainnav button:focus-visible,
.gna-pedigree-app .gna-pro-mainnav button.is-active,
.gna-pedigree-app .gna-pro-mainnav button.gna-btn:hover,
.gna-pedigree-app .gna-pro-mainnav button.gna-btn:focus-visible,
.gna-pedigree-app .gna-pro-mainnav button.gna-btn.is-active,
.gna-pedigree-app .gna-pro-mainnav button.gna-pedigree-btn:hover,
.gna-pedigree-app .gna-pro-mainnav button.gna-pedigree-btn:focus-visible,
.gna-pedigree-app .gna-pro-mainnav button.gna-pedigree-btn.is-active {
  background: rgba(255,255,255,.095) !important;
  border-color: rgba(255,255,255,.16) !important;
  color: #ffffff !important;
  outline: none !important;
}
.gna-pedigree-app .gna-pro-mainnav button:hover::after,
.gna-pedigree-app .gna-pro-mainnav button:focus-visible::after,
.gna-pedigree-app .gna-pro-mainnav button.is-active::after,
.gna-pedigree-app .gna-pro-mainnav button.gna-btn:hover::after,
.gna-pedigree-app .gna-pro-mainnav button.gna-btn:focus-visible::after,
.gna-pedigree-app .gna-pro-mainnav button.gna-btn.is-active::after,
.gna-pedigree-app .gna-pro-mainnav button.gna-pedigree-btn:hover::after,
.gna-pedigree-app .gna-pro-mainnav button.gna-pedigree-btn:focus-visible::after,
.gna-pedigree-app .gna-pro-mainnav button.gna-pedigree-btn.is-active::after {
  opacity: 1 !important;
  transform: scaleX(1) !important;
}
.gna-pedigree-app .gna-pro-user-tools span {
  color: rgba(255,255,255,.92) !important;
}
.gna-pedigree-app .gna-pro-avatar {
  background: rgba(255,255,255,.92) !important;
  box-shadow: 0 0 0 3px rgba(255,255,255,.18) !important;
}
.gna-pedigree-app .gna-pro-worktabs {
  background: linear-gradient(180deg, #f3f6f8 0%, #e7edf1 100%) !important;
  border-bottom: 1px solid #cbd5dd !important;
  gap: 4px !important;
}
.gna-pedigree-app .gna-pro-worktab {
  background: transparent !important;
  border: 0 !important;
  border-top: 0 !important;
  box-shadow: none !important;
  margin-right: 0 !important;
}
.gna-pedigree-app .gna-pro-worktab-main,
.gna-pedigree-app .gna-pro-worktab-close {
  color: #24343c !important;
}
.gna-pedigree-app .gna-pro-worktab-main {
  background: rgba(255,255,255,.72) !important;
  border: 1px solid #d7e0e6 !important;
  border-radius: 12px 0 0 12px !important;
  box-shadow: 0 2px 8px rgba(15,23,42,.06) !important;
  min-height: 34px !important;
}
.gna-pedigree-app .gna-pro-worktab-close {
  background: rgba(255,255,255,.72) !important;
  border: 1px solid #d7e0e6 !important;
  border-left: 0 !important;
  border-radius: 0 12px 12px 0 !important;
  min-height: 34px !important;
}
.gna-pedigree-app .gna-pro-worktab.is-active .gna-pro-worktab-main,
.gna-pedigree-app .gna-pro-worktab.is-active .gna-pro-worktab-close {
  background: #ffffff !important;
  border-color: #9fd7f3 !important;
  color: #0f2a38 !important;
}
.gna-pedigree-app .gna-pro-worktab.is-active .gna-pro-worktab-main {
  box-shadow: inset 0 3px 0 #38BDF8, 0 4px 12px rgba(14,165,233,.14) !important;
}
.gna-pedigree-app .gna-tabs {
  background: #f4f7fa !important;
  border: 1px solid #dbe4ea !important;
  border-radius: 14px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.70), 0 2px 10px rgba(15,23,42,.05) !important;
}
.gna-pedigree-app .gna-tab,
.gna-pedigree-app .gna-pro-editor .gna-tab {
  background: #ffffff !important;
  border: 1px solid #dbe4ea !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  color: #273844 !important;
}
.gna-pedigree-app .gna-tab:hover,
.gna-pedigree-app .gna-pro-editor .gna-tab:hover {
  background: #eef8ff !important;
  border-color: #93c5fd !important;
  color: #0f3e58 !important;
}
.gna-pedigree-app .gna-tab.is-active,
.gna-pedigree-app .gna-pro-editor .gna-tab.is-active {
  background: linear-gradient(180deg, #ffffff 0%, #eef8ff 100%) !important;
  border-color: #38BDF8 !important;
  box-shadow: inset 0 -3px 0 #38BDF8, 0 4px 12px rgba(14,165,233,.12) !important;
  color: #0f2a38 !important;
}
.gna-pedigree-app .gna-pedigree-btn.is-active,
.gna-pedigree-app .gna-btn.is-active {
  background: linear-gradient(180deg, #ffffff 0%, #edf8ff 100%) !important;
  border-color: #38BDF8 !important;
  color: #0f2a38 !important;
}
@media (max-width: 980px) {
  .gna-pedigree-app .gna-pro-brand { min-width: 215px !important; }
  .gna-pedigree-app .gna-pro-brand strong { font-size: 18px !important; letter-spacing: 1.1px !important; }
  .gna-pedigree-app .gna-pro-mainnav button { padding: 0 10px !important; }
}

/* FASE 35 - Corrección definitiva de navegación superior y fase segura */
.gna-pedigree-app .gna-pro-topbar .gna-pro-mainnav > button,
.gna-pedigree-app .gna-pro-topbar .gna-pro-mainnav > button.gna-pro-nav-btn,
.gna-pedigree-app .gna-pro-topbar .gna-pro-mainnav > button.gna-btn,
.gna-pedigree-app .gna-pro-topbar .gna-pro-mainnav > button.gna-pedigree-btn {
  -webkit-text-fill-color: #F8FAFC !important;
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 999px !important;
  color: #F8FAFC !important;
  font-weight: 850 !important;
  letter-spacing: .34px !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.32) !important;
}
.gna-pedigree-app .gna-pro-topbar .gna-pro-mainnav > button *,
.gna-pedigree-app .gna-pro-topbar .gna-pro-mainnav > button.gna-pro-nav-btn * {
  -webkit-text-fill-color: #F8FAFC !important;
  color: #F8FAFC !important;
}
.gna-pedigree-app .gna-pro-topbar .gna-pro-mainnav > button:hover,
.gna-pedigree-app .gna-pro-topbar .gna-pro-mainnav > button:focus-visible,
.gna-pedigree-app .gna-pro-topbar .gna-pro-mainnav > button.is-active {
  -webkit-text-fill-color: #FFFFFF !important;
  background: linear-gradient(180deg, rgba(56,189,248,.24), rgba(167,139,250,.16)) !important;
  border-color: rgba(125,211,252,.55) !important;
  box-shadow: inset 0 -2px 0 #38BDF8, 0 6px 18px rgba(14,165,233,.16) !important;
  color: #FFFFFF !important;
}
.gna-pedigree-app .gna-pro-user-tools span,
.gna-pedigree-app .gna-pro-user-tools button {
  -webkit-text-fill-color: #FFFFFF !important;
  color: #FFFFFF !important;
}

/* FASE 36 - Accesos y colaboración */
.gna-pedigree-app .gna-permission-form {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(180px, 260px) auto;
  gap: 12px;
  align-items: end;
  margin: 14px 0 16px;
  padding: 14px;
  border: 1px solid #dbe4ef;
  border-radius: 14px;
  background: #f8fbff;
}
.gna-pedigree-app .gna-permissions-panel .gna-table-wrap {
  margin-top: 12px;
}
@media (max-width: 800px) {
  .gna-pedigree-app .gna-permission-form {
    grid-template-columns: 1fr;
  }
}

/* FASE 38 - Login frontal premium GENEALOGY */
.gna-genealogy-login-shell {
	align-items: stretch !important;
	background:
		radial-gradient(circle at 12% 16%, rgba(56, 189, 248, .30), transparent 30%),
		radial-gradient(circle at 86% 18%, rgba(131, 53, 163, .24), transparent 28%),
		linear-gradient(135deg, #0f2530 0%, #142f3a 42%, #f6f8fc 42.2%, #eef3fb 100%) !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	display: flex !important;
	justify-content: center !important;
	margin: 0 calc(50% - 50vw) !important;
	min-height: 100vh !important;
	overflow: hidden !important;
	padding: clamp(28px, 5vw, 68px) 18px !important;
	position: relative !important;
	width: 100vw !important;
}

.gna-genealogy-login-shell::before {
	background:
		linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px),
		linear-gradient(0deg, rgba(255,255,255,.06) 1px, transparent 1px);
	background-size: 46px 46px;
	content: "";
	inset: 0;
	opacity: .20;
	pointer-events: none;
	position: absolute;
}

.gna-genealogy-login-shell::after {
	background: linear-gradient(135deg, rgba(255,255,255,.36), rgba(255,255,255,.04));
	border-radius: 999px;
	content: "";
	height: 420px;
	left: -180px;
	position: absolute;
	top: -120px;
	width: 420px;
}

.gna-genealogy-login-card {
	background: rgba(255, 255, 255, .96) !important;
	border: 1px solid rgba(226, 232, 240, .92) !important;
	border-radius: 28px !important;
	box-shadow: 0 34px 90px rgba(15, 23, 42, .26) !important;
	display: grid !important;
	grid-template-columns: minmax(250px, .95fr) minmax(320px, 1.05fr) !important;
	isolation: isolate !important;
	max-width: 980px !important;
	min-height: 520px !important;
	overflow: hidden !important;
	padding: 0 !important;
	position: relative !important;
	width: min(980px, 96vw) !important;
	z-index: 1 !important;
}

.gna-genealogy-login-brand {
	align-items: center !important;
	background:
		radial-gradient(circle at 24% 20%, rgba(255,255,255,.22), transparent 30%),
		linear-gradient(155deg, #132f3a 0%, #203b46 52%, #8335a3 140%) !important;
	border-right: 1px solid rgba(255,255,255,.10) !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 22px !important;
	grid-column: 1 !important;
	grid-row: 1 / span 4 !important;
	justify-content: center !important;
	margin: 0 !important;
	min-height: 520px !important;
	padding: 42px 34px !important;
	position: relative !important;
	text-align: center !important;
}

.gna-genealogy-login-brand::after {
	background: linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,0));
	border: 1px solid rgba(255,255,255,.14);
	border-radius: 24px;
	content: "";
	inset: 24px;
	pointer-events: none;
	position: absolute;
}

.gna-genealogy-login-logo {
	display: block !important;
	filter: drop-shadow(0 12px 28px rgba(0,0,0,.28)) !important;
	height: auto !important;
	max-height: 98px !important;
	max-width: 250px !important;
	object-fit: contain !important;
	position: relative !important;
	width: min(250px, 80%) !important;
	z-index: 1 !important;
}

.gna-genealogy-login-title {
	color: #ffffff !important;
	font-size: clamp(28px, 3.6vw, 42px) !important;
	font-weight: 950 !important;
	letter-spacing: .11em !important;
	line-height: 1.08 !important;
	position: relative !important;
	text-shadow: 0 10px 26px rgba(0,0,0,.30) !important;
	z-index: 1 !important;
}

.gna-genealogy-login-title::after {
	background: linear-gradient(90deg, transparent, rgba(56, 189, 248, .90), transparent);
	border-radius: 999px;
	content: "";
	display: block;
	height: 3px;
	margin: 16px auto 0;
	width: 82px;
}

.gna-genealogy-login-subtitle {
	align-self: end !important;
	color: #64748b !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	grid-column: 2 !important;
	line-height: 1.55 !important;
	margin: 0 !important;
	padding: 72px 48px 0 !important;
	text-align: left !important;
}

.gna-genealogy-login-alert {
	align-self: start !important;
	background: #fef2f2 !important;
	border: 1px solid #fecaca !important;
	border-radius: 14px !important;
	color: #991b1b !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	grid-column: 2 !important;
	margin: 18px 48px 0 !important;
	padding: 12px 14px !important;
}

.gna-genealogy-login-form {
	align-self: start !important;
	display: grid !important;
	gap: 17px !important;
	grid-column: 2 !important;
	padding: 28px 48px 56px !important;
}

.gna-genealogy-login-form label {
	display: grid !important;
	gap: 8px !important;
}

.gna-genealogy-login-form label > span {
	color: #243642 !important;
	font-size: 13px !important;
	font-weight: 850 !important;
	letter-spacing: .02em !important;
}

.gna-genealogy-login-form input[type="text"],
.gna-genealogy-login-form input[type="password"] {
	background: #ffffff !important;
	border: 1px solid #cbd5e1 !important;
	border-radius: 14px !important;
	box-shadow: 0 10px 24px rgba(15, 23, 42, .05), inset 0 1px 2px rgba(15, 23, 42, .04) !important;
	color: #0f172a !important;
	font-size: 15px !important;
	min-height: 50px !important;
	opacity: 1 !important;
	padding: 12px 14px !important;
	width: 100% !important;
}

.gna-genealogy-login-form input[type="text"]:focus,
.gna-genealogy-login-form input[type="password"]:focus {
	border-color: #38bdf8 !important;
	box-shadow: 0 0 0 4px rgba(56, 189, 248, .18), 0 12px 28px rgba(15, 23, 42, .08) !important;
	outline: none !important;
}

.gna-genealogy-login-remember {
	align-items: center !important;
	color: #334155 !important;
	display: flex !important;
	font-size: 13px !important;
	font-weight: 750 !important;
	gap: 9px !important;
	justify-content: flex-start !important;
}

.gna-genealogy-login-remember input {
	accent-color: #8335a3 !important;
	height: 16px !important;
	width: 16px !important;
}

.gna-genealogy-login-submit {
	font-size: 15px !important;
	letter-spacing: .02em !important;
	min-height: 50px !important;
	width: 100% !important;
}

.gna-genealogy-login-form .gna-genealogy-login-submit,
.gna-genealogy-login-form button.gna-genealogy-login-submit {
	background: linear-gradient(135deg, #8335a3 0%, #5b2380 100%) !important;
	border: 1px solid rgba(131, 53, 163, .92) !important;
	box-shadow: 0 14px 30px rgba(131, 53, 163, .26) !important;
	color: #ffffff !important;
	-webkit-text-fill-color: #ffffff !important;
}

.gna-genealogy-login-form .gna-genealogy-login-submit:hover,
.gna-genealogy-login-form button.gna-genealogy-login-submit:hover {
	background: linear-gradient(135deg, #38bdf8 0%, #8335a3 100%) !important;
	border-color: #38bdf8 !important;
	color: #ffffff !important;
	-webkit-text-fill-color: #ffffff !important;
	transform: translateY(-1px) !important;
}

@media (max-width: 800px) {
	.gna-genealogy-login-shell {
		background: linear-gradient(160deg, #132f3a 0%, #203b46 32%, #f6f8fc 32.2%, #eef3fb 100%) !important;
		padding: 22px 12px !important;
	}

	.gna-genealogy-login-card {
		grid-template-columns: 1fr !important;
		min-height: auto !important;
		width: min(520px, 96vw) !important;
	}

	.gna-genealogy-login-brand {
		grid-column: 1 !important;
		grid-row: auto !important;
		min-height: 230px !important;
		padding: 32px 22px !important;
	}

	.gna-genealogy-login-brand::after {
		inset: 16px !important;
	}

	.gna-genealogy-login-logo {
		max-height: 82px !important;
		max-width: 220px !important;
	}

	.gna-genealogy-login-title {
		font-size: 28px !important;
	}

	.gna-genealogy-login-subtitle,
	.gna-genealogy-login-alert,
	.gna-genealogy-login-form {
		grid-column: 1 !important;
	}

	.gna-genealogy-login-subtitle {
		padding: 28px 24px 0 !important;
		text-align: center !important;
	}

	.gna-genealogy-login-alert {
		margin: 18px 24px 0 !important;
	}

	.gna-genealogy-login-form {
		padding: 24px 24px 32px !important;
	}
}

/* FASE 39 - Documentos clínicos */
.gna-pedigree-app .gna-documents-panel .gna-document-form {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(160px, 1fr)) !important;
  gap: 14px !important;
  align-items: end !important;
  margin: 12px 0 14px !important;
}
.gna-pedigree-app .gna-documents-panel .gna-document-form .gna-field-wide {
  grid-column: 1 / -1 !important;
}
.gna-pedigree-app .gna-documents-global-help {
  margin-bottom: 12px !important;
}
@media (max-width: 900px) {
  .gna-pedigree-app .gna-documents-panel .gna-document-form {
    grid-template-columns: 1fr !important;
  }
}

/* FASE 41 - Canvas clínico amplio inspirado en flujos de Progeny 11.6, sin copiar marca ni UI exacta */
.gna-pedigree-app .gna-pro-editor {
  background: #f4f6f8 !important;
}
.gna-pedigree-app .gna-pro-editor .gna-case-summary {
  display: none !important;
}
.gna-pedigree-app .gna-pro-editor .gna-tabs {
  background: #e9edf1 !important;
  border-bottom: 1px solid #c8d0d7 !important;
  border-top: 0 !important;
  min-height: 32px !important;
  overflow-x: auto !important;
  padding: 4px 8px 0 !important;
  white-space: nowrap !important;
}
.gna-pedigree-app .gna-pro-editor .gna-tab {
  background: #f8fafc !important;
  border: 1px solid #cbd5dd !important;
  border-bottom: 0 !important;
  color: #27343b !important;
  font-size: 11px !important;
  min-height: 26px !important;
  padding: 5px 10px !important;
}
.gna-pedigree-app .gna-pro-editor .gna-tab.is-active {
  background: #ffffff !important;
  color: #0f172a !important;
}
.gna-pedigree-app .gna-pro-editor .gna-editor-layout {
  grid-template-columns: minmax(0, 1fr) 330px !important;
  min-height: calc(100vh - 210px) !important;
}
.gna-pedigree-app .gna-pro-editor.is-canvas-focus .gna-editor-layout,
.gna-pedigree-app .gna-pro-editor:not(.is-inspector-open) .gna-editor-layout {
  grid-template-columns: minmax(0, 1fr) !important;
}
.gna-pedigree-app .gna-pro-editor.is-canvas-focus .gna-side-panel,
.gna-pedigree-app .gna-pro-editor:not(.is-inspector-open) .gna-side-panel {
  display: none !important;
}
.gna-pedigree-app .gna-pro-editor .gna-pedigree-stage {
  background: #ffffff !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  min-height: calc(100vh - 225px) !important;
  overflow: hidden !important;
  position: relative !important;
}
.gna-pedigree-app .gna-pro-editor .gna-stage-header {
  align-items: center !important;
  background: rgba(255,255,255,.94) !important;
  border: 1px solid #d6dde3 !important;
  border-radius: 6px !important;
  box-shadow: 0 4px 14px rgba(15,23,42,.10) !important;
  display: inline-flex !important;
  justify-content: flex-end !important;
  max-width: calc(100% - 28px) !important;
  padding: 5px 7px !important;
  position: absolute !important;
  right: 12px !important;
  top: 10px !important;
  width: auto !important;
  z-index: 8 !important;
}
.gna-pedigree-app .gna-pro-editor .gna-stage-header > div:first-child,
.gna-pedigree-app .gna-pro-editor .gna-stage-header .gna-legend {
  display: none !important;
}
.gna-pedigree-app .gna-pro-editor .gna-stage-tools {
  gap: 5px !important;
}
.gna-pedigree-app .gna-pro-editor .gna-canvas-tool-controls,
.gna-pedigree-app .gna-pro-editor .gna-zoom-controls {
  gap: 4px !important;
}
.gna-pedigree-app .gna-pro-editor .gna-stage-tools .gna-btn,
.gna-pedigree-app .gna-pro-editor .gna-stage-tools .gna-pedigree-btn,
.gna-pedigree-app .gna-pro-editor .gna-stage-tools .gna-icon-btn {
  border-radius: 4px !important;
  font-size: 11px !important;
  min-height: 26px !important;
  padding: 4px 7px !important;
}
.gna-pedigree-app .gna-pro-editor .gna-svg-wrap {
  background: #ffffff !important;
  border: 0 !important;
  height: calc(100vh - 225px) !important;
  min-height: 690px !important;
  overflow: auto !important;
  position: relative !important;
}
.gna-pedigree-app .gna-canvas-title-overlay {
  color: #111827 !important;
  left: 10px !important;
  line-height: 1.05 !important;
  max-width: 360px !important;
  pointer-events: none !important;
  position: absolute !important;
  top: 10px !important;
  z-index: 7 !important;
}
.gna-pedigree-app .gna-canvas-title-overlay strong {
  display: block !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  letter-spacing: .2px !important;
}
.gna-pedigree-app .gna-canvas-title-overlay span {
  color: #111827 !important;
  display: block !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  margin-top: 3px !important;
}
.gna-pedigree-app .gna-pro-editor .gna-svg-wrap::before,
.gna-pedigree-app .gna-pro-editor .gna-svg-wrap::after {
  border-left: 1px dashed #4f46e5 !important;
  opacity: .85 !important;
  z-index: 2 !important;
}
.gna-pedigree-app .gna-pro-editor .gna-pedigree-svg {
  background: #ffffff !important;
  min-height: 690px !important;
}
.gna-pedigree-app .gna-pedigree-svg .gna-page-guide-label {
  display: none !important;
}
.gna-pedigree-app .gna-pedigree-svg .gna-page-guide-sheet {
  fill: #ffffff !important;
  stroke: transparent !important;
}
.gna-pedigree-app .gna-pedigree-svg .gna-page-guide-line {
  stroke: #4f46e5 !important;
  stroke-width: 1.5px !important;
  stroke-dasharray: 4 5 !important;
}
.gna-pedigree-app .gna-pedigree-svg .gna-pedigree-edges-layer line,
.gna-pedigree-app .gna-pedigree-svg .gna-pedigree-edges-layer polyline {
  stroke: #1f2933 !important;
  stroke-width: 1.7px !important;
}
.gna-pedigree-app .gna-pedigree-svg .gna-person-symbol {
  stroke: #202020 !important;
  stroke-width: 1.8px !important;
}
.gna-pedigree-app .gna-pedigree-svg .gna-person-label {
  fill: #111827 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
}
.gna-pedigree-app .gna-pedigree-svg .gna-person-status-label,
.gna-pedigree-app .gna-pedigree-svg .gna-person-condition-label {
  font-size: 10px !important;
}
.gna-pedigree-app .gna-clinical-legend-panel {
  background: #fbfcfd !important;
  border-top: 1px solid #d7dde3 !important;
  color: #334155 !important;
  font-size: 11px !important;
  padding: 6px 10px !important;
}
.gna-pedigree-app .gna-pro-editor-toolbar-compact {
  background: #f1f4f6 !important;
  border-bottom: 1px solid #c9d2d9 !important;
  gap: 4px !important;
  min-height: 42px !important;
  padding: 5px 8px !important;
}
.gna-pedigree-app .gna-pro-editor-toolbar-compact .gna-toolbar-group {
  gap: 4px !important;
  padding-right: 5px !important;
}
.gna-pedigree-app .gna-pro-editor-toolbar-compact .gna-btn {
  border-radius: 3px !important;
  font-size: 11px !important;
  min-height: 30px !important;
  padding: 5px 8px !important;
}
.gna-pedigree-app .gna-pro-editor-toolbar-compact .gna-btn.is-active,
.gna-pedigree-app .gna-pro-editor-toolbar-compact .gna-btn[aria-pressed="true"] {
  background: #8335A3 !important;
  border-color: #8335A3 !important;
  color: #ffffff !important;
}
.gna-pedigree-app .gna-editor-actions-menu {
  z-index: 25 !important;
}
@media (max-width: 1000px) {
  .gna-pedigree-app .gna-pro-editor .gna-stage-header {
    left: 8px !important;
    right: 8px !important;
    top: 8px !important;
  }
  .gna-pedigree-app .gna-pro-editor .gna-svg-wrap {
    min-height: 620px !important;
  }
}


/* FASE 42 - Ajustes profesionales de Pedigree Canvas inspirados en Progeny 11.6 */
.gna-pedigree-app .gna-pedigree-grid-layer,
.gna-pedigree-app .gna-pedigree-page-guides {
	pointer-events: none !important;
}

.gna-pedigree-app .gna-pedigree-grid-layer .gna-grid-line {
	shape-rendering: crispEdges;
}

.gna-pedigree-app:not(.gna-display-show-grid) .gna-pedigree-grid-layer {
	display: none !important;
}

.gna-pedigree-app.gna-display-hide-header .gna-canvas-title-overlay,
.gna-pedigree-app.gna-display-hide-header .gna-print-title {
	display: none !important;
}

.gna-pedigree-app.gna-display-hide-legend .gna-clinical-legend-panel,
.gna-pedigree-app.gna-display-hide-legend .gna-legend {
	display: none !important;
}

.gna-pedigree-app.gna-display-hide-subtext .gna-person-label,
.gna-pedigree-app.gna-display-hide-subtext .gna-pedigree-node-meta {
	display: none !important;
}

.gna-pedigree-app.gna-display-hide-symbols .gna-pedigree-symbol-wrap {
	opacity: .1 !important;
}

.gna-pedigree-app .gna-progeny-display-card {
	border-left: 4px solid #8335A3;
}

.gna-pedigree-app .gna-display-settings-grid {
	margin-top: 12px;
}

.gna-pedigree-app .gna-display-settings-grid .gna-field {
	min-width: 180px;
}

.gna-pedigree-app.gna-display-snap-grid .gna-svg-wrap::after {
	content: "Snap activo";
	position: absolute;
	right: 18px;
	bottom: 18px;
	padding: 6px 10px;
	border-radius: 999px;
	background: rgba(131, 53, 163, .10);
	color: #4B1764;
	font-weight: 700;
	font-size: 12px;
	border: 1px solid rgba(131, 53, 163, .25);
	pointer-events: none;
}

.gna-pedigree-app .gna-page-guide-sheet {
	filter: none;
}

.gna-pedigree-app .gna-pedigree-svg .gna-pedigree-edges-layer line,
.gna-pedigree-app .gna-pedigree-svg .gna-pedigree-edges-layer polyline {
	vector-effect: non-scaling-stroke;
}


/* FASE 43 - Canvas clínico Progeny-like avanzado */
.gna-pedigree-app .gna-pro-editor .gna-pedigree-stage{background:#f3f5f7;border:1px solid #cfd6dc;border-radius:0;box-shadow:none}
.gna-pedigree-app .gna-pro-editor .gna-stage-header{min-height:38px;padding:6px 10px;background:linear-gradient(180deg,#fff 0%,#eef2f5 100%);border-bottom:1px solid #c7d0d8}
.gna-pedigree-app .gna-pro-editor .gna-stage-header h3{font-size:13px;letter-spacing:.02em;color:#111827}
.gna-pedigree-app .gna-pro-editor .gna-stage-header .gna-section-kicker{display:none}
.gna-pedigree-app .gna-pro-editor .gna-svg-wrap{background:#fff;border:1px solid #bfc8d1;border-radius:0;min-height:calc(100vh - 270px);overflow:auto}
.gna-pedigree-app .gna-pro-editor .gna-pedigree-svg{background:#fff;min-width:100%}
.gna-pedigree-app .gna-pro-editor .gna-clinical-legend-panel{border-radius:0;border:1px solid #cfd6dc;background:#fff}
.gna-pedigree-app .gna-one-click-add-layer{pointer-events:all;opacity:.94}
.gna-pedigree-app .gna-one-click-add{cursor:copy;pointer-events:all;filter:drop-shadow(0 2px 2px rgba(0,0,0,.18))}
.gna-pedigree-app .gna-one-click-add:hover polygon{fill:#f59e0b;stroke:#78350f;stroke-width:2}
.gna-pedigree-app .gna-blue-id-label{paint-order:stroke;stroke:#fff;stroke-width:3px;stroke-linejoin:round}
.gna-pedigree-app .gna-proband-arrow-line,.gna-pedigree-app .gna-proband-arrow-head{pointer-events:none}
.gna-pedigree-app .gna-fields-card.gna-progeny-display-card,.gna-pedigree-app .gna-fields-card.gna-progeny-dimensions-card{border-left:5px solid #0ea5e9;background:linear-gradient(180deg,#fff 0%,#f8fafc 100%)}
.gna-pedigree-app .gna-display-settings-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.gna-pedigree-app.gna-display-hide-symbols .gna-person-symbol{opacity:.12!important}
.gna-pedigree-app.gna-display-use-hooks .gna-pedigree-edges-layer line,.gna-pedigree-app.gna-display-use-hooks .gna-pedigree-edges-layer polyline,.gna-pedigree-app.gna-display-use-hooks .gna-pedigree-edges-layer path{vector-effect:non-scaling-stroke}
.gna-pedigree-app .gna-page-guide-line{stroke:#275bff!important;stroke-dasharray:3 7!important;stroke-width:1.2!important}
.gna-pedigree-app .gna-page-guide-sheet{stroke:transparent!important}
.gna-pedigree-app .gna-pedigree-node.is-selected .gna-person-symbol,.gna-pedigree-app .gna-pedigree-node.is-highlighted .gna-person-symbol{stroke-width:3.8!important}
.gna-pedigree-app .gna-pedigree-node .gna-person-label{paint-order:stroke;stroke:#fff;stroke-width:2px;stroke-linejoin:round}
@media(max-width:900px){.gna-pedigree-app .gna-pro-editor .gna-svg-wrap{min-height:560px}}

/* =========================================================
   FASE 43.2 - Estudio Pro / Centro de mando profesional
   ========================================================= */
.gna-summary-tile-pro strong{
	color:#4B1764;
}
.gna-prostudio-panel{
	border:1px solid rgba(131,53,163,.14);
	box-shadow:0 18px 50px rgba(15,23,42,.08);
}
.gna-prostudio-actions{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	justify-content:flex-end;
}
.gna-prostudio-grid{
	display:grid;
	grid-template-columns:1.35fr 1fr;
	gap:16px;
	align-items:start;
}
.gna-prostudio-card{
	background:linear-gradient(180deg,#fff,#fbf8ff);
	border:1px solid #E9D5FF;
	border-radius:18px;
	padding:16px;
	box-shadow:0 12px 28px rgba(88,28,135,.07);
	min-width:0;
}
.gna-prostudio-card-wide{
	grid-column:span 1;
}
.gna-prostudio-card-head{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
	margin-bottom:12px;
}
.gna-prostudio-card-head h4{
	margin:0;
	font-size:16px;
	color:#4B1764;
}
.gna-readiness-badge{
	display:inline-flex;
	align-items:center;
	border-radius:999px;
	padding:6px 10px;
	font-size:12px;
	font-weight:800;
	background:#F1F5F9;
	color:#475569;
}
.gna-readiness-badge.is-high{
	background:#DCFCE7;
	color:#166534;
}
.gna-readiness-badge.is-medium{
	background:#FEF3C7;
	color:#92400E;
}
.gna-readiness-badge.is-low{
	background:#FEE2E2;
	color:#991B1B;
}
.gna-pro-command-kpis{
	display:grid;
	grid-template-columns:repeat(4,minmax(0,1fr));
	gap:10px;
	margin-bottom:14px;
}
.gna-pro-command-kpis>div{
	background:#fff;
	border:1px solid #E5E7EB;
	border-radius:14px;
	padding:12px;
}
.gna-pro-command-kpis span{
	display:block;
	font-size:11px;
	color:#64748B;
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:.04em;
}
.gna-pro-command-kpis strong{
	display:block;
	font-size:24px;
	line-height:1.1;
	color:#111827;
	margin-top:4px;
}
.gna-pro-command-bars{
	display:grid;
	gap:12px;
}
.gna-pro-metric-line{
	display:flex;
	justify-content:space-between;
	gap:10px;
	font-size:13px;
	font-weight:700;
	color:#334155;
	margin-bottom:6px;
}
.gna-pro-meter{
	height:10px;
	border-radius:999px;
	background:#E5E7EB;
	overflow:hidden;
}
.gna-pro-meter i{
	display:block;
	height:100%;
	border-radius:999px;
	background:linear-gradient(90deg,#8335A3,#0EA5E9);
}
.gna-pro-metric-bar small{
	display:block;
	color:#64748B;
	margin-top:5px;
}
.gna-prostudio-search input{
	width:100%;
}
.gna-prostudio-search-results{
	display:grid;
	gap:8px;
	max-height:300px;
	overflow:auto;
	padding-right:4px;
}
.gna-prostudio-person-result{
	appearance:none;
	border:1px solid #E5E7EB;
	background:#fff;
	border-radius:14px;
	padding:10px 12px;
	text-align:left;
	cursor:pointer;
	transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.gna-prostudio-person-result:hover{
	transform:translateY(-1px);
	border-color:#C084FC;
	box-shadow:0 10px 24px rgba(131,53,163,.12);
}
.gna-prostudio-person-result strong,
.gna-prostudio-person-result span{
	display:block;
}
.gna-prostudio-person-result span{
	font-size:12px;
	color:#64748B;
	margin-top:2px;
}
.gna-pro-plan-item{
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
	gap:12px;
	border:1px solid #E5E7EB;
	background:#fff;
	border-radius:16px;
	padding:12px;
	margin-bottom:10px;
}
.gna-pro-plan-item strong{
	color:#111827;
}
.gna-pro-plan-item p{
	margin:4px 0 0;
	color:#475569;
}
.gna-pro-plan-item.is-critical{
	border-left:5px solid #DC2626;
}
.gna-pro-plan-item.is-warning{
	border-left:5px solid #F59E0B;
}
.gna-pro-plan-item.is-info{
	border-left:5px solid #0EA5E9;
}
.gna-pro-plan-item.is-success{
	border-left:5px solid #16A34A;
}
.gna-prostudio-minimap,
.gna-canvas-minimap{
	background:rgba(255,255,255,.94);
	border:1px solid #CBD5E1;
	border-radius:16px;
	padding:10px;
	box-shadow:0 15px 34px rgba(15,23,42,.16);
}
.gna-prostudio-minimap svg,
.gna-canvas-minimap svg{
	display:block;
	width:100%;
	height:auto;
}
.gna-prostudio-minimap small,
.gna-canvas-minimap small{
	display:block;
	font-size:11px;
	color:#64748B;
	margin-top:6px;
}
.gna-canvas-minimap{
	position:absolute;
	right:16px;
	bottom:16px;
	width:246px;
	z-index:8;
	pointer-events:auto;
}
.gna-canvas-pro-hud{
	position:absolute;
	left:16px;
	bottom:16px;
	z-index:8;
	max-width:360px;
	background:rgba(17,24,39,.88);
	color:#fff;
	border:1px solid rgba(255,255,255,.18);
	border-radius:18px;
	padding:12px 14px;
	box-shadow:0 18px 42px rgba(15,23,42,.28);
	backdrop-filter:blur(10px);
}
.gna-canvas-hud-main{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	margin-bottom:6px;
}
.gna-canvas-hud-main span{
	background:rgba(255,255,255,.12);
	border-radius:999px;
	padding:4px 8px;
	font-size:12px;
	font-weight:800;
}
.gna-canvas-hud-selected strong,
.gna-canvas-hud-selected span{
	display:block;
}
.gna-canvas-hud-selected span,
.gna-canvas-pro-hud small{
	color:#D1D5DB;
}
.gna-prostudio-shortcuts{
	display:grid;
	gap:8px;
	color:#475569;
}
.gna-prostudio-shortcuts p{
	margin:0;
}
.gna-prostudio-shortcuts kbd{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:24px;
	padding:2px 6px;
	border-radius:7px;
	border:1px solid #CBD5E1;
	background:#F8FAFC;
	font-size:12px;
	font-weight:800;
	color:#334155;
}
.gna-pro-muted{
	color:#64748B;
	margin:0;
}
.gna-presentation-mode .gna-side-panel,
.gna-presentation-mode .gna-tabs,
.gna-presentation-mode .gna-case-summary,
.gna-presentation-mode .gna-pro-editor-toolbar{
	display:none !important;
}
.gna-presentation-mode .gna-editor-layout{
	grid-template-columns:1fr !important;
}
.gna-presentation-mode .gna-pedigree-stage{
	min-height:78vh;
}
.gna-presentation-mode .gna-svg-wrap{
	min-height:74vh;
}
@media (max-width: 1100px){
	.gna-prostudio-grid{
		grid-template-columns:1fr;
	}
	.gna-pro-command-kpis{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}
	.gna-canvas-minimap{
		width:190px;
	}
}
@media (max-width: 720px){
	.gna-pro-command-kpis{
		grid-template-columns:1fr 1fr;
	}
	.gna-canvas-minimap,
	.gna-canvas-pro-hud{
		position:static;
		margin:10px;
		width:auto;
	}
}