/*
 * Pathworks Intern Application - "Open Letter" direction, two presentations.
 *
 * One stylesheet, one markup, two presentations chosen by a root class:
 *
 *   .pw-intern--open-letter   dark editorial letter. Tokens copied from the
 *                             Pathworks V4.4 site stylesheet. Centred narrow
 *                             measure, hairlines and hanging markers, no cards.
 *
 *   .pw-intern--portal-light  the Pathworks Portal light surface system.
 *                             Tokens copied from pathworks-client-portal
 *                             portal.css `[data-theme='light']`. Left-aligned
 *                             record layout: a header row, a fact strip, one
 *                             bordered panel with a label column, and an apply
 *                             panel. It is a designed counterpart, not the dark
 *                             sheet with the colours inverted.
 *
 * Every rule is scoped to a `.pw-` class so the surrounding theme is untouched.
 * There is no public theme toggle; the presentation is a shortcode/block
 * setting decided by the site owner.
 *
 * Motion budget: border-colour, box-shadow, and a 1px hover lift only. No
 * keyframes, no filter stacks, and everything is removed under
 * prefers-reduced-motion.
 */

@font-face {
	font-family: "Oxanium";
	src: url("../fonts/oxanium-latin-variable.woff2") format("woff2");
	font-style: normal;
	font-weight: 500 700;
	font-display: swap;
}

@font-face {
	font-family: "Manrope";
	src: url("../fonts/manrope-latin-variable.woff2") format("woff2");
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
}

/* ============================================================ presentation
   tokens. Semantic names, so the shared rules below never mention a colour. */

.pw-intern--open-letter {
	--pw-canvas: #07060b;
	--pw-text: #f7f4ff;
	--pw-text-2: rgba(247, 244, 255, 0.8);
	--pw-text-3: rgba(247, 244, 255, 0.66);
	--pw-accent: #a67bff;
	--pw-accent-strong: #b694ff;
	--pw-accent-deep: #5a2ddb;
	--pw-accent-soft: rgba(166, 123, 255, 0.12);
	--pw-accent-line: rgba(166, 123, 255, 0.5);
	--pw-line: rgba(255, 255, 255, 0.1);
	--pw-line-strong: rgba(255, 255, 255, 0.22);
	--pw-quiet: rgba(255, 255, 255, 0.02);
	--pw-panel-bg: transparent;
	--pw-panel-border: transparent;
	--pw-field-bg: rgba(255, 255, 255, 0.035);
	--pw-field-border: rgba(255, 255, 255, 0.22);
	--pw-field-border-hover: rgba(255, 255, 255, 0.34);
	--pw-focus: #ffffff;
	--pw-focus-ring: rgba(166, 123, 255, 0.18);
	--pw-good: #74d9a2;
	--pw-good-bg: rgba(116, 217, 162, 0.07);
	--pw-good-border: rgba(116, 217, 162, 0.5);
	--pw-warn: #ffb4a8;
	--pw-warn-bg: rgba(255, 180, 168, 0.06);
	--pw-warn-border: rgba(255, 180, 168, 0.5);
	--pw-warn-ring: rgba(255, 180, 168, 0.2);
	--pw-btn-bg: linear-gradient(145deg, rgba(166, 123, 255, 0.22), rgba(90, 45, 219, 0.12) 58%, rgba(255, 255, 255, 0.035));
	--pw-btn-border: rgba(166, 123, 255, 0.46);
	--pw-btn-border-hover: rgba(166, 123, 255, 0.78);
	--pw-btn-text: #f7f4ff;
	--pw-btn-shadow: 0 14px 42px rgba(90, 45, 219, 0.28);
	--pw-file-btn-bg: rgba(166, 123, 255, 0.12);
	--pw-file-btn-text: #f7f4ff;
	--pw-file-btn-border: rgba(166, 123, 255, 0.46);
	--pw-chat-bg: rgba(90, 45, 219, 0.08);
	--pw-chat-border: rgba(166, 123, 255, 0.5);
	--pw-radius: 14px;
	--pw-radius-sm: 10px;
	--pw-radius-btn: 999px;
	--pw-font-body: Manrope, "Segoe UI", system-ui, -apple-system, sans-serif;
	--pw-font-display: Oxanium, "Segoe UI", system-ui, sans-serif;
	--pw-font-label: Oxanium, "Segoe UI", system-ui, sans-serif;
	--pw-measure: 62ch;

	color-scheme: dark;
}

