:root {
	--navy-950: #071d2a;
	--navy-900: #0b2a3c;
	--navy-800: #11394f;
	--navy-700: #1a4c64;
	--navy-100: #deebf0;
	--emerald-700: #08745c;
	--emerald-600: #0d8a6d;
	--emerald-100: #dff4ed;
	--emerald-50: #effaf6;
	--gold-600: #a46f08;
	--gold-500: #c58a19;
	--gold-100: #f7e9bf;
	--gold-50: #fff9e8;
	--red-700: #a8323e;
	--red-100: #f9dfe2;
	--red-50: #fff4f5;
	--orange-700: #a24c0e;
	--orange-100: #fde8d7;
	--blue-700: #285d9f;
	--blue-100: #e2ecf9;
	--ink: #17262f;
	--muted: #647681;
	--subtle: #8b9aa3;
	--border: #dce4e8;
	--border-strong: #c8d3d9;
	--surface: #ffffff;
	--canvas: #f4f7f8;
	--canvas-strong: #eaf0f2;
	--focus: #c58a19;
	--shadow-sm: 0 1px 2px rgba(7, 29, 42, 0.05), 0 1px 5px rgba(7, 29, 42, 0.04);
	--shadow-md: 0 14px 36px rgba(7, 29, 42, 0.12), 0 2px 8px rgba(7, 29, 42, 0.07);
	--shadow-lg: 0 24px 80px rgba(7, 29, 42, 0.22);
	--radius-sm: 7px;
	--radius: 11px;
	--radius-lg: 17px;
	--sidebar-width: 246px;
	--topbar-height: 78px;
	--content-width: 1440px;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	font-size: 16px;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	min-width: 320px;
	min-height: 100vh;
	background: var(--canvas);
	color: var(--ink);
	font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 14px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}

body.has-open-drawer {
	overflow: hidden;
}

button,
input,
select,
textarea {
	font: inherit;
}

button,
a,
select {
	-webkit-tap-highlight-color: transparent;
}

button {
	color: inherit;
}

a {
	color: var(--emerald-700);
}

svg {
	fill: currentColor;
}

[hidden] {
	display: none !important;
}

