/* ObPortum Executive Presence assessments. All rules are scoped to .epsa-app so the theme is unaffected. */
.epsa-app {
	--epsa-bg: #F4F7FA;
	--epsa-surface: #FFFFFF;
	--epsa-surface-2: #EAF0F6;
	--epsa-ink: #142B47;
	--epsa-ink-2: #44586F;
	--epsa-muted: #6F8197;
	--epsa-line: #D8E1EB;
	--epsa-navy: #1F3A5F;
	--epsa-navy-ink-2: #C9D6E6;
	--epsa-orange: #FC9A49;
	--epsa-orange-ink: #A9560F;
	--epsa-teal: #2F86A8;
	--epsa-teal-soft: #DCEEF5;
	--epsa-warn-bg: #FFF4E8;
	--epsa-warn-line: #F6C597;
	--epsa-font: "Montserrat", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
	font-family: var(--epsa-font);
	font-size: 15px;
	line-height: 1.55;
	color: var(--epsa-ink);
	background: var(--epsa-bg);
	border-radius: 12px;
	max-width: 820px;
	margin: 0 auto 32px;
	text-align: left;
}
.epsa-app *, .epsa-app *::before, .epsa-app *::after { box-sizing: border-box; }
.epsa-app [hidden] { display: none !important; }
.epsa-app p { margin: 0; max-width: 65ch; }
.epsa-app h2, .epsa-app h3 { font-family: var(--epsa-font); color: var(--epsa-ink); margin: 0; padding: 0; text-transform: none; letter-spacing: 0; line-height: 1.25; }
.epsa-app h2 { font-size: 20px; font-weight: 700; }
.epsa-app h3 { font-size: 15px; font-weight: 700; }
.epsa-app ul, .epsa-app ol { margin: 0; }

.epsa-mast { background: var(--epsa-navy); color: #fff; border-radius: 12px 12px 0 0; padding: 26px 24px 28px; display: grid; gap: 10px; }
.epsa-brand { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--epsa-navy-ink-2); }
.epsa-brand b { color: #fff; font-weight: 700; letter-spacing: .04em; text-transform: none; font-size: 15px; }
.epsa-brand b span { color: var(--epsa-orange); }
.epsa-mast .epsa-title { font-size: clamp(22px, 4.4vw, 32px); line-height: 1.15; font-weight: 700; color: #fff; margin: 4px 0 0; }
.epsa-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13px; color: var(--epsa-navy-ink-2); }
.epsa-meta span::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--epsa-orange); margin-right: 8px; vertical-align: middle; }

.epsa-body { padding: 24px; display: grid; gap: 22px; }
.epsa-panel { background: var(--epsa-surface); border: 1px solid var(--epsa-line); border-radius: 10px; padding: 22px; display: grid; gap: 16px; }
.epsa-lead { color: var(--epsa-ink-2); }
.epsa-small { font-size: 12.5px; color: var(--epsa-muted); }
.epsa-callout { background: var(--epsa-teal-soft); border-radius: 8px; padding: 12px 14px; font-size: 14px; }
.epsa-flag { background: var(--epsa-warn-bg); border: 1px solid var(--epsa-warn-line); border-radius: 8px; padding: 10px 14px; font-size: 13.5px; }
.epsa-flag b { display: block; }
.epsa-ok { background: var(--epsa-teal-soft); border-radius: 8px; padding: 10px 14px; font-size: 14px; }

.epsa-comp-list { list-style: none; padding: 0 !important; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 20px; font-size: 14px; }
.epsa-comp-list li { display: flex; gap: 10px; align-items: baseline; margin: 0; }
.epsa-comp-list .epsa-num { color: var(--epsa-orange-ink); font-weight: 700; width: 1.2em; flex: none; }

.epsa-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.epsa-field { display: grid; gap: 6px; align-content: start; }
.epsa-lbl { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--epsa-muted); }
.epsa-app input[type="text"], .epsa-app input[type="email"], .epsa-app select, .epsa-app textarea {
	font: inherit; font-size: 15px; width: 100%; max-width: 100%; padding: 10px 12px; margin: 0;
	border: 1px solid var(--epsa-line); border-radius: 8px; background: var(--epsa-bg); color: var(--epsa-ink); box-shadow: none; height: auto; line-height: 1.4;
}
.epsa-app textarea { min-height: 96px; resize: vertical; }
.epsa-app input:focus-visible, .epsa-app select:focus-visible, .epsa-app textarea:focus-visible { outline: 2px solid var(--epsa-teal); outline-offset: 1px; }
.epsa-field.epsa-err input, .epsa-field.epsa-err select, .epsa-field.epsa-err .epsa-chips { outline: 2px solid var(--epsa-orange); outline-offset: 2px; border-radius: 8px; }
.epsa-check { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; color: var(--epsa-ink-2); cursor: pointer; }
.epsa-check input { margin-top: 3px; width: 16px; height: 16px; flex: none; accent-color: var(--epsa-navy); }
.epsa-check.epsa-err { outline: 2px solid var(--epsa-orange); outline-offset: 4px; border-radius: 4px; }
.epsa-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