.pw-intern--portal-light {
	--pw-canvas: #ffffff;
	--pw-text: #201c27;
	--pw-text-2: #443d4b;
	--pw-text-3: #5e5666;
	--pw-text-muted: #6f6777;
	--pw-accent: #6840c0;
	--pw-accent-strong: #5630a9;
	--pw-accent-deep: #45248b;
	--pw-accent-soft: #f3edff;
	--pw-accent-line: #c4afe6;
	--pw-line: #ece4f7;
	--pw-line-strong: #d9cced;
	--pw-border-strong: #b49dda;
	--pw-quiet: #fdfbff;
	--pw-panel-bg: #ffffff;
	--pw-panel-border: #d9cced;
	--pw-surface-emphasis: #f8f4ff;
	--pw-field-bg: #ffffff;
	--pw-field-border: #d9cced;
	--pw-field-border-hover: #b49dda;
	--pw-focus: #6840c0;
	--pw-focus-ring: rgba(104, 64, 192, 0.2);
	--pw-good: #18764b;
	--pw-good-bg: #e6f7ed;
	--pw-good-border: #98d0b2;
	--pw-warn: #a33142;
	--pw-warn-bg: #fff0f2;
	--pw-warn-border: #e4a9b2;
	--pw-warn-ring: rgba(163, 49, 66, 0.18);
	--pw-btn-bg: linear-gradient(135deg, #5d35b9, #7147ca);
	--pw-btn-border: #7250c7;
	--pw-btn-border-hover: #6840c0;
	--pw-btn-text: #ffffff;
	--pw-btn-shadow: 0 8px 24px rgba(74, 35, 153, 0.22);
	--pw-file-btn-bg: #f3edff;
	--pw-file-btn-text: #45248b;
	--pw-file-btn-border: #b49dda;
	--pw-chat-bg: #f8f4ff;
	--pw-chat-border: #c4afe6;
	--pw-radius: 14px;
	--pw-radius-sm: 8px;
	--pw-radius-btn: 8px;
	--pw-font-body: Inter, Manrope, "Segoe UI", system-ui, -apple-system, sans-serif;
	--pw-font-display: "Chakra Petch", Oxanium, "Segoe UI", system-ui, sans-serif;
	--pw-font-label: Inter, Manrope, "Segoe UI", system-ui, sans-serif;
	--pw-shell: 1080px;

	color-scheme: light;
}

/* ================================================================== root */

.pw-intern {
	--pw-pad: clamp(20px, 5vw, 40px);

	position: relative;
	box-sizing: border-box;
	margin: 0;
	padding: clamp(40px, 6vw, 80px) var(--pw-pad) clamp(64px, 8vw, 112px);
	background: var(--pw-canvas);
	color: var(--pw-text);
	font-family: var(--pw-font-body);
	font-size: 16px;
	line-height: 1.62;
	overflow-x: clip;
	-webkit-font-smoothing: antialiased;
}

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

/* Anchor jumps must clear a theme's sticky header instead of hiding the
   heading the visitor was sent to. */
.pw-intern [id] {
	scroll-margin-top: 96px;
}

.pw-intern a:focus-visible,
.pw-intern button:focus-visible,
.pw-intern input:focus-visible,
.pw-intern textarea:focus-visible,
.pw-intern [tabindex]:focus-visible {
	outline: 2px solid var(--pw-focus);
	outline-offset: 3px;
}

/* ============================================================== masthead */

.pw-letter__mark {
	display: block;
	height: auto;
}

.pw-letter__title {
	margin: 0;
	color: var(--pw-text);
	font-family: var(--pw-font-display);
	font-weight: 700;
	text-wrap: balance;
}

.pw-letter__lede {
	margin: 0;
	color: var(--pw-text-2);
	text-wrap: pretty;
}

.pw-letter__act {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.pw-letter__act-note {
	margin: 0;
	color: var(--pw-text-3);
	font-size: 0.875rem;
	line-height: 1.5;
}

/* ================================================================ facts */

.pw-facts {
	margin: 0;
}

.pw-fact {
	margin: 0;
}

.pw-fact__label {
	margin: 0;
	font-family: var(--pw-font-label);
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.pw-fact__value {
	margin: 0;
}

/* ================================================================ prose */

.pw-intern__p {
	margin: 0 0 18px;
	color: var(--pw-text-2);
	text-wrap: pretty;
}

.pw-intern__h2 {
	margin: 0;
	color: var(--pw-text);
	font-family: var(--pw-font-display);
	font-weight: 700;
	line-height: 1.2;
	text-wrap: balance;
}

/* Hanging markers instead of cards. The list still reads as prose. */
.pw-hang {
	margin: 0 0 18px;
	padding: 0;
	list-style: none;
}

.pw-hang__item {
	position: relative;
	padding: 0 0 14px 22px;
}

.pw-hang__item::before {
	position: absolute;
	inset-block-start: 0.78em;
	inset-inline-start: 0;
	width: 9px;
	height: 1px;
	content: "";
	background: var(--pw-accent);
}

.pw-hang__title {
	margin: 0;
	color: var(--pw-text);
	font-family: var(--pw-font-body);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.5;
}

.pw-hang__body {
	margin: 2px 0 0;
	color: var(--pw-text-3);
	font-size: 0.9375rem;
	line-height: 1.6;
}

.pw-intern__p--not {
	padding-block-start: 14px;
	border-block-start: 1px solid var(--pw-line);
	color: var(--pw-text-3);
	font-size: 0.9375rem;
}

.pw-values {
	margin: 0;
}

.pw-value {
	padding: 12px 0;
	border-block-end: 1px solid var(--pw-line);
}

.pw-value dt {
	color: var(--pw-text);
	font-family: var(--pw-font-label);
	font-size: 0.9375rem;
	font-weight: 600;
}

.pw-value dd {
	margin: 3px 0 0;
	color: var(--pw-text-3);
	font-size: 0.9375rem;
	line-height: 1.55;
}

/* Run-in numbered process. Three sentences, not three boxes. */
.pw-steps {
	margin: 0;
	padding: 0;
	list-style: none;
}

.pw-step {
	display: grid;
	grid-template-columns: 28px 1fr;
	gap: 0 14px;
	margin: 0 0 14px;
}

.pw-step__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	margin-block-start: 1px;
	border: 1px solid var(--pw-accent-line);
	border-radius: 50%;
	background: var(--pw-accent-soft);
	color: var(--pw-accent);
	font-family: var(--pw-font-label);
	font-size: 0.8125rem;
	font-weight: 700;
	line-height: 1;
}

.pw-step__title {
	margin: 0 0 3px;
	color: var(--pw-text);
	font-family: var(--pw-font-body);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.5;
}

.pw-step__body {
	margin: 0;
	color: var(--pw-text-3);
	font-size: 0.9375rem;
	line-height: 1.6;
}

.pw-privacy {
	margin: 0;
	padding: 0;
	list-style: none;
}

.pw-privacy li {
	position: relative;
	padding: 12px 0 12px 22px;
	border-block-end: 1px solid var(--pw-line);
	color: var(--pw-text-2);
	font-size: 0.9375rem;
	line-height: 1.6;
}

.pw-privacy li::before {
	position: absolute;
	inset-block-start: 20px;
	inset-inline-start: 1px;
	width: 7px;
	height: 7px;
	content: "";
	border-radius: 50%;
	background: var(--pw-good);
}

.pw-letter__sign {
	margin: 0;
	color: var(--pw-text-3);
	font-family: var(--pw-font-display);
	font-size: 0.875rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* =============================================================== button */

.pw-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 48px;
	padding: 12px 24px;
	border: 1px solid var(--pw-btn-border);
	border-radius: var(--pw-radius-btn);
	background: var(--pw-btn-bg);
	color: var(--pw-btn-text);
	font-family: var(--pw-font-display);
	font-size: 0.9375rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	text-decoration: none;
	cursor: pointer;
	transition: border-color 200ms ease, box-shadow 200ms ease, transform 200ms ease;
}

.pw-btn:hover {
	border-color: var(--pw-btn-border-hover);
	box-shadow: var(--pw-btn-shadow);
	transform: translateY(-1px);
}

.pw-icon {
	width: 16px;
	height: 16px;
	flex: 0 0 auto;
	margin-inline-end: 8px;
	color: currentColor;
	vertical-align: text-bottom;
}

.pw-btn .pw-icon {
	margin-inline-end: 0;
	transition: transform 200ms ease;
}

.pw-btn:hover .pw-icon--arrowright {
	transform: translateX(3px);
}

.pw-btn[aria-busy="true"] {
	cursor: progress;
	opacity: 0.72;
}

/* ================================================================= form */

.pw-form {
	margin-block-start: 20px;
	max-width: 640px;
}

.pw-form__row {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0 18px;
}

.pw-field {
	margin-block-end: 20px;
}

.pw-label {
	display: block;
	margin-block-end: 8px;
	color: var(--pw-text);
	font-family: var(--pw-font-label);
	font-size: 0.9375rem;
	font-weight: 600;
}

.pw-req {
	color: var(--pw-text-3);
	font-weight: 400;
	font-size: 0.8125rem;
}

.pw-input {
	display: block;
	width: 100%;
	min-height: 48px;
	padding: 12px 14px;
	border: 1px solid var(--pw-field-border);
	border-radius: var(--pw-radius-sm);
	background: var(--pw-field-bg);
	color: var(--pw-text);
	font-family: inherit;
	font-size: 1rem;
	line-height: 1.5;
	transition: border-color 180ms ease, box-shadow 180ms ease;
}

.pw-input::placeholder {
	color: var(--pw-text-3);
}

.pw-input:hover {
	border-color: var(--pw-field-border-hover);
}

.pw-input:focus {
	border-color: var(--pw-accent);
	box-shadow: 0 0 0 3px var(--pw-focus-ring);
	outline: none;
}

.pw-file {
	display: block;
	width: 100%;
	min-height: 48px;
	padding: 10px 12px;
	border: 1px dashed var(--pw-field-border-hover);
	border-radius: var(--pw-radius-sm);
	background: var(--pw-quiet);
	color: var(--pw-text-2);
	font-family: inherit;
	font-size: 0.9375rem;
	cursor: pointer;
}

.pw-file::file-selector-button {
	min-height: 28px;
	margin-inline-end: 12px;
	padding: 5px 14px;
	border: 1px solid var(--pw-file-btn-border);
	border-radius: var(--pw-radius-btn);
	background: var(--pw-file-btn-bg);
	color: var(--pw-file-btn-text);
	font-family: var(--pw-font-label);
	font-size: 0.875rem;
	font-weight: 600;
	cursor: pointer;
}

.pw-file:hover {
	border-color: var(--pw-accent);
}

.pw-file:focus {
	border-color: var(--pw-accent);
	outline: none;
}

.pw-hint {
	margin: 8px 0 0;
	color: var(--pw-text-3);
	font-size: 0.8125rem;
}

/* Confirms the exact file the browser is holding. Native file inputs truncate
   long names, and an applicant who attached the wrong file otherwise finds out
   after the resume is already emailed. */
.pw-filemeta {
	display: flex;
	align-items: baseline;
	gap: 8px;
	margin: 8px 0 0;
	color: var(--pw-good);
	font-size: 0.8125rem;
	font-weight: 600;
	overflow-wrap: anywhere;
}

.pw-filemeta[hidden] {
	display: none;
}

.pw-fielderror {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 8px 0 0;
	color: var(--pw-warn);
	font-size: 0.875rem;
	font-weight: 600;
}

.pw-fielderror[hidden] {
	display: none;
}

.pw-fielderror::before {
	flex: 0 0 auto;
	/* Alt text "" keeps the decorative glyph out of the accessible description. */
	content: "!" / "";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	margin-block-start: 2px;
	border: 1px solid currentColor;
	border-radius: 50%;
	font-size: 0.75rem;
	line-height: 1;
}

.pw-field [aria-invalid="true"] {
	border-color: var(--pw-warn);
}

.pw-field [aria-invalid="true"]:focus {
	box-shadow: 0 0 0 3px var(--pw-warn-ring);
}

.pw-consent {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	min-height: 44px;
	padding: 16px 18px;
	border: 1px solid var(--pw-line-strong);
	border-radius: var(--pw-radius-sm);
	background: var(--pw-quiet);
}

/* 24px is the WCAG 2.2 minimum target size. The label is also a target, but
   the box itself has to clear the floor on its own. */
.pw-check {
	flex: 0 0 auto;
	width: 24px;
	height: 24px;
	margin: 2px 0 0;
	accent-color: var(--pw-accent);
	cursor: pointer;
}

.pw-label--consent {
	margin: 0;
	color: var(--pw-text-2);
	font-family: var(--pw-font-body);
	font-size: 0.9375rem;
	font-weight: 400;
	line-height: 1.55;
	cursor: pointer;
}

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

.pw-actions {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin-block-start: 26px;
}

.pw-btn--submit {
	align-self: flex-start;
	min-width: 220px;
}

.pw-actions__note {
	max-width: 62ch;
	margin: 0;
	color: var(--pw-text-3);
	font-size: 0.8125rem;
	line-height: 1.55;
}

.pw-noscript {
	margin: 18px 0 0;
	padding: 12px 14px;
	border: 1px solid var(--pw-line-strong);
	border-radius: var(--pw-radius-sm);
	color: var(--pw-text-2);
	font-size: 0.875rem;
}

/* ============================================================= progress */

.pw-progress {
	margin-block-start: 22px;
}

.pw-progress[hidden] {
	display: none;
}

.pw-progress__track {
	width: 100%;
	height: 6px;
	overflow: hidden;
	border-radius: 999px;
	background: var(--pw-line-strong);
}

.pw-progress__bar {
	width: 0%;
	height: 100%;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--pw-accent-deep), var(--pw-accent));
}