:focus-visible {
	outline: 3px solid color-mix(in srgb, var(--focus) 60%, transparent);
	outline-offset: 2px;
}

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.honeypot-field {
	position: absolute !important;
	left: -10000px !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

.skip-link {
	position: fixed;
	top: 10px;
	left: 10px;
	z-index: 1000;
	padding: 9px 14px;
	border-radius: var(--radius-sm);
	background: var(--surface);
	box-shadow: var(--shadow-md);
	font-weight: 700;
	transform: translateY(-150%);
}

.skip-link:focus {
	transform: translateY(0);
}

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

.eyebrow {
	margin: 0 0 3px;
	color: var(--emerald-700);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.095em;
	line-height: 1.4;
	text-transform: uppercase;
}

.eyebrow--light {
	color: #7ee0c4;
}

.muted {
	color: var(--muted);
}

.brand-mark {
	display: inline-grid;
	width: 38px;
	height: 38px;
	flex: 0 0 auto;
	place-items: center;
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 10px 10px 10px 3px;
	background: linear-gradient(145deg, var(--emerald-600), #0b6a58);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 7px 20px rgba(4, 75, 61, 0.2);
	color: #fff;
	font-family: Georgia, serif;
	font-size: 23px;
	font-weight: 700;
	line-height: 1;
}

.brand-mark--large {
	width: 58px;
	height: 58px;
	border-radius: 15px 15px 15px 5px;
	font-size: 34px;
}

/* Initial loading */

.boot-screen {
	display: grid;
	min-height: 100vh;
	padding: 24px;
	place-items: center;
	background: radial-gradient(circle at 25% 15%, rgba(13, 138, 109, 0.11), transparent 38%),
		var(--canvas);
}

.boot-card {
	width: min(100%, 430px);
	padding: 38px;
	border: 1px solid var(--border);
	border-radius: var(--radius-lg);
	background: var(--surface);
	box-shadow: var(--shadow-md);
	text-align: center;
}

.boot-card .brand-mark {
	margin-bottom: 20px;
}

.boot-card h1 {
	margin: 5px 0 8px;
	color: var(--navy-900);
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(24px, 4vw, 31px);
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1.15;
}

.loading-line {
	height: 3px;
	margin: 25px auto 16px;
	overflow: hidden;
	border-radius: 3px;
	background: var(--canvas-strong);
}

.loading-line span {
	display: block;
	width: 42%;
	height: 100%;
	border-radius: inherit;
	background: var(--emerald-600);
	animation: loading-slide 1.2s ease-in-out infinite;
}

@keyframes loading-slide {
	0% {
		transform: translateX(-110%);
	}
	100% {
		transform: translateX(340%);
	}
}

/* Authentication */

.auth-screen {
	display: grid;
	min-height: 100vh;
	grid-template-columns: minmax(360px, 0.9fr) minmax(520px, 1.1fr);
	background: var(--surface);
}

.auth-brand {
	display: grid;
	min-height: 100vh;
	padding: clamp(42px, 7vw, 100px);
	place-items: center;
	background: linear-gradient(160deg, rgba(7, 29, 42, 0.1), rgba(7, 29, 42, 0.92)),
		radial-gradient(circle at 15% 15%, #1c806a 0, transparent 40%),
		linear-gradient(145deg, var(--navy-800), var(--navy-950));
	color: #fff;
}

.auth-brand__inner {
	width: min(100%, 610px);
}

.auth-brand .brand-mark {
	margin-bottom: 35px;
}

.auth-brand h1 {
	max-width: 590px;
	margin: 8px 0 22px;
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(38px, 5vw, 64px);
	font-weight: 500;
	letter-spacing: -0.035em;
	line-height: 1.02;
}

.auth-brand__inner > p:not(.eyebrow) {
	max-width: 540px;
	margin: 0;
	color: #c9d8df;
	font-size: 17px;
	line-height: 1.7;
}

.auth-benefits {
	display: grid;
	margin: 45px 0 0;
	padding: 0;
	gap: 14px;
	list-style: none;
}

.auth-benefits li {
	display: flex;
	align-items: center;
	gap: 11px;
	color: #e5eef1;
	font-weight: 600;
}

.auth-benefits li span {
	display: grid;
	width: 23px;
	height: 23px;
	flex: 0 0 auto;
	place-items: center;
	border-radius: 50%;
	background: rgba(126, 224, 196, 0.12);
	color: #7ee0c4;
	font-size: 12px;
}

.auth-panel {
	display: grid;
	min-height: 100vh;
	padding: 40px clamp(28px, 7vw, 100px);
	place-items: center;
	overflow-y: auto;
}

.auth-card {
	width: min(100%, 520px);
}

.auth-card__brand {
	display: none;
	align-items: center;
	margin-bottom: 30px;
	gap: 11px;
}

.auth-card__brand > div:last-child {
	display: flex;
	flex-direction: column;
	line-height: 1.15;
}

.auth-card__brand strong {
	color: var(--navy-900);
	font-size: 17px;
	letter-spacing: 0.04em;
}

.auth-card__brand span {
	color: var(--muted);
	font-size: 12px;
}

.segmented-control {
	display: grid;
	margin-bottom: 34px;
	padding: 4px;
	grid-template-columns: 1fr 1fr;
	border-radius: 10px;
	background: var(--canvas-strong);
}

.segment {
	min-height: 40px;
	border: 0;
	border-radius: 7px;
	background: transparent;
	color: var(--muted);
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
}

.segment.is-active {
	background: var(--surface);
	box-shadow: var(--shadow-sm);
	color: var(--navy-900);
}

.panel-heading {
	margin-bottom: 25px;
}

.panel-heading h2 {
	margin: 4px 0 7px;
	color: var(--navy-900);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 31px;
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1.15;
}

.panel-heading > p:last-child {
	margin: 0;
	color: var(--muted);
}

.stack-form {
	display: grid;
	gap: 17px;
}

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

.field,
.compact-field {
	display: grid;
	gap: 6px;
	color: var(--ink);
	font-size: 12px;
	font-weight: 700;
}

.field input,
.field textarea,
.field select,
.compact-field select,
.compact-field input {
	width: 100%;
	border: 1px solid var(--border-strong);
	border-radius: var(--radius-sm);
	background: var(--surface);
	color: var(--ink);
	font-size: 14px;
	font-weight: 500;
	transition: border-color 0.15s, box-shadow 0.15s;
}

.field input,
.field select {
	height: 44px;
	padding: 0 12px;
}

.field textarea {
	min-height: 88px;
	padding: 10px 12px;
	line-height: 1.5;
	resize: vertical;
}

.field input:focus,
.field textarea:focus,
.field select:focus,
.compact-field select:focus,
.compact-field input:focus {
	border-color: var(--emerald-600);
	box-shadow: 0 0 0 3px rgba(13, 138, 109, 0.12);
	outline: none;
}

.field input::placeholder,
.field textarea::placeholder {
	color: #98a6ae;
	font-weight: 400;
}

.password-field {
	position: relative;
	display: block;
}

.password-field input {
	padding-right: 62px;
}

.text-button {
	position: absolute;
	top: 50%;
	right: 7px;
	padding: 5px 7px;
	border: 0;
	background: transparent;
	color: var(--emerald-700);
	font-size: 12px;
	font-weight: 800;
	cursor: pointer;
	transform: translateY(-50%);
}

.check-field {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	color: var(--muted);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.5;
}

.check-field input {
	width: 16px;
	height: 16px;
	margin: 2px 0 0;
	accent-color: var(--emerald-700);
}

.auth-footnote {
	margin: 30px 0 0;
	color: var(--subtle);
	font-size: 11px;
	text-align: center;
}

/* Shared buttons and notices */

.button {
	display: inline-flex;
	min-height: 40px;
	align-items: center;
	justify-content: center;
	padding: 0 15px;
	gap: 7px;
	border: 1px solid transparent;
	border-radius: var(--radius-sm);
	font-size: 13px;
	font-weight: 800;
	line-height: 1;
	cursor: pointer;
	transition: background 0.15s, border-color 0.15s, color 0.15s, transform 0.15s,
		box-shadow 0.15s;
}

.button:hover:not(:disabled) {
	transform: translateY(-1px);
}

.button:disabled {
	opacity: 0.58;
	cursor: wait;
}

.button--primary {
	border-color: var(--emerald-700);
	background: var(--emerald-700);
	box-shadow: 0 5px 14px rgba(8, 116, 92, 0.16);
	color: #fff;
}

.button--primary:hover:not(:disabled) {
	background: #05644f;
}

.button--secondary {
	border-color: var(--navy-900);
	background: var(--navy-900);
	color: #fff;
}

.button--ghost {
	border-color: var(--border-strong);
	background: var(--surface);
	color: var(--navy-700);
}

.button--ghost:hover:not(:disabled) {
	border-color: var(--navy-700);
	background: var(--canvas);
}

.button--danger {
	border-color: var(--red-700);
	background: var(--red-700);
	color: #fff;
}

.button--wide {
	width: 100%;
	min-height: 46px;
}

.button--small {
	min-height: 34px;
	padding: 0 11px;
	font-size: 12px;
}

.inline-alert {
	margin-bottom: 18px;
	padding: 11px 13px;
	border: 1px solid var(--border);
	border-radius: var(--radius-sm);
	background: var(--canvas);
	color: var(--ink);
	font-size: 13px;
}

.inline-alert[data-kind="error"] {
	border-color: #efbec4;
	background: var(--red-50);
	color: #852630;
}

.inline-alert[data-kind="success"] {
	border-color: #abdccc;
	background: var(--emerald-50);
	color: #075d4a;
}

.inline-alert[data-kind="warning"] {
	border-color: #ead18a;
	background: var(--gold-50);
	color: #74500a;
}

.link-button {
	padding: 5px;
	border: 0;
	background: transparent;
	color: var(--emerald-700);
	font-size: 12px;
	font-weight: 800;
	cursor: pointer;
}

.icon-button {
	display: grid;
	width: 40px;
	height: 40px;
	padding: 0;
	place-items: center;
	border: 1px solid var(--border);
	border-radius: 50%;
	background: var(--surface);
	color: var(--navy-800);
	cursor: pointer;
}

.icon-button:hover {
	border-color: var(--border-strong);
	background: var(--canvas);
}

.icon-button svg {
	width: 19px;
	height: 19px;
}

/* Authenticated application shell */

.crm-shell {
	display: grid;
	min-height: 100vh;
	grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
}

.sidebar {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	z-index: 20;
	display: flex;
	width: var(--sidebar-width);
	padding: 23px 15px 18px;
	flex-direction: column;
	background: var(--navy-950);
	color: #fff;
}

.sidebar-brand {
	display: flex;
	align-items: center;
	margin: 0 5px 30px;
	gap: 11px;
	color: #fff;
	text-decoration: none;
}

.sidebar-brand > span:last-child {
	display: flex;
	min-width: 0;
	flex-direction: column;
	line-height: 1.1;
}

.sidebar-brand strong {
	font-size: 17px;
	letter-spacing: 0.055em;
}

.sidebar-brand small {
	margin-top: 4px;
	color: #9eb2bd;
	font-size: 11px;
}

.sidebar-nav {
	display: grid;
	gap: 5px;
}

.nav-item {
	display: flex;
	width: 100%;
	min-height: 44px;
	align-items: center;
	padding: 0 12px;
	gap: 11px;
	border: 1px solid transparent;
	border-radius: 8px;
	background: transparent;
	color: #adbec7;
	font-size: 13px;
	font-weight: 700;
	text-align: left;
	cursor: pointer;
}

.nav-item:hover {
	background: rgba(255, 255, 255, 0.05);
	color: #fff;
}

.nav-item.is-active {
	border-color: rgba(126, 224, 196, 0.12);
	background: rgba(13, 138, 109, 0.2);
	color: #fff;
}

.nav-item svg {
	width: 19px;
	height: 19px;
	flex: 0 0 auto;
}

.nav-count {
	min-width: 22px;
	margin-left: auto;
	padding: 2px 6px;
	border-radius: 12px;
	background: var(--gold-500);
	color: var(--navy-950);
	font-size: 10px;
	font-weight: 900;
	text-align: center;
}

.sidebar-security {
	display: flex;
	margin-top: auto;
	padding: 13px 10px;
	align-items: flex-start;
	gap: 10px;
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 9px;
	background: rgba(255, 255, 255, 0.035);
}

.sidebar-security svg {
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
	color: #7ee0c4;
}

.sidebar-security div {
	display: flex;
	min-width: 0;
	flex-direction: column;
}

.sidebar-security strong {
	font-size: 11px;
}

.sidebar-security span {
	margin-top: 2px;
	color: #8fa5b0;
	font-size: 9px;
	line-height: 1.35;
}

.workspace {
	min-width: 0;
	grid-column: 2;
}

.topbar {
	position: sticky;
	top: 0;
	z-index: 15;
	display: flex;
	height: var(--topbar-height);
	align-items: center;
	justify-content: space-between;
	padding: 0 clamp(22px, 3vw, 42px);
	border-bottom: 1px solid var(--border);
	background: rgba(255, 255, 255, 0.94);
	backdrop-filter: blur(12px);
}

.topbar h1 {
	margin: 1px 0 0;
	color: var(--navy-900);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 25px;
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1.1;
}

.topbar-actions {
	position: relative;
	display: flex;
	align-items: center;
	gap: 10px;
}

.user-button {
	display: flex;
	min-height: 46px;
	align-items: center;
	padding: 4px 8px 4px 5px;
	gap: 9px;
	border: 1px solid transparent;
	border-radius: 9px;
	background: transparent;
	cursor: pointer;
}

.user-button:hover,
.user-button[aria-expanded="true"] {
	border-color: var(--border);
	background: var(--canvas);
}

.avatar {
	display: grid;
	width: 36px;
	height: 36px;
	flex: 0 0 auto;
	place-items: center;
	border-radius: 50%;
	background: var(--navy-100);
	color: var(--navy-800);
	font-size: 13px;
	font-weight: 900;
}

.user-copy {
	display: flex;
	max-width: 170px;
	flex-direction: column;
	text-align: left;
	line-height: 1.25;
}

.user-copy strong {
	overflow: hidden;
	font-size: 12px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.user-copy small {
	overflow: hidden;
	margin-top: 2px;
	color: var(--muted);
	font-size: 10px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.user-button > svg {
	width: 16px;
	height: 16px;
	color: var(--muted);
}

.user-menu {
	position: absolute;
	top: calc(100% + 7px);
	right: 0;
	z-index: 30;
	width: 225px;
	padding: 8px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-md);
}

.user-menu p {
	display: flex;
	margin: 0 0 6px;
	padding: 9px 10px 11px;
	flex-direction: column;
	border-bottom: 1px solid var(--border);
}

.user-menu p strong {
	font-size: 12px;
}

.user-menu p span {
	overflow: hidden;
	margin-top: 2px;
	color: var(--muted);
	font-size: 10px;
	text-overflow: ellipsis;
}

.user-menu a,
.user-menu button {
	display: flex;
	width: 100%;
	min-height: 36px;
	align-items: center;
	padding: 0 10px;
	border: 0;
	border-radius: 6px;
	background: transparent;
	color: var(--ink);
	font-size: 12px;
	font-weight: 700;
	text-align: left;
	text-decoration: none;
	cursor: pointer;
}

.user-menu a:hover,
.user-menu button:hover {
	background: var(--canvas);
}

.modal-backdrop {
	position: fixed;
	inset: 0;
	z-index: 70;
	background: rgba(7, 29, 42, 0.58);
	backdrop-filter: blur(3px);
}

.install-guide {
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 75;
	display: grid;
	width: min(calc(100% - 32px), 430px);
	padding: 26px;
	transform: translate(-50%, -50%);
	border: 1px solid var(--border);
	border-radius: 16px;
	background: var(--surface);
	box-shadow: var(--shadow-lg);
	gap: 12px;
}

.install-guide__mark {
	display: grid;
	width: 52px;
	height: 52px;
	place-items: center;
	border-radius: 13px;
	background: var(--navy-900);
	color: #fff;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 28px;
	font-weight: 700;
}

.install-guide h2,
.install-guide p {
	margin: 0;
}

.install-guide h2 {
	color: var(--navy-900);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 23px;
	line-height: 1.2;
}

.install-guide p {
	font-size: 13px;
	line-height: 1.55;
}

.main-content {
	width: min(100%, calc(var(--content-width) + 84px));
	min-height: calc(100vh - var(--topbar-height));
	margin: 0 auto;
	padding: 28px clamp(22px, 3vw, 42px) 54px;
}

.view {
	animation: view-in 0.2s ease-out;
}

@keyframes view-in {
	from {
		opacity: 0;
		transform: translateY(4px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Dashboard */

.summary-grid {
	display: grid;
	margin-bottom: 20px;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 13px;
}

.summary-card {
	position: relative;
	min-height: 132px;
	padding: 19px;
	overflow: hidden;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-sm);
}

.summary-card::after {
	position: absolute;
	top: -24px;
	right: -24px;
	width: 78px;
	height: 78px;
	border-radius: 50%;
	background: var(--canvas);
	content: "";
}

.summary-card--emerald::after {
	background: var(--emerald-50);
}
.summary-card--gold::after {
	background: var(--gold-50);
}
.summary-card--red::after {
	background: var(--red-50);
}

.summary-card__icon {
	position: absolute;
	top: 15px;
	right: 15px;
	z-index: 1;
	display: grid;
	width: 31px;
	height: 31px;
	place-items: center;
	border-radius: 8px;
	background: var(--navy-100);
	color: var(--navy-700);
}

.summary-card--emerald .summary-card__icon {
	background: var(--emerald-100);
	color: var(--emerald-700);
}
.summary-card--gold .summary-card__icon {
	background: var(--gold-100);
	color: var(--gold-600);
}
.summary-card--red .summary-card__icon {
	background: var(--red-100);
	color: var(--red-700);
}

.summary-card__icon svg {
	width: 16px;
	height: 16px;
}

.summary-card__label {
	display: block;
	max-width: calc(100% - 40px);
	color: var(--muted);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.035em;
	text-transform: uppercase;
}

.summary-card__value {
	display: block;
	margin: 12px 0 5px;
	color: var(--navy-900);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 32px;
	font-weight: 600;
	letter-spacing: -0.03em;
	line-height: 1;
}

.summary-card__meta {
	color: var(--subtle);
	font-size: 10px;
	font-weight: 600;
}

.dashboard-grid {
	display: grid;
	grid-template-columns: 1.15fr 0.85fr;
	gap: 16px;
}

.panel {
	padding: 20px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-sm);
}

.panel--span-2 {
	grid-column: 1 / -1;
}

.panel-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	margin-bottom: 17px;
	gap: 14px;
}

.panel-header h2,
.section-intro h2,
.report-section > h2 {
	margin: 1px 0 0;
	color: var(--navy-900);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 20px;
	font-weight: 600;
	letter-spacing: -0.015em;
	line-height: 1.2;
}

.followup-list {
	display: grid;
}

.followup-item {
	display: grid;
	min-height: 64px;
	align-items: center;
	padding: 9px 3px;
	grid-template-columns: minmax(0, 1.4fr) minmax(100px, 0.55fr) minmax(100px, 0.55fr) auto;
	gap: 12px;
	border-top: 1px solid var(--border);
}

.followup-item:first-child {
	border-top: 0;
}

.followup-item__identity {
	display: flex;
	min-width: 0;
	align-items: center;
	gap: 11px;
}

.record-avatar {
	display: grid;
	width: 37px;
	height: 37px;
	flex: 0 0 auto;
	place-items: center;
	border-radius: 9px;
	background: var(--navy-100);
	color: var(--navy-700);
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
}

.record-avatar[data-class="corporate"] {
	background: var(--emerald-100);
	color: var(--emerald-700);
}

.identity-copy,
.followup-meta {
	display: flex;
	min-width: 0;
	flex-direction: column;
}

.identity-copy strong,
.followup-meta strong {
	overflow: hidden;
	color: var(--ink);
	font-size: 12px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.identity-copy span,
.followup-meta span {
	overflow: hidden;
	margin-top: 2px;
	color: var(--muted);
	font-size: 10px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.due-label {
	display: inline-flex;
	width: fit-content;
	align-items: center;
	padding: 4px 7px;
	gap: 5px;
	border-radius: 14px;
	background: var(--gold-100);
	color: #74500a;
	font-size: 10px;
	font-weight: 800;
}

.due-label.is-overdue {
	background: var(--red-100);
	color: var(--red-700);
}

.due-label.is-upcoming {
	background: var(--blue-100);
	color: var(--blue-700);
}

.status-progress {
	display: grid;
	gap: 13px;
}

.progress-row {
	display: grid;
	grid-template-columns: minmax(100px, 0.8fr) minmax(90px, 1.4fr) 42px;
	align-items: center;
	gap: 10px;
}

.progress-row__label {
	overflow: hidden;
	font-size: 11px;
	font-weight: 700;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.progress-track {
	height: 7px;
	overflow: hidden;
	border-radius: 5px;
	background: var(--canvas-strong);
}

.progress-track span {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: var(--navy-700);
}

.progress-row[data-status="confirmed"] .progress-track span,
.progress-row[data-status="100-confirmed"] .progress-track span {
	background: var(--emerald-600);
}
.progress-row[data-status="positive"] .progress-track span {
	background: #3f8a68;
}
.progress-row[data-status="maybe"] .progress-track span {
	background: var(--gold-500);
}
.progress-row[data-status="needs-follow-up"] .progress-track span {
	background: var(--orange-700);
}
.progress-row[data-status="not-supporting"] .progress-track span {
	background: var(--red-700);
}

.progress-row__count {
	color: var(--muted);
	font-size: 11px;
	font-weight: 800;
	text-align: right;
}

.ranking-list {
	display: grid;
	gap: 4px;
}

.ranking-item {
	display: grid;
	min-height: 46px;
	align-items: center;
	padding: 5px 0;
	grid-template-columns: 24px minmax(0, 1fr) auto;
	gap: 9px;
	border-top: 1px solid var(--border);
}

.ranking-item:first-child {
	border-top: 0;
}

.ranking-index {
	display: grid;
	width: 21px;
	height: 21px;
	place-items: center;
	border-radius: 50%;
	background: var(--canvas-strong);
	color: var(--muted);
	font-size: 9px;
	font-weight: 900;
}

.ranking-copy {
	display: flex;
	min-width: 0;
	flex-direction: column;
}

.ranking-copy strong {
	overflow: hidden;
	font-size: 11px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.ranking-copy span {
	margin-top: 1px;
	color: var(--muted);
	font-size: 9px;
}

.ranking-value {
	color: var(--emerald-700);
	font-size: 12px;
	font-weight: 900;
}

/* Search and results */

.search-panel {
	display: grid;
	padding: 17px;
	grid-template-columns: minmax(200px, 1fr) auto;
	gap: 10px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-sm);
}

.search-field {
	position: relative;
	display: flex;
	height: 42px;
	align-items: center;
	border: 1px solid var(--border-strong);
	border-radius: var(--radius-sm);
	background: var(--surface);
	transition: border-color 0.15s, box-shadow 0.15s;
}

.search-field:focus-within {
	border-color: var(--emerald-600);
	box-shadow: 0 0 0 3px rgba(13, 138, 109, 0.12);
}

.search-field svg {
	width: 19px;
	height: 19px;
	margin-left: 12px;
	color: var(--muted);
}

.search-field input {
	min-width: 0;
	height: 100%;
	padding: 0 44px 0 10px;
	flex: 1;
	border: 0;
	background: transparent;
	color: var(--ink);
	font-size: 13px;
	font-weight: 500;
	outline: none;
}

.search-field input::placeholder {
	color: #8a9aa2;
}

.search-field input::-webkit-search-cancel-button {
	display: none;
}

.search-shortcut {
	position: absolute;
	right: 9px;
	display: grid;
	width: 24px;
	height: 23px;
	place-items: center;
	border: 1px solid var(--border);
	border-radius: 5px;
	background: var(--canvas);
	box-shadow: 0 1px 1px rgba(7, 29, 42, 0.05);
	color: var(--muted);
	font-family: inherit;
	font-size: 11px;
}

.filter-row {
	display: grid;
	padding-top: 12px;
	grid-column: 1 / -1;
	grid-template-columns: repeat(5, minmax(125px, 1fr));
	align-items: end;
	gap: 9px;
	border-top: 1px solid var(--border);
}

.compact-field {
	gap: 4px;
	color: var(--muted);
	font-size: 10px;
}

.compact-field select,
.compact-field input {
	height: 34px;
	padding: 0 28px 0 9px;
	font-size: 11px;
	font-weight: 650;
}

.results-toolbar {
	display: flex;
	min-height: 57px;
	align-items: center;
	justify-content: space-between;
	padding: 7px 2px;
	gap: 14px;
}

.results-toolbar > div:first-child {
	display: flex;
	flex-direction: column;
}

.results-toolbar strong {
	font-size: 12px;
}

.results-toolbar span {
	margin-top: 1px;
	color: var(--muted);
	font-size: 10px;
}

.duplicate-review {
	margin-top: 18px;
}

.duplicate-review__header,
.duplicate-review__actions {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 12px;
}

.duplicate-review__header p {
	margin: 4px 0 0;
	color: var(--muted);
	font-size: 11px;
}

.duplicate-review__actions .compact-field {
	min-width: 170px;
}

.duplicate-review__list {
	display: grid;
	padding: 0 18px 18px;
	gap: 10px;
}

.duplicate-card {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	padding: 14px;
	gap: 14px;
	border: 1px solid var(--border);
	border-radius: 10px;
	background: var(--canvas);
}

.duplicate-card__voter strong,
.duplicate-card__voter span {
	display: block;
}

.duplicate-card__voter span,
.duplicate-card__evidence small {
	margin-top: 3px;
	color: var(--muted);
	font-size: 10px;
}

.duplicate-card__evidence {
	min-width: 130px;
	text-align: center;
}

.duplicate-card__review {
	display: flex;
	grid-column: 1 / -1;
	align-items: center;
	gap: 8px;
}

.duplicate-card__review input {
	min-width: 180px;
	flex: 1;
}

@media (max-width: 700px) {
	.duplicate-review__header,
	.duplicate-review__actions,
	.duplicate-card,
	.duplicate-card__review {
		display: grid;
		grid-template-columns: 1fr;
		align-items: stretch;
	}

	.duplicate-card__evidence {
		text-align: left;
	}
}

.view-switcher {
	display: flex;
	padding: 3px;
	gap: 2px;
	border-radius: 7px;
	background: var(--canvas-strong);
}

.view-switcher button {
	display: grid;
	width: 30px;
	height: 27px;
	padding: 0;
	place-items: center;
	border: 0;
	border-radius: 5px;
	background: transparent;
	color: var(--muted);
	cursor: pointer;
}

.view-switcher button.is-active {
	background: var(--surface);
	box-shadow: var(--shadow-sm);
	color: var(--navy-800);
}

.view-switcher svg {
	width: 15px;
	height: 15px;
}

.voter-results {
	overflow: hidden;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-sm);
}

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

.voter-table {
	width: 100%;
	min-width: 930px;
	border-collapse: collapse;
	table-layout: fixed;
}

.voter-table th {
	height: 38px;
	padding: 0 12px;
	border-bottom: 1px solid var(--border);
	background: var(--canvas);
	color: var(--muted);
	font-size: 9px;
	font-weight: 850;
	letter-spacing: 0.055em;
	text-align: left;
	text-transform: uppercase;
}

.voter-table td {
	height: 66px;
	padding: 8px 12px;
	border-bottom: 1px solid var(--border);
	font-size: 11px;
	vertical-align: middle;
}

.voter-table tbody tr:last-child td {
	border-bottom: 0;
}

.voter-table tbody tr {
	cursor: pointer;
	transition: background 0.12s;
}

.voter-table tbody tr:hover,
.voter-table tbody tr:focus-within {
	background: var(--emerald-50);
}

.voter-table th:nth-child(1) {
	width: 90px;
}
.voter-table th:nth-child(2) {
	width: 230px;
}
.voter-table th:nth-child(3) {
	width: 105px;
}
.voter-table th:nth-child(4) {
	width: 125px;
}
.voter-table th:nth-child(5) {
	width: 150px;
}
.voter-table th:nth-child(6) {
	width: 145px;
}
.voter-table th:nth-child(7) {
	width: 56px;
}

.table-primary,
.table-secondary {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.table-primary {
	color: var(--ink);
	font-size: 11px;
	font-weight: 800;
}

.table-secondary {
	margin-top: 3px;
	color: var(--muted);
	font-size: 9px;
}

.voter-row-open {
	display: grid;
	width: 31px;
	height: 31px;
	padding: 0;
	place-items: center;
	border: 1px solid var(--border);
	border-radius: 50%;
	background: var(--surface);
	color: var(--navy-700);
	cursor: pointer;
}

.voter-row-open svg {
	width: 15px;
	height: 15px;
}

.voter-card-grid {
	display: grid;
	padding: 13px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 11px;
	background: var(--canvas);
}

.voter-results[data-layout="table"] .voter-card-grid,
.voter-results[data-layout="cards"] .voter-table-wrap {
	display: none;
}

.voter-card {
	display: flex;
	min-width: 0;
	min-height: 184px;
	padding: 14px;
	flex-direction: column;
	border: 1px solid var(--border);
	border-radius: 9px;
	background: var(--surface);
	box-shadow: var(--shadow-sm);
	cursor: pointer;
}

.voter-card:hover {
	border-color: #a9c8bc;
	box-shadow: 0 6px 20px rgba(7, 29, 42, 0.09);
}

.voter-card__head {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}

.voter-card__head .identity-copy {
	padding-top: 2px;
}

.voter-card__meta {
	display: grid;
	margin: 13px 0;
	grid-template-columns: 1fr 1fr;
	gap: 9px;
}

.mini-meta {
	display: flex;
	min-width: 0;
	flex-direction: column;
}

.mini-meta span {
	color: var(--subtle);
	font-size: 8px;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.mini-meta strong {
	overflow: hidden;
	margin-top: 2px;
	font-size: 10px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.voter-card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: auto;
	padding-top: 10px;
	gap: 8px;
	border-top: 1px solid var(--border);
}

.status-pill,
.class-pill,
.priority-pill {
	display: inline-flex;
	width: fit-content;
	max-width: 100%;
	align-items: center;
	padding: 4px 7px;
	gap: 5px;
	border: 1px solid transparent;
	border-radius: 14px;
	background: var(--canvas-strong);
	color: var(--muted);
	font-size: 9px;
	font-weight: 850;
	line-height: 1;
	white-space: nowrap;
}

.status-pill::before {
	width: 5px;
	height: 5px;
	flex: 0 0 auto;
	border-radius: 50%;
	background: currentColor;
	content: "";
}

.status-pill[data-status="confirmed"],
.status-pill[data-status="100-confirmed"] {
	background: var(--emerald-100);
	color: #07624e;
}
.status-pill[data-status="positive"] {
	background: #e3f2e9;
	color: #337356;
}
.status-pill[data-status="maybe"] {
	background: var(--gold-100);
	color: #805908;
}
.status-pill[data-status="needs-follow-up"] {
	background: var(--orange-100);
	color: var(--orange-700);
}
.status-pill[data-status="not-supporting"] {
	background: var(--red-100);
	color: var(--red-700);
}
.status-pill[data-status="uncontacted"] {
	background: var(--canvas-strong);
	color: var(--muted);
}

.class-pill[data-class="corporate"] {
	background: var(--navy-100);
	color: var(--navy-700);
}
.class-pill[data-class="associate"] {
	background: var(--gold-100);
	color: #775307;
}

.priority-pill[data-priority="high"] {
	background: var(--red-100);
	color: var(--red-700);
}

.pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 16px;
	gap: 5px;
}

.pagination button {
	display: grid;
	min-width: 34px;
	height: 34px;
	padding: 0 9px;
	place-items: center;
	border: 1px solid var(--border);
	border-radius: 7px;
	background: var(--surface);
	color: var(--navy-800);
	font-size: 11px;
	font-weight: 800;
	cursor: pointer;
}

.pagination button[aria-current="page"] {
	border-color: var(--emerald-700);
	background: var(--emerald-700);
	color: #fff;
}

.pagination button:disabled {
	opacity: 0.45;
	cursor: default;
}

/* Empty, error, and loading states */

.state-card {
	display: grid;
	min-height: 250px;
	padding: 35px;
	place-items: center;
	text-align: center;
}

.state-card__inner {
	max-width: 420px;
}

.state-icon {
	display: grid;
	width: 46px;
	height: 46px;
	margin: 0 auto 13px;
	place-items: center;
	border-radius: 13px;
	background: var(--canvas-strong);
	color: var(--navy-700);
}

.state-icon svg {
	width: 22px;
	height: 22px;
}

.state-card h3 {
	margin: 0 0 5px;
	color: var(--navy-900);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 18px;
	font-weight: 600;
}

.state-card p {
	margin: 0 auto;
	color: var(--muted);
	font-size: 12px;
}

.state-card .button {
	margin-top: 15px;
}

.skeleton-list {
	display: grid;
	padding: 10px;
	gap: 7px;
}

.skeleton-row {
	display: grid;
	height: 60px;
	align-items: center;
	padding: 0 12px;
	grid-template-columns: 70px 1.4fr 0.7fr 0.8fr 0.7fr;
	gap: 15px;
	border-radius: 7px;
	background: var(--canvas);
}

.skeleton-row span,
.skeleton-block {
	display: block;
	height: 10px;
	border-radius: 5px;
	background: linear-gradient(90deg, #e8eef0 20%, #f5f7f8 50%, #e8eef0 80%);
	background-size: 220% 100%;
	animation: shimmer 1.35s linear infinite;
}

@keyframes shimmer {
	to {
		background-position: -220% 0;
	}
}

/* Follow-up queue */

.section-intro {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	margin-bottom: 18px;
	gap: 20px;
}

.section-intro h2 {
	font-size: 25px;
}

.section-intro p:not(.eyebrow) {
	margin: 5px 0 0;
	color: var(--muted);
	font-size: 12px;
}

.queue-filters {
	display: flex;
	margin-bottom: 13px;
	padding: 4px;
	gap: 3px;
	border: 1px solid var(--border);
	border-radius: 9px;
	background: var(--surface);
	width: fit-content;
}

.queue-filter {
	min-height: 33px;
	padding: 0 13px;
	border: 0;
	border-radius: 6px;
	background: transparent;
	color: var(--muted);
	font-size: 11px;
	font-weight: 800;
	cursor: pointer;
}

.queue-filter.is-active {
	background: var(--navy-900);
	color: #fff;
}

.followup-board {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 13px;
}

.followup-card {
	display: flex;
	min-width: 0;
	min-height: 190px;
	padding: 15px;
	flex-direction: column;
	border: 1px solid var(--border);
	border-top: 3px solid var(--gold-500);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-sm);
}

.followup-card.is-overdue {
	border-top-color: var(--red-700);
}

.followup-card.is-upcoming {
	border-top-color: var(--blue-700);
}

.followup-card__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.followup-card h3 {
	overflow: hidden;
	margin: 13px 0 3px;
	font-size: 13px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.followup-card > p {
	display: -webkit-box;
	overflow: hidden;
	margin: 0;
	color: var(--muted);
	font-size: 10px;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.followup-card__meta {
	display: grid;
	margin: 13px 0;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
}

.followup-card .button {
	margin-top: auto;
}

.followup-card__actions,
.workflow-item__actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 7px;
}

.followup-card__actions {
	margin-top: 9px;
}

.followup-card__actions .button,
.workflow-item__actions .button {
	margin-top: 0;
}

.workflow-list {
	display: grid;
	gap: 10px;
}

.workflow-item {
	display: grid;
	gap: 8px;
	padding: 13px;
	border: 1px solid var(--border);
	border-radius: var(--radius-sm);
	background: var(--surface-subtle);
}

.workflow-item__head,
.workflow-item__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.workflow-item__head strong {
	min-width: 0;
	font-size: 12px;
	overflow-wrap: anywhere;
}

.workflow-item p {
	margin: 0;
	color: var(--muted);
	font-size: 11px;
	line-height: 1.55;
}

.workflow-item__meta {
	color: var(--muted);
	font-size: 10px;
}

.workflow-composer {
	margin-top: 12px;
	padding: 11px 13px;
	border: 1px dashed var(--border-strong);
	border-radius: var(--radius-sm);
	background: var(--surface-subtle);
}

.workflow-composer > summary {
	cursor: pointer;
	color: var(--navy-900);
	font-size: 11px;
	font-weight: 800;
}

.workflow-composer[open] > summary {
	margin-bottom: 12px;
}

@media (max-width: 560px) {
	.workflow-item__head,
	.workflow-item__meta {
		align-items: flex-start;
		flex-direction: column;
	}

	.followup-card__actions .button,
	.workflow-item__actions .button {
		flex: 1 1 130px;
	}
}

/* Reports */

.report-intro-actions {
	display: flex;
	flex: 0 0 auto;
	gap: 9px;
}

.report-toolbar {
	display: grid;
	align-items: end;
	margin-bottom: 16px;
	padding: 14px;
	grid-template-columns: auto minmax(150px, 0.55fr) minmax(170px, 0.7fr) minmax(210px, 1fr);
	gap: 12px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-sm);
}

.report-period-field {
	min-width: 0;
	padding: 0;
	border: 0;
}

.report-period-field legend,
.report-toolbar .compact-field > span {
	margin-bottom: 6px;
	color: var(--ink);
	font-size: 10px;
	font-weight: 800;
}

.report-period-options {
	display: flex;
	padding: 3px;
	gap: 2px;
	border: 1px solid var(--border-strong);
	border-radius: 8px;
	background: var(--canvas);
}

.report-period {
	min-height: 34px;
	padding: 0 12px;
	border: 0;
	border-radius: 6px;
	background: transparent;
	color: var(--muted);
	font-size: 11px;
	font-weight: 800;
	cursor: pointer;
}

.report-period:hover,
.report-period.is-active {
	background: var(--surface);
	box-shadow: 0 1px 4px rgba(7, 29, 42, 0.1);
	color: var(--emerald-700);
}

.report-generated {
	align-self: center;
	margin: 17px 0 0;
	color: var(--muted);
	font-size: 10px;
	font-weight: 650;
	text-align: right;
}

.campaign-reports {
	display: grid;
	gap: 16px;
}

.report-kpi-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 11px;
}

.report-kpi-grid > .state-card {
	grid-column: 1 / -1;
}

.report-kpi {
	position: relative;
	min-height: 118px;
	padding: 17px;
	overflow: hidden;
	border: 1px solid var(--border);
	border-top: 3px solid var(--navy-700);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-sm);
}

.report-kpi--emerald {
	border-top-color: var(--emerald-600);
}

.report-kpi--gold {
	border-top-color: var(--gold-500);
}

.report-kpi__label {
	display: block;
	color: var(--muted);
	font-size: 10px;
	font-weight: 850;
	letter-spacing: 0.045em;
	text-transform: uppercase;
}

.report-kpi > strong {
	display: block;
	margin: 10px 0 6px;
	color: var(--navy-900);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 29px;
	font-weight: 600;
	letter-spacing: -0.025em;
	line-height: 1;
}

.report-kpi__meta {
	display: block;
	color: var(--subtle);
	font-size: 9px;
	font-weight: 650;
	line-height: 1.45;
}

.report-kpi--loading {
	display: grid;
	align-content: center;
	gap: 12px;
	border-top-color: var(--border-strong);
}

.report-kpi--loading .skeleton-block:nth-child(1) {
	width: 55%;
}

.report-kpi--loading .skeleton-block:nth-child(2) {
	width: 38%;
	height: 28px;
}

.report-kpi--loading .skeleton-block:nth-child(3) {
	width: 76%;
}

.report-layout {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.65fr);
	gap: 16px;
}

.report-section {
	padding: 20px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-sm);
}

.campaign-reports > .report-section {
	margin-top: 0;
}

.concentration-dashboard .panel-header,
.concentration-report__header {
	align-items: flex-start;
}

.concentration-summary-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 9px;
}

.concentration-summary-grid--dashboard {
	margin-top: 4px;
}

.concentration-summary-card {
	display: grid;
	min-width: 0;
	padding: 13px;
	gap: 4px;
	border: 1px solid var(--border);
	border-left: 3px solid var(--navy-700);
	border-radius: 9px;
	background: var(--canvas);
}

.concentration-summary-card[data-dimension="cnic"] {
	border-left-color: var(--emerald-600);
}

.concentration-summary-card[data-dimension="company"] {
	border-left-color: var(--gold-500);
}

.concentration-summary-card[data-dimension="address"] {
	border-left-color: var(--blue-700);
}

.concentration-summary-card > span {
	overflow: hidden;
	color: var(--muted);
	font-size: 8px;
	font-weight: 850;
	letter-spacing: 0.04em;
	text-overflow: ellipsis;
	text-transform: uppercase;
	white-space: nowrap;
}

.concentration-summary-card > strong {
	color: var(--navy-900);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.1;
}

.concentration-summary-card > small {
	color: var(--subtle);
	font-size: 8px;
	font-weight: 650;
	line-height: 1.4;
}

.concentration-report {
	display: grid;
	gap: 14px;
}

.concentration-controls {
	display: flex;
	align-items: flex-end;
	gap: 9px;
}

.concentration-controls .compact-field {
	min-width: 145px;
}

.concentration-caveat {
	margin: -4px 0 0;
	padding: 9px 11px;
	border-left: 3px solid var(--gold-500);
	background: var(--gold-50);
	color: var(--muted);
	font-size: 9px;
	font-weight: 650;
	line-height: 1.5;
}

.concentration-dimension {
	display: inline-flex;
	align-items: center;
	padding: 3px 7px;
	border-radius: 999px;
	background: var(--canvas-strong);
	color: var(--navy-800);
	font-size: 8px;
	font-weight: 850;
	letter-spacing: 0.035em;
	text-transform: uppercase;
}

.concentration-confidence {
	display: block;
	margin-top: 3px;
	color: var(--subtle);
	font-size: 8px;
	font-weight: 700;
}

.concentration-action {
	white-space: nowrap;
}

.concentration-detail {
	display: grid;
	margin-top: 4px;
	padding: 16px;
	gap: 12px;
	border: 1px solid var(--border-strong);
	border-radius: 10px;
	background: var(--canvas);
	scroll-margin-top: 90px;
}

.concentration-detail[hidden] {
	display: none;
}

.concentration-detail h3,
.concentration-detail p {
	margin: 0;
}

.concentration-detail-copy {
	color: var(--muted);
	font-size: 9px;
}

.concentration-review-actions {
	display: grid;
	align-items: center;
	padding: 11px 12px;
	grid-template-columns: minmax(140px, 1fr) auto;
	gap: 7px 12px;
	border: 1px solid var(--border);
	border-radius: 9px;
	background: var(--surface);
}

.concentration-review-actions[hidden] {
	display: none;
}

.concentration-review-actions > strong {
	color: var(--navy-800);
	font-size: 10px;
}

.concentration-review-actions > span {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 7px;
}

.concentration-review-actions > small {
	grid-column: 1 / -1;
	color: var(--muted);
	font-size: 8px;
	line-height: 1.45;
}

.concentration-assign {
	display: grid;
	align-items: end;
	padding: 12px;
	grid-template-columns: minmax(160px, 0.65fr) minmax(210px, 1fr) auto;
	gap: 10px;
	border: 1px solid #b9dfd2;
	border-radius: 9px;
	background: var(--emerald-50);
}

.concentration-assign[hidden] {
	display: none;
}

.concentration-assign > p {
	grid-column: 1 / -1;
	color: var(--muted);
	font-size: 8px;
	line-height: 1.45;
}

.report-section .panel-header {
	margin-bottom: 14px;
}

.report-section-copy {
	max-width: 680px;
	margin: 4px 0 0;
	color: var(--muted);
	font-size: 10px;
}

.activity-report {
	min-width: 0;
}

.activity-legend {
	display: flex;
	justify-content: flex-end;
	margin-bottom: 4px;
	gap: 14px;
}

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

.activity-legend span::before {
	width: 14px;
	height: 3px;
	border-radius: 2px;
	background: var(--navy-700);
	content: "";
}

.activity-legend [data-series="reached"]::before {
	background: var(--gold-500);
}

.activity-legend [data-series="confirmations"]::before {
	background: var(--emerald-600);
}

.activity-chart {
	display: block;
	width: 100%;
	height: auto;
	overflow: visible;
}

.activity-gridline {
	stroke: var(--border);
	stroke-width: 1;
}

.activity-axis-label {
	fill: var(--subtle);
	font-family: Inter, ui-sans-serif, sans-serif;
	font-size: 9px;
	font-weight: 650;
}

.activity-series {
	fill: none;
	stroke: var(--navy-700);
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2.5;
	vector-effect: non-scaling-stroke;
}

.activity-series--reached {
	stroke: var(--gold-500);
}

.activity-series--confirmations {
	stroke: var(--emerald-600);
}

.pipeline-list,
.report-distribution,
.mix-list {
	display: grid;
	gap: 12px;
}

.pipeline-item > span:first-child,
.mix-item > div {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
}

.pipeline-item strong,
.mix-item strong {
	font-size: 10px;
}

.pipeline-item small,
.mix-item span {
	color: var(--muted);
	font-size: 9px;
	font-weight: 750;
}

.pipeline-track,
.mix-track {
	display: block;
	height: 6px;
	margin-top: 5px;
	overflow: hidden;
	border-radius: 4px;
	background: var(--canvas-strong);
}

.pipeline-track > span,
.mix-track > span {
	display: block;
	height: 100%;
	min-width: 2px;
	border-radius: inherit;
	background: var(--navy-700);
}

.pipeline-item[data-tone="red"] .pipeline-track > span {
	background: var(--red-700);
}

.pipeline-item[data-tone="gold"] .pipeline-track > span {
	background: var(--gold-500);
}

.pipeline-item[data-tone="emerald"] .pipeline-track > span {
	background: var(--emerald-600);
}

.pipeline-item[data-tone="muted"] .pipeline-track > span {
	background: var(--subtle);
}

.mix-item:nth-child(5n + 1) .mix-track > span {
	background: var(--emerald-600);
}

.mix-item:nth-child(5n + 2) .mix-track > span {
	background: var(--gold-500);
}

.mix-item:nth-child(5n + 3) .mix-track > span {
	background: var(--blue-700);
}

.mix-item:nth-child(5n + 4) .mix-track > span {
	background: var(--orange-700);
}

.mix-item:nth-child(5n) .mix-track > span {
	background: var(--subtle);
}

.class-report-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}

.class-report-card {
	padding: 13px;
	border: 1px solid var(--border);
	border-radius: 9px;
	background: var(--canvas);
}

.class-report-card > div:first-child {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	gap: 3px 10px;
}

.class-report-card > div:first-child > strong {
	grid-row: span 2;
	color: var(--navy-900);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 24px;
}

.class-report-card > div:first-child > small {
	color: var(--subtle);
	font-size: 8px;
}

.class-report-card dl {
	display: grid;
	margin: 12px 0 0;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
}

.class-report-card dl > div {
	padding-top: 7px;
	border-top: 1px solid var(--border);
}

.class-report-card dt {
	color: var(--subtle);
	font-size: 8px;
	font-weight: 800;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.class-report-card dd {
	margin: 2px 0 0;
	font-size: 11px;
	font-weight: 800;
}

.mix-report-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

.mix-report-grid h3 {
	margin: 0 0 12px;
	color: var(--navy-800);
	font-size: 11px;
}

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

.readiness-item {
	display: flex;
	min-width: 0;
	align-items: center;
	padding: 10px;
	gap: 10px;
	border: 1px solid var(--border);
	border-radius: 8px;
	background: var(--canvas);
}

.readiness-item > span:first-child {
	display: flex;
	min-width: 44px;
	flex-direction: column;
	color: var(--navy-800);
}

.readiness-item > span:last-child {
	display: flex;
	min-width: 0;
	flex-direction: column;
}

.readiness-item strong {
	font-family: Georgia, "Times New Roman", serif;
	font-size: 18px;
}

.readiness-item b {
	overflow: hidden;
	font-size: 9px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.readiness-item small {
	color: var(--subtle);
	font-size: 7px;
	font-weight: 700;
}

.readiness-item[data-tone="good"] {
	border-color: #b9dfd2;
	background: var(--emerald-50);
}

.readiness-item[data-tone="danger"] {
	border-color: #efd0d4;
	background: var(--red-50);
}

.report-table-wrap {
	overflow-x: auto;
	border: 1px solid var(--border);
	border-radius: 9px;
}

.report-table-wrap > .state-card {
	border: 0;
}

.report-table {
	width: 100%;
	min-width: 880px;
	border-collapse: collapse;
	table-layout: auto;
}

.report-table th {
	padding: 9px 10px;
	border-bottom: 1px solid var(--border-strong);
	background: var(--canvas);
	color: var(--muted);
	font-size: 8px;
	font-weight: 850;
	letter-spacing: 0.045em;
	text-align: left;
	text-transform: uppercase;
	white-space: nowrap;
}

.report-table td {
	padding: 10px;
	border-bottom: 1px solid var(--border);
	font-size: 10px;
	vertical-align: middle;
}

.report-table tbody tr:last-child td {
	border-bottom: 0;
}

.report-table tbody tr:hover {
	background: var(--emerald-50);
}

.report-table .is-numeric {
	text-align: right;
}

.report-row-title {
	display: block;
	max-width: 250px;
	overflow: hidden;
	color: var(--navy-800);
	font-size: 10px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.report-table-value {
	font-variant-numeric: tabular-nums;
	font-weight: 750;
}

.report-table-value.is-emphasis,
.report-yield {
	color: var(--emerald-700);
	font-weight: 850;
}

.report-rate {
	display: inline-grid;
	min-width: 100px;
	align-items: center;
	grid-template-columns: 55px auto;
	gap: 7px;
}

.report-rate > span {
	display: block;
	height: 5px;
	overflow: hidden;
	border-radius: 3px;
	background: var(--canvas-strong);
}

.report-rate i {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: var(--emerald-600);
}

.report-rate strong {
	font-size: 9px;
}

.report-insufficient {
	color: var(--subtle);
	font-size: 8px;
	font-weight: 750;
}

.report-sample-note {
	max-width: 190px;
	padding: 5px 8px;
	border-radius: 12px;
	background: var(--gold-50);
	color: var(--gold-600);
	font-size: 8px;
	font-weight: 750;
	text-align: right;
}

/* Voter detail drawer */

.drawer-backdrop {
	position: fixed;
	inset: 0;
	z-index: 50;
	background: rgba(7, 29, 42, 0.5);
	backdrop-filter: blur(2px);
	animation: backdrop-in 0.18s ease-out;
}

@keyframes backdrop-in {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

.voter-drawer {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 55;
	display: flex;
	width: min(100%, 570px);
	flex-direction: column;
	background: var(--surface);
	box-shadow: var(--shadow-lg);
	animation: drawer-in 0.22s ease-out;
}

@keyframes drawer-in {
	from {
		transform: translateX(100%);
	}
	to {
		transform: translateX(0);
	}
}

.drawer-header {
	display: flex;
	min-height: 92px;
	align-items: center;
	justify-content: space-between;
	padding: 17px 20px;
	gap: 15px;
	border-bottom: 1px solid var(--border);
}

.drawer-header > div {
	min-width: 0;
}

.drawer-header h2 {
	overflow: hidden;
	margin: 0;
	color: var(--navy-900);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 22px;
	font-weight: 600;
	letter-spacing: -0.02em;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.drawer-header p:last-child {
	overflow: hidden;
	margin: 3px 0 0;
	color: var(--muted);
	font-size: 10px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.drawer-header .icon-button {
	flex: 0 0 auto;
}

#drawer-alert {
	margin: 12px 20px 0;
}

.drawer-content {
	min-height: 0;
	padding: 18px 20px 32px;
	flex: 1;
	overflow-y: auto;
	overscroll-behavior: contain;
}

.drawer-summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 15px;
	padding: 13px;
	gap: 12px;
	border: 1px solid var(--border);
	border-radius: 9px;
	background: var(--canvas);
}

.drawer-summary__copy {
	display: flex;
	min-width: 0;
	align-items: center;
	gap: 10px;
}

.drawer-summary__copy > div:last-child {
	display: flex;
	min-width: 0;
	flex-direction: column;
}

.drawer-summary__copy strong {
	overflow: hidden;
	font-size: 12px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.drawer-summary__copy span {
	margin-top: 2px;
	color: var(--muted);
	font-size: 9px;
}

.detail-section {
	margin-top: 20px;
}

.detail-section__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 9px;
	gap: 10px;
}

.detail-section h3 {
	margin: 0;
	color: var(--navy-800);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.detail-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	border: 1px solid var(--border);
	border-radius: 9px;
	overflow: hidden;
}

.detail-field {
	display: flex;
	min-width: 0;
	min-height: 62px;
	padding: 10px 12px;
	flex-direction: column;
	justify-content: center;
	border-right: 1px solid var(--border);
	border-bottom: 1px solid var(--border);
}

.detail-field:nth-child(2n) {
	border-right: 0;
}

.detail-field:nth-last-child(-n + 2) {
	border-bottom: 0;
}

.detail-field--wide {
	grid-column: 1 / -1;
	border-right: 0;
}

.detail-field--wide:nth-last-child(2) {
	border-bottom: 1px solid var(--border);
}

.detail-field span {
	color: var(--subtle);
	font-size: 8px;
	font-weight: 850;
	letter-spacing: 0.045em;
	text-transform: uppercase;
}

.detail-field strong,
.detail-field a {
	overflow-wrap: anywhere;
	margin-top: 3px;
	color: var(--ink);
	font-size: 11px;
	font-weight: 700;
	text-decoration: none;
}

.detail-field a:hover {
	color: var(--emerald-700);
	text-decoration: underline;
}

.status-actions {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 7px;
}

.detail-section__head--status {
	align-items: flex-start;
}

.detail-section__head--status > div {
	min-width: 0;
}

.status-selection-copy {
	max-width: 360px;
	margin: 3px 0 0;
	color: var(--muted);
	font-size: 9px;
	line-height: 1.45;
}

.status-action {
	position: relative;
	display: flex;
	min-height: 43px;
	align-items: center;
	justify-content: center;
	padding: 7px 18px 7px 8px;
	flex-direction: column;
	gap: 1px;
	border: 1px solid var(--border);
	border-radius: 7px;
	background: var(--surface);
	color: var(--muted);
	font-size: 9px;
	font-weight: 850;
	line-height: 1.2;
	text-align: center;
	cursor: pointer;
}

.status-action::before {
	position: absolute;
	top: 9px;
	right: 8px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: currentColor;
	content: "";
}

.status-action:hover,
.status-action.is-saved {
	border-color: currentColor;
	background: var(--canvas);
}

.status-action.is-selected {
	border-color: currentColor;
	background: color-mix(in srgb, currentColor 10%, var(--surface));
	box-shadow: 0 0 0 2px color-mix(in srgb, currentColor 20%, transparent);
}

.status-action__label {
	font-size: 9px;
	font-weight: 850;
}

.status-action__state {
	color: var(--muted);
	font-size: 7px;
	font-weight: 750;
}

.status-action.is-selected .status-action__state {
	color: currentColor;
}

.status-action[data-status-slug="confirmed"],
.status-action[data-status-slug="100-confirmed"] {
	color: var(--emerald-700);
}
.status-action[data-status-slug="positive"] {
	color: #337356;
}
.status-action[data-status-slug="maybe"] {
	color: var(--gold-600);
}
.status-action[data-status-slug="needs-follow-up"] {
	color: var(--orange-700);
}
.status-action[data-status-slug="not-supporting"] {
	color: var(--red-700);
}
.status-action[data-status-slug="uncontacted"] {
	color: var(--muted);
}

.status-selection-feedback {
	margin: 9px 0 0;
	padding: 7px 9px;
	border-left: 3px solid var(--gold-500);
	background: var(--gold-50);
	color: #74500a;
	font-size: 9px;
}

.contact-form {
	display: grid;
	padding: 14px;
	gap: 12px;
	border: 1px solid #bcd9cf;
	border-radius: 9px;
	background: var(--emerald-50);
}

.contact-form .field input,
.contact-form .field textarea,
.contact-form .field select {
	background: #fff;
}

.contact-form__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 9px;
}

.form-hint {
	margin: -4px 0 0;
	color: var(--muted);
	font-size: 9px;
}

.contact-form__save {
	display: grid;
	padding-top: 4px;
	gap: 8px;
	border-top: 1px solid #bcd9cf;
}

.contact-save-feedback {
	margin: 0;
	color: var(--muted);
	font-size: 9px;
	font-weight: 650;
}

.contact-save-feedback[data-kind="pending"] {
	color: #74500a;
}

.contact-save-feedback[data-kind="saved"] {
	color: var(--emerald-700);
}

.drawer-save-dock {
	display: none;
}

.timeline {
	position: relative;
	display: grid;
	padding-left: 15px;
	gap: 12px;
}

.timeline::before {
	position: absolute;
	top: 6px;
	bottom: 6px;
	left: 4px;
	width: 1px;
	background: var(--border-strong);
	content: "";
}

.timeline-item {
	position: relative;
	padding: 0 0 2px 8px;
}

.timeline-item::before {
	position: absolute;
	top: 5px;
	left: -14px;
	width: 7px;
	height: 7px;
	border: 2px solid var(--surface);
	border-radius: 50%;
	background: var(--emerald-600);
	box-shadow: 0 0 0 1px var(--emerald-600);
	content: "";
}

.timeline-item__head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
}

.timeline-item__head strong {
	font-size: 10px;
}

.timeline-item__head time {
	flex: 0 0 auto;
	color: var(--subtle);
	font-size: 8px;
}

.timeline-item p {
	margin: 3px 0 0;
	color: var(--muted);
	font-size: 10px;
	line-height: 1.45;
	white-space: pre-wrap;
}

.linked-list {
	display: grid;
	gap: 7px;
}

.linked-record {
	display: flex;
	min-height: 45px;
	align-items: center;
	justify-content: space-between;
	padding: 7px 9px;
	gap: 9px;
	border: 1px solid var(--border);
	border-radius: 7px;
	background: var(--canvas);
	cursor: pointer;
}

.linked-record:hover {
	border-color: #a9c8bc;
}

.linked-record > span:first-child {
	display: flex;
	min-width: 0;
	flex-direction: column;
}

.linked-record strong {
	overflow: hidden;
	font-size: 10px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.linked-record small {
	margin-top: 2px;
	color: var(--muted);
	font-size: 8px;
}

/* Toasts and mobile nav */

.toast-region {
	position: fixed;
	right: 18px;
	bottom: 18px;
	z-index: 100;
	display: grid;
	width: min(calc(100% - 36px), 360px);
	gap: 8px;
	pointer-events: none;
}

.toast {
	display: flex;
	min-height: 48px;
	align-items: center;
	padding: 10px 13px;
	gap: 9px;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 9px;
	background: var(--navy-950);
	box-shadow: var(--shadow-md);
	color: #fff;
	font-size: 11px;
	font-weight: 650;
	pointer-events: auto;
	animation: toast-in 0.18s ease-out;
}

.toast::before {
	width: 7px;
	height: 7px;
	flex: 0 0 auto;
	border-radius: 50%;
	background: #7ee0c4;
	content: "";
}

.toast[data-kind="error"]::before {
	background: #ff9ca6;
}

@keyframes toast-in {
	from {
		opacity: 0;
		transform: translateY(8px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.mobile-nav {
	display: none;
}

/* Responsive */

@media (max-width: 1180px) {
	:root {
		--sidebar-width: 218px;
	}

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

	.filter-row {
		grid-template-columns: repeat(3, minmax(130px, 1fr));
	}

	.report-grid,
	.followup-board {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.report-toolbar {
		grid-template-columns: auto minmax(150px, 1fr) minmax(170px, 1fr);
	}

	.report-generated {
		grid-column: 1 / -1;
		margin-top: 0;
		text-align: left;
	}

	.voter-card-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 860px) {
	:root {
		--topbar-height: 69px;
	}

	.auth-screen {
		grid-template-columns: 1fr;
	}

	.auth-brand {
		display: none;
	}

	.auth-card__brand {
		display: flex;
	}

	.auth-panel {
		padding: 34px 22px;
		background: radial-gradient(circle at 90% 5%, rgba(13, 138, 109, 0.1), transparent 30%),
			var(--surface);
	}

	.crm-shell {
		display: block;
		padding-bottom: 68px;
	}

	.sidebar {
		display: none;
	}

	.workspace {
		grid-column: auto;
	}

	.topbar {
		padding: 0 17px;
	}

	.topbar .eyebrow {
		display: none;
	}

	.topbar h1 {
		font-size: 21px;
	}

	.user-copy,
	.user-button > svg {
		display: none;
	}

	.user-button {
		padding: 3px;
	}

	.main-content {
		min-height: calc(100vh - var(--topbar-height) - 68px);
		padding: 19px 15px 30px;
	}

	.mobile-nav {
		position: fixed;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 35;
		display: grid;
		height: calc(64px + env(safe-area-inset-bottom));
		padding: 5px 8px env(safe-area-inset-bottom);
		grid-template-columns: repeat(4, 1fr);
		border-top: 1px solid var(--border);
		background: rgba(255, 255, 255, 0.97);
		box-shadow: 0 -8px 30px rgba(7, 29, 42, 0.07);
		backdrop-filter: blur(12px);
	}

	.mobile-nav button {
		display: flex;
		min-width: 0;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		gap: 3px;
		border: 0;
		border-radius: 7px;
		background: transparent;
		color: var(--muted);
		font-size: 9px;
		font-weight: 800;
		cursor: pointer;
	}

	.mobile-nav button.is-active {
		background: var(--emerald-50);
		color: var(--emerald-700);
	}

	.mobile-nav svg {
		width: 19px;
		height: 19px;
	}

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

	.panel--span-2 {
		grid-column: auto;
	}

	.followup-item {
		grid-template-columns: minmax(0, 1fr) auto;
	}

	.followup-item .followup-meta {
		display: none;
	}

	.search-panel {
		padding: 13px;
	}

	.filter-row {
		grid-template-columns: repeat(2, minmax(120px, 1fr));
	}

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

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

	.report-toolbar {
		grid-template-columns: 1fr 1fr;
	}

	.report-period-field,
	.report-generated {
		grid-column: 1 / -1;
	}

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

	.concentration-report__header {
		align-items: stretch;
		flex-direction: column;
	}

	.concentration-assign {
		grid-template-columns: 1fr 1fr;
	}

	.concentration-assign .button {
		grid-column: 1 / -1;
	}

	.toast-region {
		bottom: calc(76px + env(safe-area-inset-bottom));
	}
}

@media (max-width: 580px) {
	.boot-card {
		padding: 30px 22px;
	}

	.auth-panel {
		align-items: start;
		padding-top: 23px;
	}

	.panel-heading h2 {
		font-size: 27px;
	}

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

	.topbar-actions {
		gap: 5px;
	}

	.summary-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 9px;
	}

	.summary-card {
		min-height: 118px;
		padding: 15px;
	}

	.summary-card__icon {
		top: 11px;
		right: 11px;
		width: 27px;
		height: 27px;
	}

	.summary-card__label {
		font-size: 9px;
	}

	.summary-card__value {
		margin-top: 14px;
		font-size: 27px;
	}

	.panel {
		padding: 16px;
	}

	.search-panel {
		grid-template-columns: 1fr;
	}

	.search-panel > .button {
		width: 100%;
	}

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

	.filter-row .button {
		width: 100%;
	}

	.search-shortcut,
	.view-switcher {
		display: none;
	}

	.search-field input {
		padding-right: 10px;
	}

	.voter-results[data-layout="table"] .voter-table-wrap {
		display: none;
	}

	.voter-results[data-layout="table"] .voter-card-grid {
		display: grid;
	}

	.voter-card-grid,
	.followup-board,
	.report-grid {
		grid-template-columns: 1fr;
	}

	.report-intro-actions {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}

	.report-intro-actions .button {
		width: 100%;
	}

	.report-toolbar {
		grid-template-columns: 1fr;
	}

	.report-period-field,
	.report-generated {
		grid-column: auto;
	}

	.report-period-options {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
	}

	.report-kpi-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.report-kpi {
		min-height: 112px;
		padding: 14px;
	}

	.report-kpi > strong {
		font-size: 25px;
	}

	.concentration-controls,
	.concentration-assign {
		display: grid;
		grid-template-columns: 1fr;
	}

	.concentration-controls .compact-field {
		min-width: 0;
	}

	.concentration-assign .button,
	.concentration-assign > p {
		grid-column: auto;
	}

	.concentration-review-actions {
		grid-template-columns: 1fr;
	}

	.concentration-review-actions > span {
		justify-content: flex-start;
	}

	.concentration-review-actions > small {
		grid-column: auto;
	}

	.report-section {
		padding: 16px;
	}

	.activity-legend {
		justify-content: flex-start;
		flex-wrap: wrap;
	}

	.class-report-grid,
	.mix-report-grid {
		grid-template-columns: 1fr;
	}

	.report-sample-note {
		display: none;
	}

	.voter-card-grid {
		padding: 9px;
	}

	.section-intro {
		align-items: stretch;
		flex-direction: column;
		gap: 12px;
	}

	.section-intro .button {
		width: 100%;
	}

	.queue-filters {
		width: 100%;
		overflow-x: auto;
	}

	.queue-filter {
		flex: 1 0 auto;
	}

	.voter-drawer {
		top: 5vh;
		width: 100%;
		border-radius: 17px 17px 0 0;
	}

	.drawer-header {
		min-height: 82px;
		padding: 14px 16px;
	}

	.drawer-header::before {
		position: absolute;
		top: 7px;
		left: 50%;
		width: 36px;
		height: 4px;
		border-radius: 4px;
		background: var(--border-strong);
		content: "";
		transform: translateX(-50%);
	}

	.drawer-content {
		padding: 15px 16px 24px;
	}

	.drawer-save-dock:not([hidden]) {
		position: relative;
		z-index: 4;
		display: grid;
		padding: 9px 16px calc(10px + env(safe-area-inset-bottom));
		gap: 6px;
		border-top: 1px solid var(--border-strong);
		background: rgba(255, 255, 255, 0.98);
		box-shadow: 0 -10px 28px rgba(7, 29, 42, 0.12);
		backdrop-filter: blur(12px);
	}

	.drawer-save-dock span {
		overflow: hidden;
		color: var(--muted);
		font-size: 9px;
		font-weight: 700;
		text-align: center;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.drawer-save-dock span[data-kind="pending"] {
		color: #74500a;
	}

	.drawer-save-dock span[data-kind="saved"] {
		color: var(--emerald-700);
	}

	.drawer-save-dock .button {
		min-height: 50px;
		font-size: 14px;
	}

	.contact-form__save .button {
		display: none;
	}

	#drawer-alert {
		margin-right: 16px;
		margin-left: 16px;
	}

	.status-actions {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

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

	.detail-field,
	.detail-field:nth-child(2n),
	.detail-field:nth-last-child(-n + 2) {
		border-right: 0;
		border-bottom: 1px solid var(--border);
	}

	.detail-field:last-child {
		border-bottom: 0;
	}
}

@media (max-width: 380px) {
	.summary-grid {
		grid-template-columns: 1fr;
	}

	.summary-card {
		min-height: 108px;
	}

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

	.report-kpi-grid,
	.readiness-grid,
	.report-intro-actions {
		grid-template-columns: 1fr;
	}
}

/* Election-day command center */

.nav-live-dot {
	margin-left: auto;
	padding: 2px 7px;
	border-radius: 999px;
	background: #7ee0c4;
	color: var(--navy-950);
	font-size: 9px;
	font-weight: 900;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.election-view {
	display: grid;
	gap: 18px;
}

.election-hero {
	position: relative;
	display: flex;
	min-height: 180px;
	align-items: flex-end;
	justify-content: space-between;
	padding: clamp(22px, 4vw, 36px);
	gap: 24px;
	overflow: hidden;
	border: 1px solid rgba(126, 224, 196, 0.18);
	border-radius: var(--radius-lg);
	background: radial-gradient(circle at 83% 10%, rgba(126, 224, 196, 0.18), transparent 38%),
		linear-gradient(135deg, var(--navy-950), var(--navy-800));
	box-shadow: var(--shadow-md);
	color: #fff;
}

.election-hero::after {
	position: absolute;
	top: -65px;
	right: -50px;
	width: 220px;
	height: 220px;
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 50%;
	content: "";
}

.election-hero > * {
	position: relative;
	z-index: 1;
}

.election-hero .eyebrow {
	color: #7ee0c4;
}

.election-hero h2 {
	margin: 4px 0 8px;
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(28px, 4vw, 42px);
	font-weight: 600;
	letter-spacing: -0.035em;
	line-height: 1.05;
}

.election-hero__meta {
	max-width: 680px;
	margin: 0;
	color: #b9cbd3;
}

.election-hero__status,
.election-hero__actions,
.button-row {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
}

.election-hero__status {
	margin-bottom: 16px;
}

.election-hero__actions {
	justify-content: flex-end;
}

.election-hero .button--secondary {
	border-color: rgba(255, 255, 255, 0.34);
	background: #fff;
	color: var(--navy-900);
}

.election-hero .button--ghost {
	border-color: rgba(255, 255, 255, 0.22);
	background: rgba(255, 255, 255, 0.07);
	color: #fff;
}

.status-chip,
.live-indicator {
	display: inline-flex;
	min-height: 27px;
	align-items: center;
	padding: 4px 10px;
	gap: 6px;
	border-radius: 999px;
	font-size: 10px;
	font-weight: 900;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.status-chip {
	border: 1px solid var(--border-strong);
	background: var(--canvas);
	color: var(--navy-800);
}

.election-hero .status-chip {
	border-color: rgba(126, 224, 196, 0.32);
	background: rgba(13, 138, 109, 0.2);
	color: #a6f1dc;
}

.live-indicator {
	color: #d7e4e9;
}

.live-indicator::before {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--gold-500);
	content: "";
}

.live-indicator[data-state="live"]::before {
	background: #54d7b3;
	box-shadow: 0 0 0 4px rgba(84, 215, 179, 0.12);
}

.live-indicator[data-state="offline"]::before {
	background: #ff9aa5;
}

.election-kpi-grid {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 11px;
}

.election-kpi {
	position: relative;
	min-height: 122px;
	padding: 18px;
	overflow: hidden;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-sm);
}

.election-kpi::after {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 3px;
	background: var(--kpi-color, var(--emerald-600));
	content: "";
}

.election-kpi[data-tone="gold"] {
	--kpi-color: var(--gold-500);
}

.election-kpi[data-tone="blue"] {
	--kpi-color: var(--blue-700);
}

.election-kpi[data-tone="red"] {
	--kpi-color: var(--red-700);
}

.election-kpi > span,
.election-sync-bar span,
.offline-registration-packet p span {
	display: block;
	color: var(--muted);
	font-size: 11px;
}

.election-kpi > strong {
	display: block;
	margin: 12px 0 2px;
	color: var(--navy-900);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 31px;
	line-height: 1;
}

.election-kpi > small {
	color: var(--subtle);
	font-size: 10px;
}

.election-command-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.75fr);
	gap: 18px;
}

.election-panel--wide {
	grid-row: span 2;
}

.election-panel .panel-header,
.election-map-panel .panel-header,
.election-offline-panel .panel-header {
	margin-bottom: 18px;
}

.election-funnel {
	display: grid;
	gap: 15px;
}

.election-funnel__row {
	display: grid;
	grid-template-columns: minmax(95px, 0.7fr) minmax(160px, 2fr) auto;
	align-items: center;
	gap: 12px;
}

.election-funnel__row > span {
	font-size: 12px;
	font-weight: 750;
}

.election-funnel__bar,
.election-map__bar {
	height: 9px;
	overflow: hidden;
	border-radius: 99px;
	background: var(--canvas-strong);
}

.election-funnel__bar i,
.election-map__bar i {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: linear-gradient(90deg, var(--emerald-600), #52c9aa);
}

.election-funnel__row > strong {
	min-width: 42px;
	color: var(--navy-900);
	font-size: 12px;
	text-align: right;
}

.election-trend {
	display: grid;
	gap: 8px;
}

.election-trend__item {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	padding: 9px 0;
	gap: 10px;
	border-bottom: 1px solid var(--border);
}

.election-trend__item:last-child {
	border-bottom: 0;
}

.election-trend__item time {
	color: var(--subtle);
	font-size: 10px;
}

.election-trend__item span {
	font-size: 11px;
}

.election-trend__item strong {
	color: var(--emerald-700);
	font-size: 12px;
}

.election-task-list,
.election-voter-results,
.election-map {
	display: grid;
	gap: 10px;
}

.election-scope-panel {
	padding: clamp(18px, 3vw, 28px);
}

.election-scope-breakdown {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
}

.election-scope-card {
	display: grid;
	padding: 15px;
	gap: 13px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--canvas);
}

.election-scope-card > div:first-child {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
}

.election-scope-card > div:first-child strong {
	color: var(--navy-900);
	font-size: 12px;
}

.election-scope-card > div:first-child span,
.election-scope-card dt {
	color: var(--muted);
	font-size: 9px;
}

.election-scope-card dl {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin: 0;
	gap: 8px;
}

.election-scope-card dt,
.election-scope-card dd {
	margin: 0;
}

.election-scope-card dd {
	margin-top: 2px;
	color: var(--navy-900);
	font-size: 15px;
	font-weight: 850;
}

.election-task {
	padding: 13px;
	border: 1px solid var(--border);
	border-left: 3px solid var(--gold-500);
	border-radius: var(--radius-sm);
	background: var(--canvas);
}

.election-task[data-priority="Critical"] {
	border-left-color: var(--red-700);
}

.election-task__head,
.election-voter-card__head,
.election-voter-card__foot,
.election-map__head,
.election-sync-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.election-task h3,
.election-voter-card h3 {
	margin: 0;
	color: var(--navy-900);
	font-size: 13px;
}

.election-task p {
	margin: 6px 0;
	color: var(--muted);
	font-size: 11px;
}

.election-task__meta,
.election-voter-card__meta,
.election-voter-card__actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 7px;
}

.election-task__meta span,
.election-voter-card__meta span,
.election-status {
	padding: 3px 7px;
	border-radius: 999px;
	background: var(--navy-100);
	color: var(--navy-800);
	font-size: 9px;
	font-weight: 800;
}

.election-task .button {
	min-height: 31px;
	margin-top: 9px;
	padding: 5px 10px;
	font-size: 10px;
}

.election-voter-panel,
.election-map-panel,
.election-offline-panel {
	padding: clamp(18px, 3vw, 28px);
}

.election-search {
	display: grid;
	grid-template-columns: minmax(250px, 1fr) minmax(130px, 0.32fr) minmax(130px, 0.32fr) auto;
	align-items: end;
	padding: 13px;
	gap: 10px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--canvas);
}

.election-search .search-field {
	height: 42px;
}

.election-search .compact-field input,
.election-search .compact-field select {
	width: 100%;
	height: 42px;
	border: 1px solid var(--border-strong);
	border-radius: var(--radius-sm);
	background: var(--surface);
}

.election-voter-card {
	display: grid;
	padding: 15px;
	gap: 11px;
	border: 1px solid var(--border);
	border-radius: var(--radius);
	background: var(--surface);
	box-shadow: var(--shadow-sm);
}

.election-voter-card__identity {
	display: flex;
	min-width: 0;
	align-items: center;
	gap: 10px;
}

.election-voter-card__identity .avatar {
	width: 39px;
	height: 39px;
}

.election-voter-card__identity p {
	margin: 2px 0 0;
	color: var(--muted);
	font-size: 10px;
}

.election-voter-card__foot {
	padding-top: 10px;
	border-top: 1px solid var(--border);
}

.election-voter-card__foot small {
	color: var(--subtle);
}

.election-voter-card .button {
	min-height: 34px;
	padding: 6px 11px;
	font-size: 10px;
}

.election-map__row {
	display: grid;
	grid-template-columns: minmax(150px, 0.7fr) minmax(180px, 1.4fr) auto;
	align-items: center;
	padding: 10px 0;
	gap: 14px;
	border-bottom: 1px solid var(--border);
}

.election-map__row:last-child {
	border-bottom: 0;
}

.election-map__head strong {
	color: var(--navy-900);
}

.election-map__head span,
.election-map__row > small {
	color: var(--muted);
	font-size: 10px;
}

.election-map__row > small {
	text-align: right;
}

.election-offline-panel {
	border-color: #cbdce3;
	background: linear-gradient(180deg, #fff, #f8fbfc);
}

.election-offline-grid {
	display: grid;
	grid-template-columns: minmax(260px, 0.7fr) minmax(320px, 1.3fr);
	align-items: start;
	gap: 20px;
}

.offline-registration-packet {
	padding: 16px;
	border: 1px dashed var(--border-strong);
	border-radius: var(--radius);
	background: var(--surface);
}

.offline-registration-packet p {
	margin: 0 0 12px;
}

.offline-registration-packet dl {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: 0 0 12px;
	gap: 8px;
}

.offline-registration-packet dt {
	color: var(--subtle);
	font-size: 9px;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.offline-registration-packet dd {
	margin: 2px 0 0;
	overflow: hidden;
	font-size: 10px;
	font-weight: 750;
	text-overflow: ellipsis;
}

.offline-registration-packet textarea {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 9px;
	word-break: break-all;
}

.election-sync-bar {
	margin-top: 20px;
	padding-top: 16px;
	border-top: 1px solid var(--border);
}

.election-sync-bar > div:first-child {
	min-width: 0;
}

.button--danger-ghost {
	border: 1px solid var(--red-100);
	background: var(--red-50);
	color: var(--red-700);
}

.offline-sync-receipt {
	margin-top: 12px;
	color: var(--muted);
	font-size: 11px;
}

.election-action-dialog {
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 101;
	width: min(calc(100% - 30px), 520px);
	max-height: min(760px, calc(100vh - 36px));
	padding: 24px;
	overflow: auto;
	border: 1px solid var(--border);
	border-radius: var(--radius-lg);
	background: var(--surface);
	box-shadow: var(--shadow-lg);
	transform: translate(-50%, -50%);
}

.election-action-dialog > header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
}

.election-action-dialog h2 {
	margin: 2px 0 4px;
	color: var(--navy-900);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 25px;
}

.election-action-dialog header p:last-child {
	margin: 0 0 18px;
	color: var(--muted);
}

.election-empty {
	padding: 24px;
	border: 1px dashed var(--border-strong);
	border-radius: var(--radius);
	background: var(--canvas);
	color: var(--muted);
	text-align: center;
}

@media (max-width: 1180px) {
	.election-kpi-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.election-command-grid {
		grid-template-columns: 1fr 1fr;
	}

	.election-panel--wide {
		grid-column: 1 / -1;
		grid-row: auto;
	}

	.election-search {
		grid-template-columns: minmax(240px, 1fr) repeat(2, minmax(130px, 0.42fr));
	}

	.election-search > .button {
		grid-column: 1 / -1;
		width: 100%;
	}
}

@media (max-width: 860px) {
	.mobile-nav.has-election {
		grid-template-columns: repeat(5, 1fr);
	}

	.mobile-nav.election-only {
		grid-template-columns: 1fr;
	}

	.election-hero {
		min-height: 210px;
		align-items: flex-start;
		flex-direction: column;
	}

	.election-hero__actions {
		width: 100%;
		justify-content: flex-start;
	}

	.election-kpi-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.election-command-grid,
	.election-offline-grid {
		grid-template-columns: 1fr;
	}

	.election-scope-breakdown {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.election-search {
		grid-template-columns: 1fr 1fr;
	}

	.election-search .search-field {
		grid-column: 1 / -1;
	}
}

@media (max-width: 580px) {
	.election-view {
		gap: 12px;
	}

	.election-hero {
		min-height: 0;
		padding: 21px 18px;
	}

	.election-hero h2 {
		font-size: 30px;
	}

	.election-hero__actions .button {
		width: 100%;
	}

	.election-kpi-grid {
		gap: 8px;
	}

	.election-kpi {
		min-height: 105px;
		padding: 14px;
	}

	.election-kpi > strong {
		font-size: 25px;
	}

	.election-command-grid {
		gap: 12px;
	}

	.election-scope-breakdown {
		grid-template-columns: 1fr;
	}

	.election-funnel__row {
		grid-template-columns: minmax(85px, 0.7fr) minmax(80px, 1fr) auto;
		gap: 7px;
	}

	.election-search {
		grid-template-columns: 1fr;
	}

	.election-search .search-field,
	.election-search > .button {
		grid-column: auto;
	}

	.election-voter-card__head,
	.election-voter-card__foot,
	.election-sync-bar,
	.election-map__row {
		align-items: stretch;
		flex-direction: column;
	}

	.election-voter-card__actions .button,
	.election-sync-bar .button,
	.election-sync-bar .button-row {
		width: 100%;
	}

	.election-map__row {
		display: grid;
		grid-template-columns: 1fr auto;
	}

	.election-map__bar {
		grid-column: 1 / -1;
		grid-row: 2;
	}

	.offline-registration-packet dl {
		grid-template-columns: 1fr;
	}

	.election-action-dialog {
		top: auto;
		bottom: 0;
		width: 100%;
		max-height: 90vh;
		padding: 20px 17px calc(20px + env(safe-area-inset-bottom));
		border-radius: 18px 18px 0 0;
		transform: translateX(-50%);
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

@media print {
	.sidebar,
	.topbar-actions,
	.mobile-nav,
	.search-panel,
	.view-switcher,
	.drawer-backdrop,
	.voter-drawer,
	.modal-backdrop,
	.install-guide,
	.toast-region,
	.button,
	.link-button,
	.report-toolbar,
	.report-intro-actions {
		display: none !important;
	}

	body,
	.crm-shell,
	.workspace,
	.main-content {
		display: block;
		min-height: 0;
		background: #fff;
	}

	.main-content {
		width: 100%;
		padding: 15px;
	}

	.panel,
	.report-section,
	.summary-card {
		box-shadow: none;
		break-inside: avoid;
	}
}