.pdi-app {
	--pdi-ink: #1f2933;
	--pdi-soft: #3f4a54;
	--pdi-muted: #6b7280;
	--pdi-paper: #fffdf8;
	--pdi-surface: #ffffff;
	--pdi-warm: #faf3ea;
	--pdi-border: #e8ded2;
	--pdi-rose: #a33a4a;
	--pdi-rose-hover: #842d3a;
	--pdi-teal: #2f7d73;
	--pdi-teal-soft: #e5f3f0;
	--pdi-danger: #b42318;
	--pdi-danger-soft: #fde7e5;
	--pdi-info-soft: #e6f0fa;
	color: var(--pdi-ink);
	font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	background: linear-gradient(180deg, var(--pdi-paper), #f6f1ea);
	margin: 0 calc(50% - 50vw);
	min-height: 100vh;
	padding: 24px 16px 40px;
}

.pdi-shell {
	max-width: 920px;
	margin: 0 auto;
}

.pdi-hero {
	display: grid;
	gap: 12px;
	margin-bottom: 18px;
}

.pdi-eyebrow {
	color: var(--pdi-teal);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.pdi-hero h1,
.pdi-config-missing h1 {
	font-size: clamp(28px, 5vw, 44px);
	line-height: 1.08;
	margin: 0;
	max-width: 760px;
}

.pdi-hero p,
.pdi-config-missing p {
	color: var(--pdi-soft);
	font-size: 16px;
	line-height: 1.6;
	margin: 0;
	max-width: 760px;
}

.pdi-card {
	background: var(--pdi-surface);
	border: 1px solid var(--pdi-border);
	border-radius: 16px;
	padding: 18px;
}

.pdi-auth {
	display: grid;
	gap: 14px;
}

.pdi-tabs,
.pdi-actions,
.pdi-step-head {
	display: flex;
	align-items: center;
	gap: 10px;
	justify-content: space-between;
}

.pdi-tabs {
	background: var(--pdi-warm);
	border-radius: 10px;
	padding: 4px;
	justify-content: flex-start;
}

.pdi-tab,
.pdi-button {
	border: 0;
	border-radius: 8px;
	cursor: pointer;
	font: inherit;
	font-weight: 750;
	min-height: 42px;
	padding: 10px 14px;
}

.pdi-tab {
	background: transparent;
	color: var(--pdi-soft);
}

.pdi-tab.is-active {
	background: var(--pdi-surface);
	color: var(--pdi-ink);
}

.pdi-button {
	background: var(--pdi-rose);
	color: #fff;
}

.pdi-button:hover {
	background: var(--pdi-rose-hover);
}

.pdi-button.secondary {
	background: var(--pdi-teal);
}

.pdi-button.neutral {
	background: var(--pdi-warm);
	color: var(--pdi-ink);
}

.pdi-button:disabled {
	cursor: not-allowed;
	opacity: .55;
}

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

.pdi-field {
	display: grid;
	gap: 7px;
}

.pdi-field label {
	color: var(--pdi-ink);
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
}

.pdi-field input,
.pdi-field select,
.pdi-field textarea {
	background: var(--pdi-surface);
	border: 1px solid var(--pdi-border);
	border-radius: 8px;
	color: var(--pdi-ink);
	font: inherit;
	font-size: 15px;
	line-height: 1.45;
	padding: 11px 12px;
	width: 100%;
}

.pdi-field textarea {
	min-height: 130px;
	resize: vertical;
}

.pdi-field input:focus,
.pdi-field select:focus,
.pdi-field textarea:focus {
	border-color: var(--pdi-teal);
	box-shadow: 0 0 0 3px rgba(47, 125, 115, .15);
	outline: 0;
}

.pdi-phone-control {
	display: grid;
	gap: 8px;
	grid-template-columns: minmax(145px, .72fr) minmax(0, 1fr);
}

.pdi-phone-control select,
.pdi-phone-control input {
	min-width: 0;
}

.pdi-form {
	display: grid;
	gap: 16px;
}

.pdi-progress {
	background: var(--pdi-warm);
	border-radius: 999px;
	height: 10px;
	overflow: hidden;
}

.pdi-progress span {
	background: var(--pdi-teal);
	display: block;
	height: 100%;
	transition: width .2s ease;
}

.pdi-status {
	color: var(--pdi-muted);
	font-size: 13px;
	font-weight: 700;
}

.pdi-status.error,
.pdi-error {
	color: var(--pdi-danger);
}

.pdi-error {
	background: var(--pdi-danger-soft);
	border-radius: 8px;
	padding: 10px 12px;
}

.pdi-notice {
	background: var(--pdi-info-soft);
	border-radius: 10px;
	color: var(--pdi-ink);
	line-height: 1.55;
	padding: 12px 14px;
}

.pdi-term-card {
	background: #fffdf8;
	border: 1px solid var(--pdi-border);
	border-radius: 12px;
	display: grid;
	gap: 14px;
	grid-column: 1 / -1;
	padding: 16px;
}

.pdi-term-head {
	align-items: flex-start;
	display: flex;
	gap: 12px;
	justify-content: space-between;
}

.pdi-term-head h3 {
	font-size: 20px;
	line-height: 1.25;
	margin: 2px 0 0;
}

.pdi-term-head span,
.pdi-term-help {
	color: var(--pdi-muted);
	font-size: 13px;
}

.pdi-term-scroll {
	background: #fff;
	border: 1px solid var(--pdi-border);
	border-radius: 10px;
	max-height: 360px;
	overflow: auto;
	padding: 16px;
}

.pdi-term-document h1 {
	font-size: 20px;
	line-height: 1.25;
	margin: 0 0 8px;
}

.pdi-term-document h2 {
	font-size: 15px;
	margin: 18px 0 8px;
	text-transform: uppercase;
}

.pdi-term-document p {
	line-height: 1.55;
	margin: 0 0 10px;
}

.pdi-term-signatures {
	display: grid;
	gap: 18px;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	margin-top: 24px;
}

.pdi-term-signatures h3 {
	font-size: 13px;
	margin: 0 0 8px;
	text-transform: uppercase;
}

.pdi-signature-preview {
	border-bottom: 1px solid var(--pdi-border);
	font-family: "Segoe Script", "Brush Script MT", "Lucida Handwriting", "Apple Chancery", cursive;
	font-size: 32px;
	font-style: italic;
	line-height: 1.2;
	margin: 8px 0 10px !important;
	min-height: 44px;
	padding-bottom: 4px;
}

.pdi-term-accept {
	background: #eef8f6;
	border: 1px solid #b8deda;
	border-radius: 10px;
	padding: 12px;
}

.pdi-consent {
	align-items: flex-start;
	display: flex;
	gap: 10px;
	line-height: 1.5;
}

.pdi-consent input {
	margin-top: 4px;
}

.pdi-range {
	align-items: center;
	display: grid;
	gap: 10px;
	grid-template-columns: 1fr auto;
}

.pdi-range strong {
	background: var(--pdi-teal-soft);
	border-radius: 999px;
	color: var(--pdi-teal);
	min-width: 42px;
	padding: 7px 10px;
	text-align: center;
}

.pdi-confirmation {
	display: grid;
	gap: 16px;
	text-align: left;
}

.pdi-admin-note {
	background: var(--pdi-danger-soft);
	border-radius: 8px;
	padding: 10px 12px;
}

.pdi-admin table {
	border-collapse: collapse;
	width: 100%;
}

.pdi-admin th,
.pdi-admin td {
	border-bottom: 1px solid #e8ded2;
	padding: 9px 10px;
	text-align: left;
}

.pdi-admin pre {
	background: #faf3ea;
	border: 1px solid #e8ded2;
	border-radius: 10px;
	overflow: auto;
	padding: 14px;
}

@media (min-width: 720px) {
	.pdi-app {
		padding: 42px 24px 64px;
	}

	.pdi-card {
		padding: 24px;
	}

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

@media (max-width: 420px) {
	.pdi-phone-control,
	.pdi-term-head {
		grid-template-columns: 1fr;
	}

	.pdi-term-head {
		display: grid;
	}
}
.pdi-dashboard-head,
.pdi-sessions-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
}

.pdi-completed-band {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 24px 0;
	padding: 16px;
	border-left: 4px solid #147d74;
	background: #eef8f6;
}

.pdi-completed-band > span {
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: #147d74;
	color: #fff;
	font-weight: 800;
}

.pdi-completed-band p,
.pdi-sessions-head p {
	margin: 4px 0 0;
}

.pdi-feedback-success {
	position: relative;
	display: grid;
	gap: 4px;
	margin: 18px 0;
	padding: 16px 48px 16px 16px;
	border: 1px solid #7ab8aa;
	border-left: 5px solid #147d74;
	border-radius: 8px;
	background: #eef8f6;
	color: #104f48;
}

.pdi-feedback-success button {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 32px;
	height: 32px;
	border: 0;
	background: transparent;
	color: inherit;
	font-size: 24px;
	cursor: pointer;
}

.pdi-session-journey {
	display: grid;
	gap: 8px;
	margin: 18px 0;
}

.pdi-session-card {
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr) auto;
	align-items: center;
	gap: 12px;
	min-height: 72px;
	padding: 12px;
	border: 1px solid #d9dedc;
	border-radius: 8px;
	background: #fff;
}

.pdi-session-card.is-available,
.pdi-session-card.is-reopened {
	border-color: #147d74;
	box-shadow: inset 4px 0 #147d74;
}

.pdi-session-card.is-draft {
	border-color: #bc7a19;
	box-shadow: inset 4px 0 #bc7a19;
}

.pdi-session-card.is-locked {
	background: #f3f4f4;
	color: #646b69;
}

.pdi-session-card.is-submitted {
	background: #eef8f6;
}

.pdi-session-number {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #182b28;
	color: #fff;
	font-weight: 800;
}

.pdi-session-info {
	display: grid;
	gap: 3px;
}

.pdi-session-state {
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
}

.pdi-feedback-section {
	margin: 28px 0 12px;
	padding-bottom: 8px;
	border-bottom: 1px solid #d9dedc;
	font-size: 17px;
}

.pdi-feedback-question {
	margin: 0;
	padding: 18px 0;
	border: 0;
}

.pdi-feedback-question legend,
.pdi-feedback-question > label {
	display: block;
	margin-bottom: 12px;
	font-weight: 700;
	line-height: 1.45;
}

.pdi-choice-grid,
.pdi-score-chips {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 8px;
}

.pdi-score-chips {
	grid-template-columns: repeat(11, minmax(42px, 1fr));
	overflow-x: auto;
	padding-bottom: 5px;
}

.pdi-star-rating {
	display: grid;
	grid-template-columns: repeat(5, minmax(48px, 1fr));
	gap: 8px;
	max-width: 420px;
}

.pdi-star {
	display: grid;
	place-items: center;
	gap: 2px;
	min-height: 62px;
	padding: 6px;
	border: 1px solid #aeb8b5;
	border-radius: 8px;
	background: #fff;
	color: #8a918f;
	cursor: pointer;
}

.pdi-star span {
	font-size: 27px;
	line-height: 1;
}

.pdi-star small {
	font-size: 11px;
	font-weight: 800;
}

.pdi-star:hover,
.pdi-star:focus-visible,
.pdi-star.is-selected {
	border-color: #b47a18;
	background: #fff8e8;
	color: #b47a18;
}

.pdi-choice {
	min-height: 48px;
	padding: 9px;
	border: 1px solid #aeb8b5;
	border-radius: 8px;
	background: #fff;
	color: #182b28;
	font: inherit;
	font-weight: 700;
	cursor: pointer;
}

.pdi-choice:hover,
.pdi-choice:focus-visible,
.pdi-choice.is-selected {
	border-color: #147d74;
	background: #147d74;
	color: #fff;
}

@media (max-width: 640px) {
	.pdi-dashboard-head,
	.pdi-sessions-head {
		display: grid;
	}

	.pdi-session-journey {
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		padding-bottom: 8px;
	}

	.pdi-session-card {
		flex: 0 0 min(82vw, 310px);
		grid-template-columns: 48px minmax(0, 1fr);
		scroll-snap-align: start;
	}

	.pdi-session-card .pdi-button,
	.pdi-session-state {
		grid-column: 1 / -1;
		width: 100%;
		text-align: center;
	}

	.pdi-choice-grid {
		grid-template-columns: 1fr 1fr;
	}

	.pdi-form .pdi-actions,
	.pdi-feedback-form .pdi-actions {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		align-items: stretch;
		width: 100%;
	}

	.pdi-form .pdi-actions .pdi-button,
	.pdi-feedback-form .pdi-actions .pdi-button {
		width: 100%;
		min-width: 0;
		white-space: normal;
	}

	.pdi-form .pdi-actions .pdi-status,
	.pdi-feedback-form .pdi-actions .pdi-status,
	.pdi-form .pdi-actions [data-submit],
	.pdi-feedback-form .pdi-actions [data-submit-session] {
		grid-column: 1 / -1;
	}

	.pdi-form .pdi-actions .pdi-status,
	.pdi-feedback-form .pdi-actions .pdi-status {
		text-align: center;
	}
}