.pw-progress__label {
	margin: 8px 0 0;
	color: var(--pw-text-2);
	font-size: 0.8125rem;
}

/* =============================================================== status */

.pw-status,
.pw-summary {
	margin-block: 20px;
	padding: 16px 18px;
	border: 1px solid var(--pw-line-strong);
	border-radius: var(--pw-radius-sm);
	background: var(--pw-quiet);
}

.pw-status[hidden],
.pw-summary[hidden] {
	display: none;
}

.pw-status--ok {
	border-color: var(--pw-good-border);
	background: var(--pw-good-bg);
}

.pw-status--error,
.pw-summary {
	border-color: var(--pw-warn-border);
	background: var(--pw-warn-bg);
}

.pw-status__title,
.pw-summary__title {
	margin: 0 0 6px;
	color: var(--pw-text);
	font-family: var(--pw-font-display);
	font-size: 1.0625rem;
	font-weight: 700;
}

.pw-status__body {
	margin: 0;
	color: var(--pw-text-2);
	font-size: 0.9375rem;
}

.pw-status__list,
.pw-summary__list {
	margin: 10px 0 0;
	padding-inline-start: 20px;
	color: var(--pw-text-2);
	font-size: 0.9375rem;
}

.pw-status__list a,
.pw-summary__list a {
	color: var(--pw-text);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ================================================================= chat */

.pw-chat {
	width: 100%;
	margin-block-start: 28px;
	overflow: hidden;
	border: 1px solid var(--pw-chat-border);
	border-radius: var(--pw-radius);
	background: var(--pw-panel-bg);
}

.pw-chat[hidden] {
	display: none;
}

.pw-chat__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	padding: 20px clamp(18px, 3vw, 28px);
	border-block-end: 1px solid var(--pw-line);
	background: var(--pw-chat-bg);
}