.epsa-chips { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.epsa-app .epsa-chips input, .epsa-app .epsa-opts input { position: absolute; opacity: 0; pointer-events: none; width: 1px; height: 1px; margin: 0; }
.epsa-chips label { display: grid; gap: 2px; padding: 10px 12px; border: 1px solid var(--epsa-line); border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 600; background: var(--epsa-surface); color: var(--epsa-ink); margin: 0; }
.epsa-chips label span { font-size: 11.5px; font-weight: 500; color: var(--epsa-muted); line-height: 1.3; }
.epsa-chips input:checked + label, .epsa-opts input:checked + label { background: var(--epsa-navy); border-color: var(--epsa-navy); color: #fff; }
.epsa-chips input:checked + label span, .epsa-opts input:checked + label span { color: var(--epsa-navy-ink-2); }
.epsa-opts input:checked + label b { color: #fff; }
.epsa-chips input:focus-visible + label, .epsa-opts input:focus-visible + label { outline: 2px solid var(--epsa-teal); outline-offset: 2px; }

.epsa-btns { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.epsa-app button.epsa-btn {
	font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; border-radius: 8px; padding: 11px 18px; margin: 0;
	border: 1px solid transparent; line-height: 1.3; text-transform: none; letter-spacing: 0; box-shadow: none; width: auto; min-height: 0;
}
.epsa-app button.epsa-primary { background: var(--epsa-orange); color: var(--epsa-navy); }
.epsa-app button.epsa-primary:hover { filter: brightness(1.05); background: var(--epsa-orange); color: var(--epsa-navy); }
.epsa-app button.epsa-primary:disabled { opacity: .5; cursor: progress; }
.epsa-app button.epsa-ghost { background: transparent; color: var(--epsa-ink); border-color: var(--epsa-line); }
.epsa-app button.epsa-ghost:hover { background: var(--epsa-surface-2); color: var(--epsa-ink); }
.epsa-app button.epsa-btn:focus-visible { outline: 2px solid var(--epsa-teal); outline-offset: 2px; }
.epsa-note { font-size: 13px; color: var(--epsa-orange-ink); }

.epsa-scale { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; font-size: 12px; color: var(--epsa-ink-2); text-align: center; }
.epsa-scale.epsa-six { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.epsa-scale b { display: block; font-size: 15px; color: var(--epsa-ink); }

.epsa-progress { position: sticky; top: 0; z-index: 5; background: var(--epsa-bg); padding: 12px 0; display: grid; gap: 8px; }
.admin-bar .epsa-progress { top: 32px; }
.epsa-progress-row { display: flex; justify-content: space-between; font-size: 13px; color: var(--epsa-ink-2); font-variant-numeric: tabular-nums; gap: 12px; }
.epsa-track { height: 6px; background: var(--epsa-surface-2); border-radius: 3px; overflow: hidden; }
.epsa-track > i { display: block; height: 100%; width: 0; background: var(--epsa-orange); border-radius: 3px; transition: width .25s ease; }

.epsa-items { list-style: none; padding: 0 !important; display: grid; gap: 12px; }
.epsa-item { background: var(--epsa-surface); border: 1px solid var(--epsa-line); border-radius: 10px; padding: 16px 18px; display: grid; gap: 12px; margin: 0; }
.epsa-item.epsa-missing { border-color: var(--epsa-orange); }
.epsa-q { display: flex; gap: 12px; align-items: baseline; }
.epsa-q .epsa-n { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--epsa-muted); font-size: 13px; width: 1.8em; flex: none; }
.epsa-q p { font-weight: 500; }
.epsa-opts { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; margin-left: calc(1.8em + 12px); }
.epsa-opts.epsa-six { grid-template-columns: repeat(5, minmax(0, 1fr)) minmax(0, .9fr); }
.epsa-opts label { display: grid; justify-items: center; gap: 1px; padding: 8px 4px; border: 1px solid var(--epsa-line); border-radius: 8px; cursor: pointer; font-size: 11.5px; color: var(--epsa-muted); text-align: center; line-height: 1.2; background: var(--epsa-surface); margin: 0; font-weight: 500; }
.epsa-opts label b { font-size: 16px; color: var(--epsa-ink); font-variant-numeric: tabular-nums; }
.epsa-opts label:hover { border-color: var(--epsa-teal); }
.epsa-opts label.epsa-no { border-style: dashed; }
.epsa-pager { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; align-items: center; margin-top: 18px; }

/* results */
.epsa-headline { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 20px; align-items: center; }
.epsa-big { font-size: 56px; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.epsa-big small { font-size: 18px; color: var(--epsa-muted); font-weight: 500; }
.epsa-chip { display: inline-block; font-size: 12px; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: var(--epsa-teal-soft); color: var(--epsa-ink); white-space: nowrap; }
.epsa-chip.epsa-b4 { background: var(--epsa-navy); color: #fff; }
.epsa-chip.epsa-b2 { background: var(--epsa-surface-2); }
.epsa-chip.epsa-b1 { background: var(--epsa-orange); color: var(--epsa-navy); }
.epsa-chart { display: grid; gap: 4px; position: relative; }
.epsa-crow { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: 14px; align-items: center; padding: 6px 0; }
.epsa-cname { font-size: 13.5px; font-weight: 600; line-height: 1.3; }
.epsa-ctrack { position: relative; height: 30px; }
.epsa-zone { position: absolute; top: 0; bottom: 0; }
.epsa-divider { position: absolute; top: 0; bottom: 0; border-left: 1px dashed var(--epsa-line); }
.epsa-bar { position: absolute; left: 0; top: 8px; height: 14px; background: var(--epsa-navy); border-radius: 0 4px 4px 0; }
.epsa-val { position: absolute; top: 4px; font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; padding-left: 8px; }
.epsa-axis { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: 14px; }
.epsa-ticks { position: relative; height: 18px; font-size: 11px; color: var(--epsa-muted); font-variant-numeric: tabular-nums; }
.epsa-ticks span { position: absolute; transform: translateX(-50%); }
.epsa-ticks span:first-child { transform: none; }
.epsa-ticks span:last-child { transform: translateX(-100%); }
.epsa-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12px; color: var(--epsa-ink-2); }
.epsa-legend i { display: inline-block; width: 14px; height: 10px; border: 1px solid var(--epsa-line); border-radius: 2px; margin-right: 6px; vertical-align: -1px; }
.epsa-card { border: 1px solid var(--epsa-line); border-radius: 10px; padding: 16px; display: grid; gap: 10px; align-content: start; background: var(--epsa-surface); }
.epsa-card-title { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.epsa-card ul { padding-left: 18px; font-size: 13.5px; color: var(--epsa-ink-2); display: grid; gap: 4px; }
.epsa-app details { border-top: 1px solid var(--epsa-line); padding-top: 10px; }
.epsa-app details + details { border-top: none; padding-top: 0; }
.epsa-app summary { cursor: pointer; font-weight: 600; font-size: 14px; padding: 6px 0; }
.epsa-app summary span { color: var(--epsa-muted); font-weight: 500; }
.epsa-tbl { overflow-x: auto; }
.epsa-app table { border-collapse: collapse; width: 100%; font-size: 13px; margin: 6px 0 12px; border: 0; }
.epsa-app th, .epsa-app td { text-align: left; padding: 7px 8px; border: 0; border-bottom: 1px solid var(--epsa-line); vertical-align: top; background: none; }
.epsa-app th { font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--epsa-muted); font-weight: 600; }
.epsa-app td.epsa-r, .epsa-app th.epsa-r { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.epsa-foot { font-size: 12px; color: var(--epsa-muted); padding: 0 24px 22px; }

@media (max-width: 600px) {
	.epsa-body { padding: 16px; }
	.epsa-mast { padding: 22px 16px; }
	.epsa-panel { padding: 18px; }
	.epsa-comp-list, .epsa-grid2 { grid-template-columns: minmax(0, 1fr); }
	.epsa-chips { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.epsa-opts { margin-left: 0; }
	.epsa-opts label span { display: none; }
	.epsa-scale.epsa-six { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.epsa-crow, .epsa-axis { grid-template-columns: minmax(0, 1fr); gap: 2px; }
	.epsa-axis > div:first-child { display: none; }
	.epsa-headline { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.admin-bar .epsa-progress { top: 0; }
}
@media (prefers-reduced-motion: reduce) { .epsa-app * { transition: none !important; } }