.pw-chat__identity {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
}

.pw-chat__mark {
	display: inline-grid;
	flex: 0 0 42px;
	width: 42px;
	height: 42px;
	place-items: center;
	border: 1px solid var(--pw-accent-line);
	border-radius: 12px;
	background: var(--pw-accent-soft);
	color: var(--pw-accent-deep);
}

.pw-chat__mark .pw-icon {
	width: 20px;
	height: 20px;
}

.pw-chat__kicker {
	margin: 0 0 2px;
	color: var(--pw-text-3);
	font-family: var(--pw-font-label);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.pw-chat__title {
	margin: 0;
	color: var(--pw-text);
	font-family: var(--pw-font-display);
	font-size: clamp(1.1rem, 3vw, 1.35rem);
	font-weight: 700;
}

.pw-chat__connection {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-height: 32px;
	padding: 6px 10px;
	border: 1px solid var(--pw-line-strong);
	border-radius: 999px;
	background: var(--pw-quiet);
	color: var(--pw-text-2);
	font-size: 0.8125rem;
	font-weight: 700;
	white-space: nowrap;
}

.pw-chat__connection-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--pw-accent);
}

.pw-chat__connection[data-pw-chat-state="ready"] .pw-chat__connection-dot,
.pw-chat__connection[data-pw-chat-state="complete"] .pw-chat__connection-dot {
	background: var(--pw-good);
}

.pw-chat__connection[data-pw-chat-state="error"] .pw-chat__connection-dot {
	background: var(--pw-warn);
}

.pw-chat__intro {
	max-width: none;
	margin: 0;
	padding: 18px clamp(18px, 3vw, 28px) 12px;
	color: var(--pw-text-2);
	font-size: 0.9375rem;
}

.pw-chat__progress {
	padding: 0 clamp(18px, 3vw, 28px) 18px;
}

.pw-chat__progress-copy {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin-block-end: 8px;
	color: var(--pw-text-3);
	font-size: 0.75rem;
}

.pw-chat__progress-copy strong {
	color: var(--pw-text-2);
	font-family: var(--pw-font-label);
	font-size: 0.8125rem;
	font-weight: 700;
}

.pw-chat__progress-track {
	height: 4px;
	overflow: hidden;
	border-radius: 999px;
	background: var(--pw-line);
}

.pw-chat__progress-bar {
	display: block;
	width: 0;
	height: 100%;
	border-radius: inherit;
	background: var(--pw-accent);
	transition: width 180ms ease;
}

.pw-chat__transcript {
	display: flex;
	min-height: 300px;
	max-height: 480px;
	margin: 0;
	padding: 22px clamp(18px, 3vw, 28px);
	overflow-x: hidden;
	overflow-y: auto;
	flex-direction: column;
	gap: 16px;
	border-block: 1px solid var(--pw-line);
	background: var(--pw-quiet);
	list-style: none;
	scrollbar-color: var(--pw-accent-line) transparent;
}

.pw-chat__system {
	align-self: center;
	max-width: 72ch;
	padding: 8px 12px;
	border-radius: 999px;
	background: var(--pw-accent-soft);
	color: var(--pw-text-2);
	font-size: 0.75rem;
	text-align: center;
}

.pw-chat__message {
	width: fit-content;
	min-width: 0;
	max-width: min(78%, 62ch);
	padding: 12px 14px;
	border: 1px solid var(--pw-line-strong);
	border-radius: 4px 14px 14px;
	background: var(--pw-panel-bg);
	color: var(--pw-text);
}

.pw-chat__message--applicant {
	align-self: flex-end;
	border-color: var(--pw-accent);
	border-radius: 14px 4px 14px 14px;
	background: var(--pw-accent);
	color: #ffffff;
}

.pw-chat__speaker {
	display: block;
	margin-block-end: 4px;
	color: var(--pw-text-3);
	font-family: var(--pw-font-label);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.pw-chat__message--applicant .pw-chat__speaker {
	color: rgba(255, 255, 255, 0.78);
}

.pw-chat__message p {
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.55;
	overflow-wrap: anywhere;
	word-break: break-word;
	white-space: pre-wrap;
}

.pw-chat__typing {
	display: flex;
	align-items: center;
	gap: 5px;
	min-height: 36px;
	padding: 8px clamp(18px, 3vw, 28px) 0;
	color: var(--pw-text-3);
}

.pw-chat__typing[hidden] {
	display: none;
}

.pw-chat__typing span {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--pw-accent);
	opacity: 0.45;
}

.pw-chat__typing span:nth-child(2) {
	opacity: 0.7;
}

.pw-chat__typing span:nth-child(3) {
	opacity: 1;
}

.pw-chat__typing em {
	margin-inline-start: 4px;
	font-size: 0.75rem;
	font-style: normal;
}

.pw-chat__composer {
	padding: 16px clamp(18px, 3vw, 28px) 20px;
	background: var(--pw-panel-bg);
}

.pw-chat__answer-label {
	display: block;
	margin-block-end: 8px;
	color: var(--pw-text);
	font-family: var(--pw-font-label);
	font-size: 0.8125rem;
	font-weight: 700;
}

.pw-chat__compose-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 10px;
	align-items: end;
}

.pw-chat__answer {
	width: 100%;
	min-height: 92px;
	max-height: 220px;
	padding: 12px 14px;
	resize: vertical;
	border: 1px solid var(--pw-field-border);
	border-radius: var(--pw-radius-sm);
	outline: 0;
	background: var(--pw-field-bg);
	color: var(--pw-text);
	font: inherit;
	line-height: 1.5;
	transition: border-color 160ms ease, box-shadow 160ms ease;
}

.pw-chat__answer:hover:not(:disabled) {
	border-color: var(--pw-field-border-hover);
}

.pw-chat__answer:focus-visible,
.pw-chat__send:focus-visible,
.pw-chat__retry:focus-visible {
	outline: 2px solid var(--pw-focus);
	outline-offset: 3px;
	box-shadow: 0 0 0 4px var(--pw-focus-ring);
}

.pw-chat__answer:disabled {
	cursor: not-allowed;
	opacity: 0.62;
}

.pw-chat__send,
.pw-chat__retry {
	display: inline-flex;
	min-width: 96px;
	min-height: 48px;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 10px 16px;
	border: 1px solid var(--pw-btn-border);
	border-radius: var(--pw-radius-btn);
	background: var(--pw-btn-bg);
	box-shadow: var(--pw-btn-shadow);
	color: var(--pw-btn-text);
	font-family: var(--pw-font-label);
	font-size: 0.875rem;
	font-weight: 700;
	cursor: pointer;
	transition: transform 160ms ease, border-color 160ms ease, opacity 160ms ease;
}

.pw-chat__send:hover:not(:disabled),
.pw-chat__retry:hover {
	transform: translateY(-1px);
	border-color: var(--pw-btn-border-hover);
}

.pw-chat__send:disabled {
	cursor: not-allowed;
	opacity: 0.5;
	box-shadow: none;
}

.pw-chat__compose-meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-block-start: 8px;
	color: var(--pw-text-3);
	font-size: 0.75rem;
}

.pw-chat__error {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin: 0 clamp(18px, 3vw, 28px) 20px;
	padding: 14px;
	border: 1px solid var(--pw-warn-border);
	border-radius: var(--pw-radius-sm);
	background: var(--pw-warn-bg);
	color: var(--pw-text);
}

.pw-chat__error[hidden] {
	display: none;
}

.pw-chat__error p {
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.5;
}

.pw-chat__retry {
	min-width: 108px;
	box-shadow: none;
}

/* ====================================================== open-letter layout
   A centred narrow measure. Nothing is a card. */

.pw-intern--open-letter > * {
	position: relative;
	max-width: var(--pw-measure);
	margin-inline: auto;
}

.pw-intern--open-letter .pw-letter__head {
	margin-block-end: clamp(32px, 5vw, 48px);
	text-align: center;
}

.pw-intern--open-letter .pw-letter__mark {
	width: 44px;
	margin: 0 auto 20px;
	opacity: 0.92;
}

.pw-intern--open-letter .pw-letter__title {
	font-size: clamp(2rem, 5.4vw, 3.25rem);
	letter-spacing: -0.02em;
	line-height: 1.08;
}

.pw-intern--open-letter .pw-letter__lede {
	margin: 18px auto 0;
	font-size: clamp(1.0625rem, 1.7vw, 1.1875rem);
	line-height: 1.68;
}

.pw-intern--open-letter .pw-letter__act {
	align-items: center;
	margin-block-start: 28px;
	text-align: center;
}

.pw-intern--open-letter .pw-btn--jump {
	min-width: 240px;
}

/* Two balanced hairline rows of facts. */
.pw-intern--open-letter .pw-facts {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px 24px;
	margin-block-end: clamp(36px, 6vw, 56px);
	padding-block: 14px;
	border-block: 1px solid var(--pw-line);
}

.pw-intern--open-letter .pw-fact {
	display: flex;
	align-items: baseline;
	gap: 8px;
	padding: 2px 0;
}

.pw-intern--open-letter .pw-fact__label {
	color: var(--pw-accent);
	font-size: 0.6875rem;
}

.pw-intern--open-letter .pw-fact__value {
	color: var(--pw-text-2);
	font-size: 0.9375rem;
}

.pw-intern--open-letter .pw-intern__p {
	font-size: 1.0625rem;
	line-height: 1.75;
}

/* The opening paragraph carries the voice, so it gets the extra weight the
   rest of the letter deliberately does not. */
.pw-intern--open-letter .pw-letter__open .pw-intern__p:first-child {
	color: var(--pw-text);
	font-size: 1.125rem;
}

.pw-intern--open-letter .pw-letter__section {
	margin-block-start: clamp(34px, 5vw, 50px);
}

.pw-intern--open-letter .pw-intern__h2 {
	margin: 0 0 14px;
	font-size: 1.25rem;
	letter-spacing: 0.01em;
}

.pw-intern--open-letter .pw-intern__h2::before {
	display: block;
	width: 22px;
	height: 2px;
	margin-block-end: 12px;
	content: "";
	border-radius: 2px;
	background: var(--pw-accent-line);
}

.pw-intern--open-letter .pw-letter__sign {
	margin-block-start: clamp(32px, 5vw, 48px);
}

.pw-intern--open-letter .pw-intern__apply {
	margin-block-start: clamp(44px, 6vw, 72px);
	padding-block-start: clamp(32px, 5vw, 48px);
	border-block-start: 1px solid var(--pw-line-strong);
}

.pw-intern--open-letter .pw-intern__apply .pw-intern__h2 {
	font-size: 1.5rem;
}

.pw-intern--open-letter .pw-btn--submit {
	align-self: stretch;
	width: 100%;
}

/* ===================================================== portal-light layout
   The Portal record page: header row, fact strip, one bordered panel with a
   label column, and an apply panel. Left aligned, 1080px shell. */

.pw-intern--portal-light {
	padding: clamp(24px, 4vw, 40px) var(--pw-pad) clamp(56px, 7vw, 88px);
}

.pw-intern--portal-light > * {
	position: relative;
	max-width: var(--pw-shell);
	margin-inline: auto;
}

.pw-intern--portal-light .pw-letter__head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px 32px;
	margin-block-end: 20px;
	padding-block-end: 22px;
	border-block-end: 1px solid var(--pw-line-strong);
}

.pw-intern--portal-light .pw-letter__ident {
	display: flex;
	flex: 1 1 520px;
	gap: 18px;
	align-items: flex-start;
	min-width: 0;
}

.pw-intern--portal-light .pw-letter__mark {
	flex: 0 0 auto;
	width: 48px;
	margin: 4px 0 0;
}

.pw-intern--portal-light .pw-letter__title {
	font-size: clamp(1.85rem, 2.8vw, 2.6rem);
	font-weight: 600;
	letter-spacing: -0.035em;
	line-height: 1.12;
}

.pw-intern--portal-light .pw-letter__lede {
	max-width: 60ch;
	margin: 8px 0 0;
	color: var(--pw-text-3);
	font-size: 1.0625rem;
	line-height: 1.6;
}

.pw-intern--portal-light .pw-letter__act {
	flex: 0 0 auto;
	align-items: flex-start;
	gap: 8px;
}

.pw-intern--portal-light .pw-letter__act-note {
	max-width: 30ch;
	color: var(--pw-text-muted);
	font-size: 0.8125rem;
}

.pw-intern--portal-light .pw-btn {
	min-height: 44px;
	padding: 10px 20px;
	font-family: var(--pw-font-label);
	letter-spacing: 0;
}

/* The Portal's four-cell record strip. */
.pw-intern--portal-light .pw-facts {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin-block-end: clamp(20px, 3vw, 28px);
	border: 1px solid var(--pw-line-strong);
	border-radius: 12px;
	background: var(--pw-quiet);
}

.pw-intern--portal-light .pw-fact {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 14px 18px;
	border-inline-start: 1px solid var(--pw-line);
}

.pw-intern--portal-light .pw-fact:first-child {
	border-inline-start: 0;
}

.pw-intern--portal-light .pw-fact__label {
	color: var(--pw-text-muted);
	font-size: 0.6875rem;
	line-height: 1.3;
}

.pw-intern--portal-light .pw-fact__value {
	color: var(--pw-text);
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.4;
}

.pw-intern--portal-light .pw-letter__body,
.pw-intern--portal-light .pw-intern__apply {
	padding: clamp(6px, 1vw, 10px) clamp(18px, 3.5vw, 36px) clamp(18px, 3vw, 28px);
	border: 1px solid var(--pw-panel-border);
	border-radius: var(--pw-radius);
	background: var(--pw-panel-bg);
}

/* The application keeps its readable form measure, then gives the written
   interview the full usable width of the Portal panel at every breakpoint. */
.pw-intern--portal-light .pw-intern__apply {
	grid-template-columns: minmax(0, 1fr);
}

.pw-intern--portal-light .pw-intern__apply .pw-intern__apply-body {
	width: 100%;
	max-width: none;
}

.pw-intern--portal-light .pw-letter__open {
	padding-block: clamp(16px, 2.5vw, 24px) 6px;
	border-block-end: 1px solid var(--pw-line);
}

.pw-intern--portal-light .pw-intern__p {
	margin-block-end: 14px;
	font-size: 1rem;
	line-height: 1.7;
}

.pw-intern--portal-light .pw-letter__open .pw-intern__p:first-child {
	color: var(--pw-text);
	font-size: 1.0625rem;
}

.pw-intern--portal-light .pw-letter__section,
.pw-intern--portal-light .pw-intern__apply {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 10px 32px;
}

.pw-intern--portal-light .pw-letter__section {
	padding-block: 22px;
	border-block-end: 1px solid var(--pw-line);
}

.pw-intern--portal-light .pw-intern__apply {
	margin-block-start: 20px;
	padding-block-start: clamp(18px, 3vw, 26px);
}

.pw-intern--portal-light .pw-intern__h2 {
	color: var(--pw-text);
	font-family: var(--pw-font-display);
	font-size: 1.0625rem;
	font-weight: 600;
	letter-spacing: -0.01em;
	line-height: 1.35;
}

.pw-intern--portal-light .pw-letter__sbody {
	max-width: 66ch;
	min-width: 0;
}

.pw-intern--portal-light .pw-hang__item::before {
	background: var(--pw-accent);
}

.pw-intern--portal-light .pw-values {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0 24px;
}

.pw-intern--portal-light .pw-letter__sign {
	padding-block-start: 20px;
	color: var(--pw-text-muted);
	font-size: 0.8125rem;
}

.pw-intern--portal-light .pw-consent,
.pw-intern--portal-light .pw-file {
	background: var(--pw-quiet);
}

/* ============================================================ responsive */

/* Two name fields side by side only once each one still clears a comfortable
   input width. Below that they stack, which is why the row starts at 1fr. */
@media (min-width: 560px) {
	.pw-form__row {
		grid-template-columns: 1fr 1fr;
	}
}

@media (min-width: 620px) {
	.pw-intern--portal-light .pw-values {
		grid-template-columns: 1fr 1fr;
	}
}

@media (min-width: 900px) {
	.pw-intern--open-letter {
		--pw-measure: 66ch;
	}

	.pw-intern--portal-light .pw-letter__section {
		grid-template-columns: 200px minmax(0, 1fr);
	}

	.pw-intern--portal-light .pw-intern__h2 {
		padding-block-start: 2px;
	}
}

@media (max-width: 760px) {
	.pw-intern {
		font-size: 16px;
	}

	.pw-btn--submit {
		align-self: stretch;
		width: 100%;
	}

	.pw-intern--portal-light .pw-letter__head {
		align-items: flex-start;
	}

	.pw-intern--portal-light .pw-letter__act {
		width: 100%;
	}

	.pw-intern--portal-light .pw-letter__act .pw-btn {
		width: 100%;
	}

	.pw-intern--portal-light .pw-letter__act-note {
		max-width: none;
	}

	.pw-chat__header,
	.pw-chat__progress-copy,
	.pw-chat__compose-meta,
	.pw-chat__error {
		align-items: flex-start;
		flex-direction: column;
	}

	.pw-chat__connection {
		align-self: flex-start;
	}

	.pw-chat__message {
		max-width: 90%;
	}

}

/* Four narrow cells wrap badly below the shell width; two rows read better. */
@media (max-width: 880px) {
	.pw-intern--portal-light .pw-facts {
		grid-template-columns: 1fr 1fr;
	}

	.pw-intern--portal-light .pw-fact:nth-child(-n + 2) {
		border-block-end: 1px solid var(--pw-line);
	}

	.pw-intern--portal-light .pw-fact:nth-child(3) {
		border-inline-start: 0;
	}
}

@media (max-width: 560px) {
	.pw-intern--open-letter .pw-facts {
		gap: 10px 16px;
	}

	.pw-intern--open-letter .pw-fact {
		flex-direction: column;
		gap: 2px;
	}

	.pw-intern--open-letter .pw-btn--jump {
		width: 100%;
	}

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

	.pw-chat__send,
	.pw-chat__retry {
		width: 100%;
	}
}

@media (max-width: 420px) {
	.pw-intern--portal-light .pw-facts {
		grid-template-columns: 1fr;
	}

	.pw-intern--portal-light .pw-fact {
		border-inline-start: 0;
		border-block-end: 1px solid var(--pw-line);
	}

	.pw-intern--portal-light .pw-fact:last-child {
		border-block-end: 0;
	}

	.pw-intern--portal-light .pw-letter__ident {
		flex-direction: column;
		gap: 12px;
	}
}

@media (max-width: 380px) {
	.pw-intern {
		--pw-pad: 16px;
	}

	.pw-intern--open-letter .pw-facts {
		grid-template-columns: 1fr;
	}

	.pw-consent {
		padding: 14px;
	}
}

/* ======================================================== reduced motion */

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

	.pw-btn:hover {
		transform: none;
	}

	.pw-btn:hover .pw-btn__arrow {
		transform: rotate(45deg);
	}
}

@media (forced-colors: active) {
	.pw-input,
	.pw-file,
	.pw-status,
	.pw-summary,
	.pw-consent,
	.pw-chat,
	.pw-chat__message,
	.pw-chat__answer,
	.pw-facts,
	.pw-letter__body,
	.pw-intern__apply {
		border: 1px solid CanvasText;
	}

	.pw-progress__bar,
	.pw-chat__progress-bar,
	.pw-chat__connection-dot,
	.pw-step__num,
	.pw-privacy li::before,
	.pw-hang__item::before {
		forced-color-adjust: none;
	}
}