:root {
	--forest-950: #0b2a21;
	--forest-900: #10382c;
	--forest-800: #17483a;
	--forest-700: #245f4c;
	--forest-600: #34745e;
	--cream-50: #fffdf8;
	--cream-100: #f8f2e7;
	--cream-200: #ede3d3;
	--cream-300: #ded0bd;
	--sage-100: #e9efe6;
	--sage-200: #d5e0d1;
	--sage-400: #8fa994;
	--orange-700: #b83f20;
	--orange-600: #d6572c;
	--orange-500: #e76b3d;
	--orange-200: #f5c5ab;
	--orange-100: #fbe2d3;
	--ink: #17352b;
	--muted: #66736d;
	--soft: #89938e;
	--line: #d9ddd6;
	--line-strong: #c2c9c1;
	--paper: rgba(255, 253, 248, 0.95);
	--paper-solid: #fffdf8;
	--positive: #2b7a50;
	--positive-soft: #e2f2e8;
	--warning: #855200;
	--warning-soft: #fff0cf;
	--danger: #b6403d;
	--danger-soft: #fae4e2;
	--info: #326c8b;
	--info-soft: #e4f0f6;
	--shadow: 0 14px 36px rgba(26, 57, 46, 0.14);
	--shadow-soft: 0 5px 18px rgba(26, 57, 46, 0.09);
	--radius-sm: 8px;
	--radius-md: 12px;
	--radius-lg: 18px;
	--topbar-height: 64px;
}

* {
	box-sizing: border-box;
}

.preparation-costs {
	margin: 12px;
	font-size: 0.8rem;
	line-height: 1.55;
}

.preparation-context {
	max-inline-size: 34rem;
	white-space: normal;
	overflow-wrap: anywhere;
	font-size: 0.85rem;
	line-height: 1.5;
}

.preparation-context summary {
	cursor: pointer;
	min-height: 44px;
	padding-block: 12px;
	color: var(--forest-700);
}

.preparation-context p {
	margin-block: 8px;
}

.research-sources {
	padding-inline-start: 20px;
}

.research-sources li {
	margin-block: 12px;
}

.research-sources blockquote {
	margin: 4px 0;
	padding-inline-start: 12px;
	border-inline-start: 2px solid var(--line);
	color: var(--muted);
}

[hidden] {
	display: none !important;
}

html {
	min-height: 100%;
	background: var(--cream-100);
	scroll-behavior: smooth;
}

body {
	min-height: 100vh;
	min-height: 100svh;
	margin: 0;
	padding: env(safe-area-inset-top) env(safe-area-inset-right)
		env(safe-area-inset-bottom) env(safe-area-inset-left);
	color: var(--ink);
	background:
		radial-gradient(circle at 12% 0%, rgba(245, 197, 171, 0.56), transparent 28rem),
		radial-gradient(circle at 95% 15%, rgba(143, 169, 148, 0.48), transparent 32rem),
		var(--cream-100);
	font-family:
		"Segoe UI", Aptos, Calibri, -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 14px;
	line-height: 1.45;
	overflow-wrap: anywhere;
}

button,
input,
select,
textarea {
	font: inherit;
}

button,
a {
	-webkit-tap-highlight-color: transparent;
}

button {
	color: inherit;
}

a {
	color: var(--forest-700);
	text-underline-offset: 2px;
}

img,
svg,
canvas {
	max-width: 100%;
}

h1,
h2,
h3,
p {
	margin-top: 0;
}

h1,
h2,
h3 {
	margin-bottom: 0;
	line-height: 1.04;
	letter-spacing: -0.035em;
	text-wrap: balance;
}

h1 {
	font-size: clamp(2.6rem, 4vw, 4.6rem);
}

h2 {
	font-size: 1.22rem;
}

h3 {
	font-size: 0.96rem;
}

p {
	margin-bottom: 0;
}

small {
	color: var(--muted);
}

code {
	padding: 2px 5px;
	background: var(--cream-100);
	border: 1px solid var(--line);
	border-radius: 5px;
	font-family: Consolas, "Courier New", monospace;
}

.sr-only {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.skip-link {
	position: absolute;
	z-index: 1000;
	top: -100px;
	left: 12px;
	padding: 9px 12px;
	color: white;
	background: var(--forest-950);
	border-radius: 8px;
}

.skip-link:focus-visible {
	top: 10px;
}

:focus-visible {
	outline: 3px solid var(--orange-500);
	outline-offset: 2px;
}

input:focus,
select:focus,
textarea:focus {
	border-color: var(--forest-600);
	box-shadow: 0 0 0 3px var(--sage-200);
	outline: 0;
}

.icon {
	width: 18px;
	height: 18px;
	flex: 0 0 18px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.65;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.shell {
	min-height: 100vh;
}

.app-frame {
	--content-width: 1500px;
	min-height: 100vh;
	min-height: 100svh;
	padding: 14px 18px 8px;
}

.app-frame.view-analytics,
.app-frame.view-settings {
	--content-width: 1786px;
}

.topbar {
	position: relative;
	z-index: 140;
	display: flex;
	width: min(var(--content-width), 100%);
	min-height: var(--topbar-height);
	align-items: center;
	gap: 24px;
	margin: 0 auto;
	padding: 8px 14px;
	color: white;
	background: linear-gradient(90deg, var(--forest-900), var(--forest-800));
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 15px;
	box-shadow: 0 10px 28px rgba(11, 42, 33, 0.23);
}

.brand {
	display: inline-flex;
	min-width: 0;
	align-items: center;
	gap: 11px;
}

.brand-button {
	padding: 0;
	color: inherit;
	background: transparent;
	border: 0;
	cursor: pointer;
	white-space: nowrap;
}

.brand strong {
	font-size: 1.06rem;
	letter-spacing: -0.02em;
}

.brand-mark {
	display: grid;
	width: 40px;
	height: 40px;
	flex: 0 0 40px;
	place-items: center;
	color: var(--forest-950);
	background: linear-gradient(145deg, var(--orange-500), var(--orange-200));
	border-radius: 9px;
	box-shadow: inset 0 1px rgba(255, 255, 255, 0.42);
	font-size: 0.8rem;
	font-weight: 900;
	letter-spacing: -0.04em;
}

.top-nav {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	gap: 3px;
	margin: 0 auto;
}

.top-nav button {
	min-height: 44px;
	padding: 7px 12px;
	color: rgba(255, 255, 255, 0.86);
	background: transparent;
	border: 0;
	border-radius: 10px;
	cursor: pointer;
	font-size: 0.84rem;
	font-weight: 600;
}

.top-nav button:hover,
.top-nav button.active {
	color: white;
	background: rgba(255, 255, 255, 0.1);
}

.top-actions {
	display: flex;
	min-width: 0;
	align-items: center;
	gap: 12px;
	margin-left: auto;
	white-space: nowrap;
}

.top-email {
	min-width: 0;
	max-width: 220px;
	overflow: hidden;
	color: rgba(255, 255, 255, 0.86);
	font-size: 0.78rem;
	text-overflow: ellipsis;
}

.sign-out-button,
.sign-in-button {
	min-height: max(40px, var(--touch-target-size, 0px));
	padding: 8px 18px;
	color: var(--forest-950);
	background: white;
	border: 0;
	border-radius: 999px;
	font-size: 0.82rem;
	font-weight: 800;
	text-decoration: none;
}

.mobile-nav-toggle {
	display: none;
	width: max(42px, var(--touch-target-size, 0px));
	height: max(42px, var(--touch-target-size, 0px));
	padding: 0;
	place-items: center;
	color: white;
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: 9px;
}

.sign-out-button .icon,
.mobile-nav-close {
	display: none;
}

.nav-scrim {
	display: none;
}

#main-content {
	width: min(var(--content-width), 100%);
	margin: 0 auto;
}

.app-frame.view-analytics {
	position: relative;
}

.view-analytics #main-content,
.view-settings #main-content {
	position: relative;
	z-index: 1;
}

.app-frame.view-analytics::after {
	position: absolute;
	z-index: 0;
	top: 286px;
	right: 0;
	width: 132px;
	height: 572px;
	background: url("/art/analytics-side.webp") center / cover no-repeat;
	content: "";
}

.site-footer {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 9px;
	margin: 18px auto 0;
	color: var(--muted);
	font-size: 0.72rem;
}

.site-footer a {
	display: inline-flex;
	min-width: var(--touch-target-size, 0px);
	min-height: var(--touch-target-size, 0px);
	align-items: center;
	justify-content: center;
	color: inherit;
}

button,
.button {
	display: inline-flex;
	min-width: var(--touch-target-size, 0px);
	min-height: max(40px, var(--touch-target-size, 0px));
	align-items: center;
	justify-content: center;
	gap: 7px;
	padding: 7px 14px;
	color: var(--forest-900);
	background: var(--paper-solid);
	border: 1px solid var(--line-strong);
	border-radius: 9px;
	cursor: pointer;
	font-weight: 750;
	line-height: 1.2;
	text-decoration: none;
	transition:
		background-color 120ms ease,
		border-color 120ms ease,
		transform 120ms ease;
}

button:hover,
.button:hover {
	border-color: var(--forest-600);
	transform: translateY(-1px);
}

button.primary,
.button.primary {
	color: white;
	background: linear-gradient(90deg, var(--orange-600), var(--orange-500));
	border-color: var(--orange-600);
}

button.secondary,
.button.secondary {
	color: var(--forest-900);
	background: rgba(255, 255, 255, 0.86);
	border-color: var(--line-strong);
}

button.danger,
.button.danger {
	color: var(--danger);
	background: var(--danger-soft);
	border-color: #efbbb7;
}

button:disabled {
	cursor: not-allowed;
	opacity: 0.48;
	transform: none;
}

.text-button {
	min-height: max(30px, var(--touch-target-size, 0px));
	padding: 3px 5px;
	color: var(--forest-700);
	background: transparent;
	border: 0;
	font-size: 0.72rem;
	text-decoration: underline;
}

.full-width {
	width: 100%;
}

.actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 9px;
	flex-wrap: wrap;
	margin-top: 14px;
}

.eyebrow {
	margin-bottom: 6px;
	color: var(--forest-700);
	font-size: 0.68rem;
	font-weight: 900;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.reference-hero {
	position: relative;
	display: flex;
	height: auto;
	align-items: center;
	margin-top: 4px;
	overflow: hidden;
	background-color: var(--cream-100);
	background-position: right center;
	background-repeat: no-repeat;
	background-size: auto 100%;
	border-radius: 0 0 18px 18px;
}

.reference-hero::after {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		90deg,
		rgba(255, 248, 237, 0.98) 0%,
		rgba(255, 248, 237, 0.94) 33%,
		rgba(255, 248, 237, 0.56) 53%,
		rgba(255, 248, 237, 0) 72%
	);
	content: "";
}

.reference-hero-copy {
	position: relative;
	z-index: 2;
	min-width: 0;
	width: 48%;
	padding: 28px 32px;
}

.reference-hero h1 {
	font-size: clamp(2.55rem, 3.65vw, 4.25rem);
}

.reference-hero h1 span {
	color: var(--orange-600);
}

.reference-hero-copy > p:not(.eyebrow) {
	max-width: 570px;
	margin-top: 11px;
	color: #495d54;
	font-size: 1rem;
}

.reference-hero-actions {
	display: flex;
	gap: 11px;
	margin-top: 18px;
	flex-wrap: wrap;
}

.jobs-reference-hero {
	min-height: 216px;
	margin-top: 2px;
	background-image: url("/art/jobs-hero.webp");
}

.applications-reference-hero {
	min-height: 269px;
	background-image: url("/art/applications-hero.webp");
}

.networking-reference-hero {
	min-height: 247px;
	margin-top: -4px;
	background-image: url("/art/networking-hero.webp");
}

.analytics-reference-hero {
	min-height: 217px;
	margin-top: -8px;
	background-image: url("/art/analytics-hero.webp");
}

.settings-reference-hero {
	min-height: 185px;
	margin-top: 6px;
	background-image: url("/art/settings-hero.webp");
}

.reference-metrics {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 10px;
	margin: 0 0 12px;
	padding-top: 0;
}

.reference-metric {
	display: flex;
	min-height: 84px;
	align-items: center;
	gap: 14px;
	padding: 14px 18px;
	background: var(--paper);
	border: 1px solid rgba(210, 213, 207, 0.92);
	border-radius: 12px;
	box-shadow: var(--shadow-soft);
	backdrop-filter: blur(12px);
}

.reference-metric-icon {
	display: grid;
	width: 45px;
	height: 45px;
	flex: 0 0 45px;
	place-items: center;
	color: var(--forest-700);
	background: var(--sage-100);
	border-radius: 11px;
}

.reference-metric:nth-child(2n) .reference-metric-icon {
	color: var(--orange-700);
	background: var(--orange-100);
}

.reference-metric > div {
	min-width: 0;
}

.reference-metric div > strong,
.reference-metric div > span {
	display: block;
}

.reference-metric strong {
	font-size: 1.7rem;
	line-height: 1;
	letter-spacing: -0.055em;
}

.reference-metric div > span {
	margin-top: 4px;
	color: var(--muted);
	font-size: 0.76rem;
}

.view-networking .reference-metric {
	min-height: 74px;
}

.catalog-warning {
	margin: 8px 0 10px;
}

.notice {
	padding: 10px 12px;
	color: var(--info);
	background: var(--info-soft);
	border: 1px solid rgba(50, 108, 139, 0.15);
	border-radius: 8px;
	font-size: 0.78rem;
}

.notice.warning {
	color: var(--warning);
	background: var(--warning-soft);
	border-color: rgba(154, 100, 17, 0.16);
}

.notice.danger {
	color: var(--danger);
	background: var(--danger-soft);
	border-color: rgba(182, 64, 61, 0.17);
}

.jobs-reference-layout {
	display: grid;
	grid-template-columns: 228px minmax(0, 1fr) 208px;
	gap: 12px;
	align-items: start;
}

.jobs-filter-form {
	display: contents;
}

.job-search-strip {
	grid-column: 1 / -1;
	display: grid;
	min-height: 72px;
	grid-template-columns: minmax(360px, 1.7fr) repeat(4, minmax(130px, 0.55fr)) 92px;
	gap: 10px;
	align-items: end;
	padding: 7px 14px;
	background: rgba(255, 253, 248, 0.92);
	border: 1px solid var(--line);
	border-radius: 13px;
	box-shadow: var(--shadow-soft);
}

.job-search-strip label {
	display: grid;
	gap: 4px;
	color: var(--muted);
	font-size: 0.68rem;
	font-weight: 700;
}

.job-search-strip label > span:not(.sr-only) {
	padding-left: 3px;
}

.search-field {
	position: relative;
}

.search-field .icon,
.inline-search .icon {
	position: absolute;
	z-index: 1;
	top: 50%;
	left: 12px;
	width: 17px;
	height: 17px;
	color: var(--muted);
	transform: translateY(-50%);
}

.search-field input,
.inline-search input {
	padding-left: 37px;
}

.filter-panel,
.jobs-results-panel,
.jobs-activity-rail > *,
.tracker-filters,
.tracker-table-panel,
.rail-panel,
.analytics-panel,
.settings-reference-card,
.journey-detail,
.journey-dock,
.feature-card,
.activity-panel {
	background: var(--paper);
	border: 1px solid var(--line);
	box-shadow: var(--shadow-soft);
	backdrop-filter: blur(12px);
}

.filter-panel {
	grid-column: 1;
	display: grid;
	gap: 13px;
	padding: 15px;
	border-radius: 11px;
}

.filter-panel-heading,
.tracker-filter-heading,
.rail-panel-heading,
.analytics-panel-heading,
.table-panel-heading {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
}

.filter-panel label,
.tracker-filters label {
	display: grid;
	gap: 5px;
	color: var(--forest-900);
	font-size: 0.73rem;
	font-weight: 750;
}

.quick-filter-group {
	display: grid;
	gap: 4px;
	padding: 0;
	min-width: 0;
	margin: 0;
	border: 0;
}

.quick-filter-group legend {
	margin-bottom: 4px;
	font-size: 0.72rem;
	font-weight: 850;
}

.quick-filter-group button {
	display: grid;
	min-height: max(24px, var(--touch-target-size, 0px));
	grid-template-columns: 13px 1fr auto;
	gap: 6px;
	align-items: center;
	justify-content: stretch;
	padding: 2px 4px;
	background: transparent;
	border: 0;
	border-radius: 5px;
	font-size: 0.62rem;
	font-weight: 600;
	text-align: left;
}

.quick-filter-group button > span {
	width: 12px;
	height: 12px;
	border: 1px solid var(--line-strong);
	border-radius: 3px;
}

.quick-filter-group button.active > span {
	background: var(--forest-700);
	border-color: var(--forest-700);
	box-shadow: inset 0 0 0 2px white;
}

.quick-filter-group button small {
	font-size: 0.55rem;
}

.filter-summary {
	display: flex;
	gap: 7px;
	flex-wrap: wrap;
}

.filter-summary span {
	padding: 4px 7px;
	color: #43564d;
	background: var(--cream-100);
	border-radius: 999px;
	font-size: 0.66rem;
}

.saved-filter p,
.filter-footnote {
	color: var(--muted);
	font-size: 0.72rem;
}

.jobs-results-panel {
	grid-column: 2;
	min-width: 0;
	padding: 15px;
	border-radius: 11px;
}

.results-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 13px;
}

.results-toolbar > div:first-child {
	display: flex;
	align-items: center;
	gap: 10px;
}

.results-toolbar h2 {
	margin: 0;
	font-size: 1.15rem;
	letter-spacing: -0.025em;
}

.collection-tabs {
	display: flex;
	gap: 5px;
}

.collection-tabs button {
	min-height: max(30px, var(--touch-target-size, 0px));
	padding: 4px 8px;
	background: transparent;
	border: 0;
	border-radius: 7px;
	font-size: 0.71rem;
}

.collection-tabs button.active {
	color: white;
	background: var(--forest-800);
}

.collection-tabs button span {
	margin-left: 3px;
	padding: 1px 5px;
	background: rgba(255, 255, 255, 0.18);
	border-radius: 99px;
}

.layout-toggle {
	display: flex;
	gap: 3px;
	padding: 3px;
	background: var(--cream-100);
	border: 1px solid var(--line);
	border-radius: 8px;
}

.layout-toggle button {
	min-height: max(34px, var(--touch-target-size, 0px));
	padding: 5px 9px;
	background: transparent;
	border: 0;
	font-size: 0.7rem;
}

.layout-toggle button.active {
	color: white;
	background: var(--forest-800);
}

.job-cards {
	display: grid;
	gap: 11px;
}

.job-cards.grid-view {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.job-cards.list-view {
	grid-template-columns: 1fr;
}

.job-card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	align-content: start;
	gap: 8px;
	padding: 14px;
	background: rgba(255, 255, 255, 0.78);
	border: 1px solid #e1e4df;
	border-radius: 10px;
	box-shadow: 0 3px 11px rgba(35, 68, 55, 0.07);
}

.job-card-heading {
	display: grid;
	grid-template-columns: 42px minmax(0, 1fr) auto;
	gap: 9px;
	align-items: start;
}

.company-tile {
	display: grid;
	width: 42px;
	height: 42px;
	place-items: center;
	color: var(--forest-950);
	background: var(--sage-200);
	border-radius: 7px;
	font-size: 0.78rem;
	font-weight: 900;
}

.company-tone-1 {
	background: var(--orange-100);
}

.company-tone-2 {
	background: #e6eef3;
}

.company-tone-3 {
	background: #ece7d8;
}

.company-tone-4 {
	color: white;
	background: var(--forest-600);
}

.company-tone-5 {
	color: white;
	background: var(--orange-700);
}

.job-card-title {
	min-width: 0;
}

.job-card-title h3 {
	font-size: 0.9rem;
	line-height: 1.2;
}

.job-company {
	margin-top: 3px;
	color: var(--muted);
	font-size: 0.7rem;
}

.bookmark-button,
.row-action-button {
	display: grid;
	width: max(32px, var(--touch-target-size, 0px));
	min-height: max(32px, var(--touch-target-size, 0px));
	padding: 0;
	place-items: center;
	background: transparent;
	border: 0;
	border-radius: 7px;
}

.bookmark-button.active {
	color: var(--orange-600);
	background: var(--orange-100);
}

.job-card-actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 4px;
}

.job-location {
	color: var(--muted);
	font-size: 0.69rem;
}

.job-meta {
	display: flex;
	gap: 9px;
	flex-wrap: wrap;
	color: var(--muted);
	font-size: 0.65rem;
}

.job-meta span {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

.job-meta .icon {
	width: 13px;
	height: 13px;
	flex-basis: 13px;
}

.chips {
	display: flex;
	gap: 5px;
	flex-wrap: wrap;
}

.chip,
.status {
	display: inline-flex;
	min-height: 22px;
	align-items: center;
	padding: 3px 7px;
	border-radius: 999px;
	font-size: 0.61rem;
	font-weight: 800;
}

.chip {
	color: #43564d;
	background: #eff1ee;
	border: 1px solid #e1e4df;
}

.chip-strong {
	color: var(--positive);
	background: var(--positive-soft);
	border-color: #c8e7d3;
}

.chip-warning {
	color: #704500;
	background: var(--warning-soft);
	border-color: #eedba9;
}

.status {
	color: var(--info);
	background: var(--info-soft);
	white-space: nowrap;
}

.status-draft_ready,
.status-sent,
.status-applied,
.status-interviewing,
.status-pending {
	color: #704500;
	background: var(--warning-soft);
}

.status-replied,
.status-offer,
.status-approved {
	color: var(--positive);
	background: var(--positive-soft);
}

.status-error,
.status-rejected,
.status-sending,
.status-revoked,
.status-denied {
	color: var(--danger);
	background: var(--danger-soft);
}

.status-saved {
	color: var(--info);
	background: var(--info-soft);
}

.status-archived {
	color: var(--muted);
	background: #eceeeb;
}

.job-description {
	display: -webkit-box;
	min-height: 39px;
	overflow: hidden;
	color: #5f6f67;
	font-size: 0.68rem;
	line-height: 1.4;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.adzuna-attribution {
	display: inline-flex;
	width: max-content;
	min-width: 116px;
	min-height: 23px;
	align-items: center;
	gap: 5px;
	color: var(--ink);
	font-size: 0.68rem;
	font-weight: 800;
	line-height: 23px;
	text-decoration: none;
}

.adzuna-attribution img {
	display: block;
	width: 87px;
	height: 23px;
	object-fit: contain;
}

.job-controls {
	display: grid;
	grid-template-columns: 0.7fr 1.3fr;
	gap: 8px;
	margin-top: auto;
}

.job-controls .button,
.job-controls button {
	min-height: max(35px, var(--touch-target-size, 0px));
	padding: 6px 9px;
	font-size: 0.7rem;
}

.job-more {
	position: relative;
}

.job-more summary {
	display: grid;
	width: max(30px, var(--touch-target-size, 0px));
	height: max(30px, var(--touch-target-size, 0px));
	place-items: center;
	color: var(--muted);
	cursor: pointer;
	list-style: none;
	border-radius: 7px;
}

.job-more summary::-webkit-details-marker {
	display: none;
}

.job-more[open] summary {
	background: var(--sage-100);
}

.job-more-menu {
	position: absolute;
	z-index: 30;
	top: calc(100% + 4px);
	right: 0;
	display: grid;
	gap: 7px;
	width: 220px;
	padding: 10px;
	background: var(--paper-solid);
	border: 1px solid var(--line);
	border-radius: 9px;
	box-shadow: var(--shadow);
}

.job-more label {
	display: grid;
	gap: 4px;
	font-size: 0.66rem;
	font-weight: 750;
}

.outreach-summary {
	color: var(--muted);
	font-size: 0.64rem;
}

.list-view .job-card {
	display: grid;
	grid-template-columns: 52px minmax(220px, 1.1fr) minmax(180px, 0.85fr) auto;
	align-items: center;
}

.list-view .job-card-heading {
	grid-column: 1 / 3;
}

.list-view .job-location,
.list-view .job-meta,
.list-view .job-tags,
.list-view .job-description,
.list-view .adzuna-attribution {
	grid-column: 2 / 4;
}

.list-view .job-controls {
	grid-column: 4;
	grid-row: 1 / span 5;
	min-width: 180px;
}

.jobs-activity-rail {
	grid-column: 3;
	display: grid;
	gap: 10px;
}

.rail-art {
	min-height: 160px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	border-radius: 11px;
}

.rail-art-jobs {
	background-image: url("/art/jobs-rail.webp");
}

.rail-callout {
	padding: 16px;
	color: white;
	background: linear-gradient(150deg, var(--forest-900), var(--forest-700));
	border-radius: 11px;
}

.rail-callout strong {
	font-size: 1.1rem;
	line-height: 1.25;
}

.rail-activity-card {
	display: grid;
	gap: 9px;
	padding: 14px;
	border-radius: 11px;
}

.rail-activity-card h2 {
	margin-bottom: 3px;
}

.catalog-card p {
	display: grid;
	gap: 3px;
	color: var(--muted);
	font-size: 0.64rem;
}

.catalog-card p strong {
	color: var(--forest-800);
	font-size: 0.72rem;
}

.mini-metric {
	display: flex;
	align-items: center;
	gap: 9px;
}

.mini-metric > span {
	display: grid;
	width: 33px;
	height: 33px;
	flex: 0 0 33px;
	place-items: center;
	color: var(--forest-700);
	background: var(--sage-100);
	border-radius: 8px;
}

.mini-metric strong,
.mini-metric small {
	display: block;
}

.mini-metric strong {
	font-size: 0.94rem;
}

.mini-metric small {
	font-size: 0.64rem;
}

.pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-top: 14px;
	color: var(--muted);
	font-size: 0.72rem;
	font-weight: 750;
}

.tracker-layout {
	display: grid;
	grid-template-columns: 203px minmax(0, 1fr) 299px;
	gap: 12px;
	align-items: start;
}

.networking-layout {
	grid-template-columns: 189px minmax(0, 1fr) 278px;
}

.networking-layout .tracker-filters {
	gap: 6px;
	padding: 10px;
}

.networking-layout .tracker-filters fieldset {
	gap: 2px;
}

.networking-layout .tracker-filters fieldset button {
	min-height: max(44px, var(--touch-target-size, 0px));
	padding: 8px 12px;
}

.networking-layout .tracker-filters input {
	height: 30px;
}

.networking-layout .filter-footnote {
	font-size: 0.55rem;
	line-height: 1.2;
}

.tracker-filters {
	display: grid;
	gap: 13px;
	padding: 14px;
	border-radius: 11px;
}

.tracker-filters fieldset {
	display: grid;
	gap: 5px;
	padding: 0;
	min-width: 0;
	margin: 0;
	border: 0;
}

.tracker-filters legend {
	margin-bottom: 6px;
	font-size: 0.72rem;
	font-weight: 850;
}

.tracker-filters fieldset button {
	display: flex;
	min-height: max(29px, var(--touch-target-size, 0px));
	justify-content: space-between;
	padding: 4px 7px;
	background: transparent;
	border: 0;
	border-radius: 7px;
	font-size: 0.69rem;
	font-weight: 650;
}

.tracker-filters fieldset button.active {
	color: var(--cp-accent-fg, white);
	background: var(--forest-800);
}

.tracker-filters fieldset button span {
	padding: 1px 5px;
	background: rgba(143, 169, 148, 0.18);
	border-radius: 99px;
	font-size: 0.6rem;
}

.tracker-table-panel {
	min-width: 0;
	padding: 10px;
	border-radius: 11px;
}

.data-table thead th {
	position: sticky;
	z-index: 2;
	top: 0;
}

.table-panel-heading {
	align-items: center;
	margin-bottom: 7px;
}

.table-panel-heading h2 {
	margin-bottom: 3px;
	font-size: 1.1rem;
}

.table-panel-heading p {
	color: var(--muted);
	font-size: 0.68rem;
}

.table-tools {
	display: flex;
	min-width: 0;
	flex-wrap: wrap;
	align-items: end;
	gap: 9px;
}

.table-tools label {
	display: grid;
	gap: 4px;
	color: var(--muted);
	font-size: 0.62rem;
	font-weight: 750;
}

.inline-search {
	position: relative;
	min-width: 240px;
}

.inline-search .icon {
	top: 50%;
}

.responsive-table-wrap {
	max-width: 100%;
	max-height: min(60vh, 560px);
	overflow: auto;
	overscroll-behavior: contain;
	border: 1px solid #e2e5e0;
	border-radius: 9px;
}

.data-table {
	width: 100%;
	min-width: 780px;
	border-collapse: collapse;
	background: rgba(255, 255, 255, 0.65);
	font-size: 0.72rem;
	line-height: 1.35;
}

.data-table th,
.data-table td {
	padding: 8px;
	text-align: left;
	vertical-align: middle;
	border-bottom: 1px solid #e6e8e4;
}

.data-table th {
	color: #42564d;
	background: #f4f2eb;
	font-size: 0.61rem;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	white-space: nowrap;
}

.data-table tr:last-child td {
	border-bottom: 0;
}

.data-table tbody tr:hover {
	background: rgba(233, 239, 230, 0.65);
}

.table-company,
.person-cell {
	display: flex;
	min-width: 150px;
	align-items: center;
	gap: 8px;
}

.table-company .company-tile {
	width: 24px;
	height: 24px;
	flex: 0 0 24px;
	font-size: 0.58rem;
}

.table-role,
.table-note {
	display: block;
	max-width: 190px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.table-muted {
	color: var(--muted);
}

.table-role {
	overflow: visible;
	white-space: normal;
}

.tracker-right-rail {
	display: grid;
	gap: 10px;
}

.rail-panel {
	padding: 14px;
	border-radius: 11px;
}

.rail-panel h2 {
	font-size: 0.95rem;
}

.rail-panel-heading {
	align-items: center;
	margin-bottom: 10px;
}

.notes-rail ul,
.reply-list,
.workflow-rail ol {
	display: grid;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.notes-rail li,
.reply-list li {
	display: grid;
	gap: 2px;
	padding: 8px 0;
	border-top: 1px solid #e4e7e2;
}

.notes-rail li:first-child,
.reply-list li:first-child {
	border-top: 0;
}

.notes-rail li strong,
.reply-list li strong {
	font-size: 0.74rem;
}

.notes-rail li span,
.reply-list li span,
.reply-list time {
	color: var(--muted);
	font-size: 0.65rem;
}

.rail-empty {
	display: grid;
	min-height: 145px;
	place-items: center;
	align-content: center;
	gap: 5px;
	color: var(--muted);
	text-align: center;
}

.rail-empty .icon {
	width: 30px;
	height: 30px;
}

.rail-empty strong,
.rail-empty span {
	display: block;
}

.rail-empty span {
	max-width: 190px;
	font-size: 0.68rem;
}

.rail-art-applications {
	min-height: 116px;
	background-image: url("/art/applications-desk.webp");
}

.rail-art-networking {
	min-height: 116px;
	background-image: url("/art/networking-desk.webp");
}

.workflow-rail ol {
	grid-template-columns: repeat(5, 1fr);
}

.outreach-queue {
	display: grid;
	gap: 8px;
}

.workflow-rail li {
	display: grid;
	place-items: center;
	gap: 4px;
	color: var(--muted);
	font-size: 0.58rem;
	text-align: center;
}

.workflow-rail li b {
	display: grid;
	width: 25px;
	height: 25px;
	place-items: center;
	color: white;
	background: var(--forest-700);
	border-radius: 50%;
	font-size: 0.62rem;
}

.person-avatar {
	display: grid;
	width: 24px;
	height: 24px;
	flex: 0 0 24px;
	place-items: center;
	color: var(--cp-accent-fg, white);
	background: var(--forest-700);
	border-radius: 50%;
	font-size: 0.57rem;
	font-weight: 850;
}

.person-cell > span:last-child {
	display: grid;
}

.person-cell small {
	font-size: 0.59rem;
}

.table-actions {
	display: flex;
	gap: 5px;
	flex-wrap: wrap;
}

.table-action {
	min-height: max(26px, var(--touch-target-size, 0px));
	padding: 3px 6px;
	font-size: 0.62rem;
}

.reply-preview {
	display: block;
	max-width: 160px;
	overflow: hidden;
	color: var(--cp-link, var(--info));
	text-overflow: ellipsis;
	white-space: nowrap;
}

.row-error {
	display: block;
	max-width: 210px;
	margin-top: 4px;
	color: var(--danger);
	font-size: 0.58rem;
}

.broader-match-row {
	background: rgba(255, 240, 207, 0.28);
}

.donut-layout {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
}

.donut-chart {
	position: relative;
	width: 116px;
	height: 116px;
	flex: 0 0 116px;
}

.donut-chart svg {
	display: block;
	width: 100%;
	height: 100%;
	transform: rotate(-90deg);
}

.donut-track,
.donut-segment {
	fill: none;
	stroke-width: 12;
}

.donut-track {
	stroke: #e2e3df;
}

.donut-applied {
	stroke: #5a8b78;
}

.donut-interviewing {
	stroke: #7bb0d8;
}

.donut-offer {
	stroke: var(--orange-600);
}

.donut-rejected {
	stroke: #d85f58;
}

.donut-chart > div {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	align-content: center;
}

.donut-chart strong {
	font-size: 1.45rem;
}

.donut-chart span {
	color: var(--muted);
	font-size: 0.62rem;
}

.donut-legend,
.network-impact ul {
	display: grid;
	gap: 7px;
	margin: 0;
	padding: 0;
	list-style: none;
	flex: 1 1 110px;
	min-width: 0;
}

.donut-legend li,
.network-impact li {
	display: grid;
	grid-template-columns: 9px 1fr auto;
	gap: 7px;
	align-items: center;
	color: var(--muted);
	font-size: 0.65rem;
}

.legend-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
}

.legend-applied {
	background: #5a8b78;
}

.legend-interviewing {
	background: #7bb0d8;
}

.legend-offer {
	background: var(--orange-600);
}

.legend-rejected {
	background: #d85f58;
}

.rail-page {
	display: grid;
	grid-template-columns: 170px minmax(0, 1fr);
	gap: 18px;
	align-items: start;
}

.dark-side-rail {
	position: sticky;
	top: 14px;
	display: flex;
	min-height: 620px;
	flex-direction: column;
	margin-top: 140px;
	padding: 16px 11px;
	color: white;
	background: linear-gradient(160deg, var(--forest-950), var(--forest-800));
	border-radius: 0 14px 14px 0;
	box-shadow: var(--shadow);
}

.view-settings .dark-side-rail {
	min-height: 590px;
	margin-top: 108px;
}

.dark-side-rail nav {
	display: grid;
	gap: 5px;
}

.dark-side-rail nav button {
	display: flex;
	min-height: 44px;
	justify-content: flex-start;
	gap: 11px;
	padding: 7px 10px;
	color: rgba(255, 255, 255, 0.85);
	background: transparent;
	border: 0;
	border-radius: 9px;
	font-size: 0.75rem;
}

.dark-side-rail nav button.active {
	color: white;
	background: rgba(255, 255, 255, 0.12);
}

.dark-side-rail > p {
	max-width: 115px;
	margin: auto auto 20px;
	font-family: "Segoe Print", "Bradley Hand", cursive;
	font-size: 1rem;
	line-height: 1.25;
}

.dark-side-rail > p span {
	display: block;
	width: 28px;
	height: 3px;
	margin-top: 12px;
	background: var(--orange-500);
	transform: rotate(-4deg);
}

.rail-page-content {
	min-width: 0;
}

.view-analytics .reference-metrics,
.view-settings .reference-metrics {
	margin-top: 0;
}

.analytics-reference-grid {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 12px;
}

.analytics-panel {
	min-width: 0;
	padding: 14px;
	border-radius: 11px;
}

.analytics-panel-heading {
	margin-bottom: 9px;
}

.analytics-panel-heading h2 {
	margin-bottom: 2px;
	font-size: 0.92rem;
}

.analytics-panel-heading p,
.analytics-panel-heading > span {
	color: var(--muted);
	font-size: 0.62rem;
}

.funnel-panel {
	grid-column: span 4;
}

.timeline-panel {
	grid-column: span 5;
}

.status-panel {
	grid-column: span 3;
}

.companies-panel {
	grid-column: span 4;
}

.networking-impact-panel {
	grid-column: span 3;
}

.heatmap-panel {
	grid-column: span 4;
}

.companies-panel,
.networking-impact-panel,
.heatmap-panel {
	padding: 12px;
}

.metric-bars {
	display: grid;
	gap: 10px;
}

.metric-bar-row {
	display: grid;
	gap: 5px;
}

.metric-bar-label {
	display: flex;
	justify-content: space-between;
	font-size: 0.64rem;
}

.metric-bar-track {
	height: 8px;
	overflow: hidden;
	background: #e3e5e1;
	border-radius: 999px;
}

.metric-bar-fill {
	display: block;
	width: 0;
	height: 100%;
	background: linear-gradient(90deg, var(--forest-600), var(--orange-500));
	border-radius: inherit;
}

.metric-level-1 {
	width: 10%;
}

.metric-level-2 {
	width: 20%;
}

.metric-level-3 {
	width: 30%;
}

.metric-level-4 {
	width: 40%;
}

.metric-level-5 {
	width: 50%;
}

.metric-level-6 {
	width: 60%;
}

.metric-level-7 {
	width: 70%;
}

.metric-level-8 {
	width: 80%;
}

.metric-level-9 {
	width: 90%;
}

.metric-level-10 {
	width: 100%;
}

.timeline-chart svg {
	display: block;
	width: 100%;
	height: 125px;
}

.timeline-grid {
	fill: none;
	stroke: #e0e4df;
	stroke-width: 1;
}

.timeline-line {
	fill: none;
	stroke: var(--forest-600);
	stroke-width: 2.5;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.timeline-point {
	fill: var(--forest-700);
}

.timeline-labels {
	display: flex;
	justify-content: space-between;
	color: var(--muted);
	font-size: 0.58rem;
}

.company-ranking {
	display: grid;
	gap: 5px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.company-ranking li {
	display: grid;
	gap: 4px;
}

.company-ranking li > div:first-child {
	display: flex;
	gap: 8px;
	justify-content: space-between;
	font-size: 0.62rem;
}

.network-impact {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
}

.impact-ring {
	display: grid;
	width: 108px;
	height: 108px;
	flex: 0 0 108px;
	place-items: center;
	align-content: center;
	background:
		radial-gradient(circle, var(--paper-solid) 0 45%, transparent 46%),
		conic-gradient(var(--forest-600) 0 68%, var(--cream-300) 68% 100%);
	border-radius: 50%;
}

.impact-ring strong,
.impact-ring span {
	display: block;
	text-align: center;
}

.impact-ring strong {
	font-size: 1.45rem;
}

.impact-ring span {
	max-width: 55px;
	color: var(--muted);
	font-size: 0.55rem;
	line-height: 1.1;
}

.activity-heatmap {
	display: grid;
	grid-template-columns: repeat(14, minmax(8px, 1fr));
	gap: 4px;
}

.activity-cell {
	aspect-ratio: 1;
	background: #eee9df;
	border-radius: 2px;
}

.activity-level-1 {
	background: #dce6d9;
}

.activity-level-2 {
	background: #9eb5a0;
}

.activity-level-3 {
	background: #54806c;
}

.activity-level-4 {
	background: var(--forest-950);
}

.activity-legend {
	display: flex;
	justify-content: space-between;
	margin-top: 7px;
	color: var(--muted);
	font-size: 0.56rem;
}

.chart-empty {
	display: grid;
	min-height: 112px;
	place-items: center;
	color: var(--muted);
	background:
		linear-gradient(#e5e8e3 1px, transparent 1px),
		linear-gradient(90deg, #e5e8e3 1px, transparent 1px);
	background-size: 32px 24px;
	border-radius: 8px;
	font-size: 0.66rem;
	text-align: center;
}

.analytics-loading-panel {
	padding: 18px;
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: 11px;
}

.activity-panel {
	margin-top: 12px;
	padding: 14px;
	border-radius: 11px;
}

.activity-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 18px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.activity-list li {
	display: grid;
	grid-template-columns: 32px minmax(0, 1fr) auto;
	gap: 8px;
	align-items: center;
	padding: 7px 0;
	border-top: 1px solid #e5e7e3;
}

.activity-marker {
	display: grid;
	width: 30px;
	height: 30px;
	place-items: center;
	color: var(--forest-700);
	background: var(--sage-100);
	border-radius: 7px;
}

.activity-list div {
	display: grid;
}

.activity-list strong {
	font-size: 0.68rem;
}

.activity-list span,
.activity-list time {
	color: var(--muted);
	font-size: 0.58rem;
}

.settings-reference-grid {
	display: grid;
	grid-template-columns: repeat(15, minmax(0, 1fr));
	gap: 12px;
}

.settings-reference-card {
	container-type: inline-size;
	min-width: 0;
	padding: 18px;
	border-radius: 11px;
}

.account-card,
.preferences-card,
.privacy-card {
	grid-column: span 5;
	min-height: 350px;
}

.integrations-card {
	grid-column: span 5;
	min-height: 190px;
}

.appearance-card {
	grid-column: span 4;
	min-height: 190px;
}

.about-card {
	grid-column: span 3;
	min-height: 190px;
}

.settings-notebook-art {
	grid-column: span 3;
	min-height: 202px;
	background: url("/art/settings-notebook.webp") center / cover no-repeat;
	border-radius: 11px;
	box-shadow: var(--shadow-soft);
}

.settings-card-heading {
	display: grid;
	grid-template-columns: 42px minmax(0, 1fr) auto;
	gap: 11px;
	align-items: start;
	margin-bottom: 14px;
}

.settings-card-heading > span:first-child {
	display: grid;
	width: 42px;
	height: 42px;
	place-items: center;
	color: var(--forest-800);
	background: var(--sage-100);
	border-radius: 50%;
}

.settings-card-heading h2 {
	margin-bottom: 3px;
	font-size: 1rem;
}

.settings-card-heading p {
	color: var(--muted);
	font-size: 0.64rem;
}

.settings-card-heading button {
	min-height: max(34px, var(--touch-target-size, 0px));
	padding: 5px 10px;
	font-size: 0.66rem;
}

.account-summary {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 14px;
}

.account-avatar {
	display: grid;
	width: 58px;
	height: 58px;
	flex: 0 0 58px;
	place-items: center;
	color: white;
	background: var(--forest-900);
	border-radius: 50%;
	font-size: 1rem;
	font-weight: 850;
}

.account-summary > div {
	display: grid;
	min-width: 0;
}

.account-summary strong {
	font-size: 0.78rem;
}

.account-summary span {
	color: var(--muted);
	font-size: 0.66rem;
}

.account-summary .account-avatar {
	color: white;
}

.compact-definition-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin: 0;
}

.compact-definition-grid div {
	display: grid;
	gap: 4px;
}

.compact-definition-grid dt {
	color: var(--muted);
	font-size: 0.62rem;
}

.compact-definition-grid dd {
	min-height: 36px;
	padding: 8px 9px;
	margin: 0;
	background: #f6f5f1;
	border: 1px solid var(--line);
	border-radius: 7px;
	font-size: 0.68rem;
}

.settings-summary-list {
	display: grid;
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.settings-summary-list li {
	padding: 9px 0;
	border-top: 1px solid #e5e7e3;
}

.settings-summary-list li:first-child {
	border-top: 0;
}

.settings-summary-list li > span {
	display: grid;
	grid-template-columns: 22px minmax(0, 1fr) auto;
	gap: 8px;
	align-items: center;
}

.settings-summary-list b {
	font-size: 0.69rem;
}

.settings-summary-list small {
	max-width: 130px;
	font-size: 0.61rem;
}

.privacy-card details,
.credentials-details {
	border-top: 1px solid #e5e7e3;
}

.privacy-card details summary,
.credentials-details summary,
.settings-row-link {
	display: grid;
	min-height: 48px;
	grid-template-columns: 22px 1fr 18px;
	gap: 8px;
	align-items: center;
	color: var(--ink);
	cursor: pointer;
	list-style: none;
	text-decoration: none;
}

.privacy-card summary::-webkit-details-marker,
.credentials-details summary::-webkit-details-marker {
	display: none;
}

.privacy-card summary span,
.settings-row-link span,
.credentials-details summary span {
	display: grid;
}

.privacy-card summary b,
.settings-row-link b,
.credentials-details summary b {
	font-size: 0.69rem;
}

.privacy-card summary small,
.settings-row-link small,
.credentials-details summary small {
	font-size: 0.6rem;
}

.compact-settings-form {
	display: grid;
	gap: 9px;
	padding: 10px 0 14px;
}

.settings-disclosure {
	margin-top: 12px;
	color: var(--muted);
	font-size: 0.61rem;
}

.integration-google {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 9px;
}

.integration-google > div {
	display: flex;
	min-width: 0;
	align-items: center;
	gap: 9px;
}

.integration-google > div > span:last-child {
	display: grid;
}

.integration-google b {
	font-size: 0.7rem;
}

.integration-google small {
	font-size: 0.6rem;
}

.integration-mark {
	display: grid;
	width: 34px;
	height: 34px;
	flex: 0 0 34px;
	place-items: center;
	color: white;
	border-radius: 7px;
	font-weight: 850;
}

.google-mark {
	background: #4285f4;
}

.credentials-list {
	padding-top: 8px;
}

.secret-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 8px;
	align-items: center;
	padding: 7px 0;
	border-top: 1px solid #e8e9e6;
}

.secret-row:first-child {
	border-top: 0;
}

.secret-row strong {
	font-size: 0.67rem;
}

.secret-row small {
	font-size: 0.58rem;
}

.secret-row .actions {
	margin-top: 0;
}

.about-product {
	display: flex;
	align-items: center;
	gap: 10px;
}

.about-product > div {
	display: grid;
	min-width: 0;
}

.about-product strong {
	font-size: 0.7rem;
}

.about-product .brand-mark {
	flex-shrink: 0;
}

.about-product span,
.about-product small {
	color: var(--muted);
	font-size: 0.6rem;
}

.about-card .actions {
	justify-content: flex-start;
}

.admin-disclosure {
	margin-top: 12px;
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: 11px;
	box-shadow: var(--shadow-soft);
}

.admin-disclosure > summary {
	display: grid;
	min-height: 58px;
	grid-template-columns: 22px 1fr 18px;
	gap: 9px;
	align-items: center;
	padding: 10px 14px;
	cursor: pointer;
	list-style: none;
}

.admin-disclosure > summary::-webkit-details-marker {
	display: none;
}

.admin-disclosure > summary span {
	display: grid;
}

.admin-settings {
	display: grid;
	gap: 10px;
	padding: 0 12px 12px;
}

.panel,
.card,
.feature-card {
	padding: 16px;
	background: var(--paper);
	border: 1px solid var(--line);
	border-radius: 11px;
	box-shadow: var(--shadow-soft);
}

.panel-head,
.section-heading {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 12px;
}

.panel-head p,
.section-heading p {
	color: var(--muted);
	font-size: 0.68rem;
}

.grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 11px;
}

.grid-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.full {
	grid-column: 1 / -1;
}

label {
	display: grid;
	min-width: 0;
	gap: 5px;
	color: var(--forest-900);
	font-size: 0.7rem;
	font-weight: 750;
}

input,
select,
textarea {
	width: 100%;
	min-width: 0;
	font-size: 0.875rem;
	font-weight: 400;
	line-height: 1.35;
	color: var(--ink);
	background: rgba(255, 255, 255, 0.9);
	border: 1px solid var(--line-strong);
	border-radius: 7px;
	outline: 0;
}

input,
select {
	height: 39px;
	padding: 0 10px;
}

textarea {
	padding: 8px 10px;
	resize: vertical;
}

label small {
	font-size: 0.6rem;
	font-weight: 500;
	line-height: 1.4;
}

.check-row {
	display: flex;
	min-height: var(--touch-target-size, 0px);
	align-items: center;
	gap: 8px;
	padding: 9px 10px;
	background: var(--cream-100);
	border-radius: 7px;
}

.check-row input {
	width: 17px;
	height: 17px;
	margin: 0;
}

.cards {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}

.card {
	display: grid;
	gap: 9px;
}

.card-head {
	display: flex;
	justify-content: space-between;
	gap: 9px;
}

.empty {
	display: grid;
	min-height: 150px;
	place-items: center;
	align-content: center;
	gap: 5px;
	padding: 24px 16px;
	color: var(--muted);
	text-align: center;
	background: var(--paper-solid);
	border: 1px dashed var(--line-strong);
	border-radius: 9px;
}

.empty .icon {
	width: 28px;
	height: 28px;
	color: var(--orange-600);
}

.empty strong,
.empty span {
	display: block;
}

.empty span {
	max-width: 430px;
	font-size: 0.7rem;
}

.home-hero {
	position: relative;
	display: grid;
	min-height: 550px;
	grid-template-columns: minmax(340px, 0.78fr) minmax(500px, 1.22fr);
	gap: 24px;
	align-items: center;
	margin-top: -8px;
	padding: 34px;
	overflow: hidden;
	background:
		radial-gradient(circle at 88% 12%, rgba(143, 169, 148, 0.55), transparent 24rem),
		radial-gradient(circle at 10% 6%, rgba(245, 197, 171, 0.72), transparent 20rem),
		linear-gradient(120deg, var(--cream-50), var(--cream-100) 48%, var(--sage-200));
	border-radius: 0 0 18px 18px;
}

.home-hero-copy {
	position: relative;
	z-index: 2;
}

.home-hero-copy > p:not(.eyebrow) {
	max-width: 520px;
	margin-top: 10px;
	color: var(--muted);
	font-size: 0.95rem;
}

.hero-actions {
	display: flex;
	gap: 9px;
	margin-top: 17px;
}

.home-hero .stats {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
	margin-top: 22px;
}

.stat {
	display: flex;
	align-items: center;
	gap: 9px;
	padding: 11px;
	background: rgba(255, 253, 248, 0.78);
	border: 1px solid var(--line);
	border-radius: 9px;
}

.stat-icon {
	display: grid;
	width: 34px;
	height: 34px;
	place-items: center;
	color: var(--forest-700);
	background: var(--sage-100);
	border-radius: 8px;
}

.stat strong,
.stat span {
	display: block;
}

.stat strong {
	font-size: 1.25rem;
}

.stat span:not(.stat-icon) {
	color: var(--muted);
	font-size: 0.64rem;
}

.home-scene-panel {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-rows: auto 1fr;
	gap: 8px;
	align-self: stretch;
	padding: 13px;
	background: rgba(255, 253, 248, 0.78);
	border: 1px solid rgba(255, 255, 255, 0.82);
	border-radius: 16px;
	box-shadow: var(--shadow);
	backdrop-filter: blur(12px);
}

.home-scene-heading {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
}

.home-scene-heading p:not(.eyebrow) {
	color: var(--muted);
	font-size: 0.66rem;
}

.journey-canvas {
	position: relative;
	min-height: 410px;
	overflow: hidden;
	background:
		radial-gradient(circle at 78% 24%, rgba(245, 197, 171, 0.5), transparent 17rem),
		linear-gradient(180deg, rgba(244, 238, 223, 0.68), rgba(213, 224, 209, 0.7));
	border: 1px solid var(--line);
	border-radius: 13px;
}

.journey-webgl-canvas {
	position: absolute;
	z-index: 2;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
}

.journey-webgl-canvas.is-interactive {
	cursor: pointer;
}

.journey-fallback {
	position: absolute;
	inset: 0;
	display: grid;
	align-content: end;
	padding: 16px;
	overflow: hidden;
}

.journey-fallback[hidden] {
	display: none;
}

.fallback-skyline {
	position: absolute;
	top: 16%;
	right: 4%;
	width: 62%;
	height: 34%;
	background: var(--sage-400);
	clip-path: polygon(0 100%, 0 60%, 8% 60%, 8% 28%, 16% 28%, 16% 72%, 27% 72%, 27% 40%, 38% 40%, 38% 82%, 47% 82%, 47% 22%, 51% 22%, 51% 0, 55% 22%, 60% 22%, 60% 64%, 71% 64%, 71% 35%, 81% 35%, 81% 74%, 90% 74%, 90% 50%, 100% 50%, 100% 100%);
	opacity: 0.45;
}

.fallback-desk {
	position: absolute;
	right: 6%;
	bottom: 21%;
	width: 82%;
	height: 27%;
	background: var(--cream-200);
	border: 1px solid var(--line-strong);
	border-radius: 11px;
	box-shadow: 0 12px 0 -8px var(--forest-800);
}

.fallback-cup,
.fallback-laptop,
.fallback-notebook,
.fallback-plant,
.fallback-path {
	position: absolute;
	display: block;
}

.fallback-cup {
	top: -48px;
	left: 8%;
	width: 48px;
	height: 50px;
	background: var(--orange-500);
	border-radius: 10px 10px 16px 16px;
}

.fallback-laptop {
	top: -68px;
	left: 36%;
	width: 112px;
	height: 70px;
	background: var(--orange-200);
	border: 7px solid var(--forest-950);
	border-radius: 7px;
	box-shadow: 0 8px 0 -1px var(--forest-950);
}

.fallback-notebook {
	top: -25px;
	right: 21%;
	width: 70px;
	height: 82px;
	padding: 6px;
	color: white;
	background: var(--forest-700);
	border: 5px solid var(--cream-50);
	border-radius: 6px;
}

.fallback-plant {
	top: -94px;
	right: 3%;
	width: 50px;
	height: 68px;
	background: var(--sage-400);
	border-radius: 75% 18% 75% 18%;
}

.fallback-plant::after {
	position: absolute;
	right: 2px;
	bottom: -30px;
	width: 46px;
	height: 34px;
	background: var(--orange-500);
	border-radius: 5px 5px 14px 14px;
	content: "";
}

.fallback-path {
	top: 28px;
	left: 18%;
	width: 50%;
	border-top: 5px dotted var(--orange-500);
	transform: rotate(-5deg);
}

.journey-fallback > p {
	position: relative;
	z-index: 3;
	display: grid;
	max-width: 390px;
	gap: 2px;
	margin: 0;
	padding: 10px 12px;
	background: rgba(255, 253, 248, 0.9);
	border: 1px solid var(--line);
	border-radius: 9px;
	font-size: 0.7rem;
}

.journey-fallback > p span {
	color: var(--muted);
	font-size: 0.62rem;
}

.journey-dock {
	display: grid;
	grid-template-columns: 165px 1fr;
	gap: 12px;
	align-items: center;
	margin: 10px 0;
	padding: 10px 12px;
	border-radius: 10px;
}

.journey-dock > div:first-child p:not(.eyebrow) {
	color: var(--muted);
	font-size: 0.62rem;
}

.journey-controls {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 7px;
}

.journey-controls button {
	justify-content: flex-start;
	gap: 7px;
	min-height: 48px;
	padding: 6px 8px;
	background: rgba(255, 255, 255, 0.7);
	border-radius: 8px;
	text-align: left;
}

.journey-controls button.active,
.journey-controls button.hovered {
	color: white;
	background: var(--forest-800);
}

.journey-controls button.active small,
.journey-controls button.hovered small {
	color: var(--sage-100);
}

.journey-controls button > span {
	display: grid;
}

.journey-controls small {
	font-size: 0.55rem;
}

.journey-controls strong {
	font-size: 0.66rem;
	line-height: 1.1;
}

.journey-detail {
	position: relative;
	overflow: hidden;
	color: white;
	background:
		radial-gradient(circle at 100% 0, rgba(231, 107, 61, 0.25), transparent 16rem),
		linear-gradient(110deg, var(--forest-950), var(--forest-700));
	border-color: var(--forest-700);
	border-radius: 11px;
}

.journey-detail-inner {
	display: grid;
	grid-template-columns: minmax(210px, 0.9fr) minmax(360px, 1.4fr) auto;
	gap: 18px;
	align-items: center;
	padding: 16px 20px;
}

.journey-detail h2 {
	margin-bottom: 4px;
	font-size: 1.65rem;
}

.journey-detail p:not(.eyebrow) {
	color: var(--sage-200);
	font-size: 0.72rem;
}

.journey-detail .eyebrow {
	color: var(--orange-200);
}

.journey-detail-stats {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 7px;
}

.journey-detail-stats > div {
	padding: 9px;
	background: rgba(255, 255, 255, 0.09);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 8px;
}

.journey-detail-stats strong,
.journey-detail-stats span {
	display: block;
}

.journey-detail-stats strong {
	font-size: 1.2rem;
}

.journey-detail-stats span {
	color: var(--sage-200);
	font-size: 0.56rem;
}

.home-grid {
	display: grid;
	grid-template-columns: minmax(250px, 0.7fr) minmax(0, 1.3fr);
	gap: 10px;
	margin-top: 10px;
}

.feature-card,
.activity-panel {
	border-radius: 11px;
}

.feature-icon {
	display: grid;
	width: 40px;
	height: 40px;
	margin-bottom: 24px;
	place-items: center;
	color: white;
	background: var(--orange-600);
	border-radius: 10px;
}

.feature-card h2 {
	margin-bottom: 7px;
}

.feature-card p:not(.eyebrow) {
	color: var(--muted);
	font-size: 0.72rem;
}

dialog {
	width: min(760px, calc(100% - 28px));
	max-height: calc(100vh - 28px);
	max-height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 28px);
	overflow: auto;
	padding: 0;
	border: 0;
	border-radius: 14px;
}

dialog::backdrop {
	background: rgba(11, 42, 33, 0.68);
	backdrop-filter: blur(4px);
}

.dialog-card {
	display: grid;
	min-width: 0;
	gap: 12px;
	padding: 20px;
	background: var(--paper-solid);
	border: 1px solid var(--line);
	border-radius: 14px;
}

.dialog-head {
	position: sticky;
	z-index: 1;
	top: 0;
	display: flex;
	justify-content: space-between;
	gap: 14px;
	background: var(--paper-solid);
}

.dialog-head p {
	color: var(--muted);
	font-size: 0.7rem;
}

.dialog-head > div {
	min-width: 0;
}

.icon-button {
	width: max(40px, var(--touch-target-size, 0px));
	height: max(40px, var(--touch-target-size, 0px));
	padding: 0;
	font-size: 1.15rem;
	flex-shrink: 0;
}

.dialog-links {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.navigation-open,
body:has(dialog[open]) {
	overflow: hidden;
}

.discovery-dialog {
	width: min(880px, calc(100% - 28px));
}

.discovery-state,
.discovery-state > div,
.networking-context > div,
.job-contact-priority {
	display: grid;
	gap: 8px;
	min-width: 0;
}

.discovery-state > div > strong,
.discovery-state > div > span {
	display: block;
}

.search-budget-choice {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	line-height: 1.5;
}

.search-budget-choice input {
	width: 20px;
	height: 20px;
	flex-shrink: 0;
}

.ai-discovery {
	display: grid;
	gap: 12px;
	margin-bottom: 20px;
	min-width: 0;
	overflow-wrap: anywhere;
}

.ai-discovery .panel-head,
.ai-discovery p {
	margin: 0;
}

.job-contact-priority {
	min-width: 200px;
	max-width: 360px;
	white-space: normal;
}

.job-contact-priority > summary {
	min-height: 44px;
	padding-block: 10px;
	cursor: pointer;
}

.job-contact-priority blockquote {
	margin: 8px 0;
	padding-left: 12px;
	border-left: 2px solid var(--line);
}

.unconfirmed-contacts th {
	white-space: normal;
}

.job-controls .job-contact-action {
	flex-basis: 100%;
}

.settings-editor-dialog {
	width: min(920px, calc(100% - 28px));
}

.toast {
	position: fixed;
	z-index: 200;
	right: 22px;
	bottom: max(22px, env(safe-area-inset-bottom));
	width: min(400px, calc(100% - 44px));
	padding: 12px 14px;
	color: white;
	background: var(--forest-950);
	border-radius: 9px;
	box-shadow: var(--shadow);
	opacity: 0;
	pointer-events: none;
	transform: translateY(calc(100% + 40px));
	visibility: hidden;
	transition:
		transform 160ms ease,
		opacity 160ms ease,
		visibility 0s linear 160ms;
}

.toast.visible {
	opacity: 1;
	transform: translateY(0);
	visibility: visible;
	transition-delay: 0s;
}

.toast.error {
	background: var(--danger);
}

.center-card,
.noscript-card {
	width: min(640px, calc(100% - 28px));
	margin: 12vh auto 0;
	padding: 38px;
	background: var(--paper-solid);
	border: 1px solid var(--line);
	border-radius: 16px;
	box-shadow: var(--shadow);
	text-align: center;
}

.noscript-card .brand-mark {
	margin: 0 auto 14px;
}

.spinner,
.inline-spinner {
	border: 3px solid var(--line);
	border-top-color: var(--orange-600);
	border-radius: 50%;
	animation: spin 800ms linear infinite;
}

.spinner {
	width: 42px;
	height: 42px;
	margin: 0 auto 14px;
}

.inline-spinner {
	display: inline-block !important;
	width: 17px;
	height: 17px;
	border-right-color: transparent;
}

.beta-landing {
	width: min(1220px, calc(100% - 28px));
	margin: 28px auto;
	padding: 26px;
	background:
		radial-gradient(circle at 95% 0, var(--orange-100), transparent 24rem),
		var(--paper-solid);
	border: 1px solid var(--line);
	border-radius: 20px;
	box-shadow: var(--shadow);
}

.beta-landing-brand {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.beta-landing-brand > span:last-child {
	margin-left: auto;
	color: var(--muted);
	font-size: 0.7rem;
}

.beta-landing-grid {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr);
	gap: 34px;
	align-items: center;
	margin-top: 40px;
}

.beta-landing-copy h1 {
	font-size: clamp(2.4rem, 6vw, 6rem);
}

.beta-landing-copy > p:not(.eyebrow, .notice, .beta-privacy) {
	max-width: 610px;
	margin-top: 14px;
	font-size: 1rem;
}

.beta-actions {
	justify-content: flex-start;
	margin-top: 22px;
}

.beta-privacy {
	margin-top: 12px;
	color: var(--muted);
	font-size: 0.68rem;
}

.beta-landing-art {
	min-height: 360px;
	background:
		linear-gradient(90deg, rgba(255, 253, 248, 0.08), rgba(255, 253, 248, 0)),
		url("/art/applications-hero.webp") center / cover no-repeat;
	border-radius: 16px;
	box-shadow: var(--shadow-soft);
}

.legal-shell {
	width: min(940px, calc(100% - 28px));
	margin: 0 auto;
	padding: 24px 0;
}

.legal-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 18px;
}

.legal-brand {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--ink);
	text-decoration: none;
}

.legal-brand span:last-child {
	display: grid;
}

.legal-nav {
	display: flex;
	gap: 6px;
}

.legal-nav a {
	padding: 7px 9px;
	color: var(--muted);
	border-radius: 7px;
	font-weight: 700;
	text-decoration: none;
}

.legal-nav a[aria-current="page"],
.legal-nav a:hover {
	color: white;
	background: var(--forest-800);
}

.legal-card {
	padding: 38px;
	background: var(--paper-solid);
	border: 1px solid var(--line);
	border-radius: 16px;
	box-shadow: var(--shadow);
}

.legal-card h1 {
	margin-bottom: 10px;
}

.legal-card h2 {
	margin-top: 28px;
	margin-bottom: 7px;
	font-size: 1.12rem;
}

.legal-card li + li {
	margin-top: 6px;
}

.legal-lede {
	color: var(--muted);
	font-size: 0.95rem;
}

.skeleton-stack {
	display: grid;
	gap: 9px;
}

.skeleton-stack span {
	height: 52px;
	background: linear-gradient(90deg, var(--cream-100), var(--sage-100), var(--cream-100));
	background-size: 200% 100%;
	border-radius: 9px;
	animation: skeleton 1.4s linear infinite;
}

@keyframes spin {
	to {
		transform: rotate(360deg);
	}
}

@keyframes skeleton {
	to {
		background-position: -200% 0;
	}
}

.app-frame.view-home {
	padding: 0 0 8px;
}

.view-home .topbar {
	position: absolute;
	top: calc(28px + env(safe-area-inset-top));
	right: 0;
	left: 0;
	width: min(1386px, calc(100% - 150px));
}

.view-home #main-content {
	width: 100%;
}

.home-reference-hero {
	position: relative;
	min-height: 510px;
	padding: 116px 6.8% 58px;
	background:
		linear-gradient(
			90deg,
			rgba(255, 244, 225, 0.98) 0%,
			rgba(255, 244, 225, 0.92) 28%,
			rgba(255, 244, 225, 0.48) 48%,
			rgba(255, 244, 225, 0) 68%
		),
		url("/art/home-hero.webp") calc(100% + 235px) center / auto 100% no-repeat,
		var(--cream-100);
	box-shadow: inset 0 -30px 55px rgba(86, 61, 38, 0.12);
}

.home-reference-copy {
	position: relative;
	z-index: 2;
	width: min(520px, 40%);
}

.home-reference-copy .eyebrow {
	color: #7d5a40;
	font-size: 0.72rem;
	letter-spacing: 0.24em;
}

.home-reference-copy .eyebrow span {
	color: var(--orange-700);
}

.home-reference-copy h1 {
	font-size: clamp(3.25rem, 4.15vw, 4.65rem);
	line-height: 0.9;
}

.home-reference-copy h1 span {
	color: var(--orange-600);
}

.home-reference-copy > p:not(.eyebrow, .home-handwritten) {
	max-width: 410px;
	margin-top: 13px;
	color: #5d665f;
	font-size: 1.08rem;
	line-height: 1.35;
}

.home-reference-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 20px;
}

.home-reference-actions button {
	min-height: 45px;
	padding: 9px 22px;
	border-radius: 12px;
	font-size: 0.88rem;
}

.home-handwritten {
	position: relative;
	width: max-content;
	margin: 20px 0 0 20px;
	color: #524c42;
	font-family: "Segoe Print", "Bradley Hand", cursive;
	font-size: 1.25rem;
	line-height: 1.25;
	transform: rotate(-4deg);
}

.home-handwritten span {
	position: absolute;
	right: -18px;
	bottom: -10px;
	width: 88px;
	height: 3px;
	background: var(--orange-500);
	transform: rotate(-3deg);
}

.home-reference-stats {
	position: absolute;
	z-index: 3;
	right: 5.2%;
	bottom: -38px;
	left: 5.2%;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;
}

.home-reference-stats .reference-metric {
	min-height: 85px;
	background: rgba(255, 253, 248, 0.94);
}

.home-search-row {
	display: grid;
	width: min(1375px, calc(100% - 150px));
	grid-template-columns: minmax(0, 1fr) 355px;
	gap: 12px;
	margin: 56px auto 12px;
}

.home-search-panel,
.home-coffee-card,
.home-recent-panel,
.home-journey-panel {
	background: rgba(255, 253, 248, 0.95);
	border: 1px solid var(--line);
	border-radius: 13px;
	box-shadow: var(--shadow-soft);
}

.home-search-panel {
	container-type: inline-size;
	padding: 14px 18px;
}

.home-search-heading {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 10px;
}

.home-search-heading > .icon {
	width: 30px;
	height: 30px;
	flex-basis: 30px;
}

.home-search-heading h2 {
	margin-bottom: 3px;
	font-size: 1.12rem;
}

.home-search-heading p {
	color: var(--muted);
	font-size: 0.72rem;
}

.home-search-controls {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 0.65fr)) 76px 120px;
	gap: 9px;
}

.home-search-input {
	position: relative;
}

.home-search-input .icon {
	position: absolute;
	z-index: 1;
	top: 50%;
	left: 11px;
	width: 17px;
	height: 17px;
	transform: translateY(-50%);
}

.home-search-input input {
	padding-left: 36px;
}

.home-coffee-card {
	display: grid;
	overflow: hidden;
	grid-template-columns: 1.1fr 0.9fr;
	color: white;
	background: linear-gradient(145deg, var(--forest-950), var(--forest-700));
}

.home-coffee-art {
	min-height: 120px;
	background: url("/art/home-coffee.webp") center / cover no-repeat;
}

.home-coffee-card p {
	position: relative;
	align-self: center;
	padding: 14px 18px 18px;
	font-size: 1.05rem;
	line-height: 1.1;
}

.home-coffee-card p span {
	position: absolute;
	bottom: 8px;
	left: 18px;
	width: 34px;
	height: 3px;
	background: var(--orange-500);
}

.home-reference-lower {
	display: grid;
	width: min(1375px, calc(100% - 150px));
	grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
	gap: 12px;
	margin: 0 auto;
}

.home-recent-panel,
.home-journey-panel {
	container-type: inline-size;
	min-width: 0;
	padding: 14px 18px;
}

.home-recent-panel > header,
.home-journey-panel > header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 10px;
}

.home-recent-panel > header > div,
.home-journey-panel > header > div:first-child {
	display: flex;
	align-items: center;
	gap: 9px;
}

.home-journey-panel > header > div:last-child {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
}

.home-recent-panel h2,
.home-journey-panel h2 {
	font-size: 1.05rem;
}

.home-recent-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.home-recent-card {
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-width: 0;
	padding: 16px;
	background: rgba(255, 255, 255, 0.76);
	border: 1px solid #e0e3de;
	border-radius: 10px;
}

.home-recent-title {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.home-recent-title .company-tile {
	flex: 0 0 42px;
}

.home-recent-title > div:last-child {
	min-width: 0;
	overflow-wrap: anywhere;
}

.home-recent-title strong {
	font-size: 0.8125rem;
}

.home-recent-title h3 {
	margin: 4px 0 0;
	font-size: 0.9375rem;
	line-height: 1.35;
}

.home-recent-title p {
	margin: 8px 0 0;
	color: var(--cp-text-soft);
	font-size: 0.8125rem;
	line-height: 1.4;
}

.home-recent-card .chips {
	align-items: flex-start;
	align-content: flex-start;
	gap: 8px;
}

.home-recent-card .chip {
	align-self: flex-start;
	max-width: 100%;
	padding: 4px 8px;
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1.4;
	overflow-wrap: anywhere;
}

.home-recent-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 8px;
	margin-top: auto;
}

.home-recent-actions > :is(button, .button) {
	flex: 0 0 auto;
	max-width: 100%;
	min-height: 44px;
	min-width: 44px;
	padding: 10px 8px;
	font-size: 0.875rem;
	line-height: 1.25;
	white-space: normal;
	overflow-wrap: anywhere;
}

.home-journey-panel .journey-canvas {
	min-height: 220px;
	height: 220px;
	overflow: hidden;
	background:
		radial-gradient(circle at 54% 18%, rgba(255, 228, 164, 0.78), transparent 7rem),
		linear-gradient(180deg, #fae6ca, #d8dbb9 56%, #879b67);
}

.home-journey-milestones {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 7px;
	margin-top: 10px;
}

.home-journey-milestones button {
	display: grid;
	min-height: 48px;
	grid-template-columns: 28px minmax(0, 1fr);
	gap: 6px;
	align-items: center;
	padding: 6px;
	background: var(--cream-100);
	border: 1px solid var(--line);
	text-align: left;
}

.journey-marker {
	display: grid;
	width: 28px;
	height: 28px;
	place-items: center;
	color: var(--forest-900);
	background: var(--paper-solid);
	border: 4px solid rgba(255, 253, 248, 0.9);
	border-radius: 50%;
	box-shadow: 0 0 0 2px var(--forest-700);
}

.home-journey-milestones button.active .journey-marker,
.home-journey-milestones button.hovered .journey-marker {
	color: white;
	background: var(--orange-600);
	box-shadow: 0 0 0 2px var(--orange-700);
}

.home-journey-milestones strong,
.home-journey-milestones small {
	display: block;
}

.home-journey-milestones strong {
	font-size: 0.72rem;
}

.home-journey-milestones small {
	color: #314b3e;
	font-size: 0.62rem;
}

.journey-overview-button {
	position: absolute;
	z-index: 5;
	top: 8px;
	left: 8px;
	min-height: max(30px, var(--touch-target-size, 0px));
	padding: 4px 8px;
	background: rgba(255, 253, 248, 0.8);
	border-radius: 8px;
	font-size: 0.58rem;
	backdrop-filter: blur(8px);
}

.home-journey-detail {
	position: relative;
	margin-top: 10px;
	color: var(--ink);
	background: rgba(255, 253, 248, 0.88);
	border: 1px solid rgba(255, 255, 255, 0.8);
	border-radius: 9px;
	box-shadow: var(--shadow-soft);
	backdrop-filter: blur(10px);
}

.home-journey-detail .journey-detail-inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 12px;
	padding: 10px;
}

.home-journey-detail .eyebrow,
.home-journey-detail .journey-detail-stats {
	display: none;
}

.home-journey-detail h2 {
	margin-bottom: 4px;
	font-size: 0.86rem;
}

.home-journey-detail p:not(.eyebrow) {
	color: var(--muted);
	font-size: 0.7rem;
	line-height: 1.25;
}

.home-journey-detail .primary {
	min-height: max(40px, var(--touch-target-size, 0px));
	padding: 6px 9px;
	font-size: 0.7rem;
}

.home-signoff {
	display: flex;
	width: min(1375px, calc(100% - 150px));
	align-items: center;
	justify-content: space-between;
	margin: 12px auto 0;
	color: #6f675c;
}

.home-signoff > span {
	font-size: 0.58rem;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.home-signoff em {
	position: relative;
	padding-right: 14px;
	font-family: "Segoe Print", "Bradley Hand", cursive;
	font-size: 1rem;
}

.home-signoff i {
	position: absolute;
	right: 0;
	bottom: -5px;
	width: 42px;
	height: 2px;
	background: var(--orange-500);
	transform: rotate(-7deg);
}

@container (max-width: 920px) {
	.home-search-controls {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.home-search-input,
	.home-search-controls label:nth-of-type(4) {
		grid-column: span 2;
	}
}

@container (max-width: 520px) {
	.home-search-controls {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.home-search-input,
	.home-search-controls label:nth-of-type(4) {
		grid-column: 1 / -1;
	}
}

@container (max-width: 500px) {
	.home-journey-milestones {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.home-journey-detail .journey-detail-inner {
		grid-template-columns: minmax(0, 1fr);
	}

	.home-journey-detail .primary {
		justify-self: start;
	}
}

@container (max-width: 320px) {
	.settings-card-heading {
		grid-template-columns: 42px minmax(0, 1fr);
	}

	.settings-card-heading button {
		grid-column: 2;
		justify-self: start;
	}
}

@media (max-width: 1240px) {
	.app-frame.view-analytics::after {
		display: none;
	}

	.jobs-reference-layout {
		grid-template-columns: 210px minmax(0, 1fr);
	}

	.jobs-activity-rail {
		grid-column: 1 / -1;
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.view-home .topbar,
	.home-search-row,
	.home-reference-lower,
	.home-signoff {
		width: calc(100% - 48px);
	}

	.home-reference-lower {
		grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.9fr);
	}

	.tracker-layout,
	.networking-layout {
		grid-template-columns: 190px minmax(0, 1fr);
	}

	.tracker-right-rail {
		grid-column: 2;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.rail-art {
		display: none;
	}

	.analytics-reference-grid {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}

	.funnel-panel,
	.status-panel,
	.companies-panel,
	.networking-impact-panel {
		grid-column: span 3;
	}

	.timeline-panel,
	.heatmap-panel {
		grid-column: span 6;
	}
}

@media (max-width: 1100px) {
	.app-frame {
		padding: 10px 8px 6px;
	}

	.topbar {
		width: 100%;
		min-height: 58px;
		gap: 10px;
		border-radius: 12px;
	}

	.view-home .topbar {
		position: absolute;
		top: 18px;
		width: calc(100% - 36px);
	}

	.brand {
		flex: 1;
		margin-right: auto;
	}

	.brand strong {
		font-size: 0.92rem;
	}

	.brand-mark {
		width: 36px;
		height: 36px;
		flex-basis: 36px;
	}

	.mobile-nav-toggle {
		display: grid;
		order: -1;
	}

	.top-nav {
		position: fixed;
		z-index: 130;
		top: 0;
		bottom: 0;
		left: 0;
		display: grid;
		width: min(300px, calc(100% - 52px));
		align-content: start;
		gap: 6px;
		padding: calc(82px + env(safe-area-inset-top)) 14px
			max(20px, env(safe-area-inset-bottom));
		margin: 0;
		background: var(--forest-950);
		transform: translateX(-105%);
		visibility: hidden;
		transition:
			transform 170ms ease,
			visibility 0s linear 170ms;
		overflow-y: auto;
		overscroll-behavior: contain;
	}

	.mobile-nav-close {
		position: absolute;
		top: calc(18px + env(safe-area-inset-top));
		left: 14px;
		display: grid;
		width: 44px;
		min-height: 44px;
		padding: 0;
		place-items: center;
	}

	.nav-open .top-nav {
		transform: translateX(0);
		visibility: visible;
		transition-delay: 0s;
	}

	.top-nav button {
		justify-content: flex-start;
		text-align: left;
	}

	.nav-scrim {
		position: fixed;
		z-index: 120;
		inset: 0;
		display: block;
		pointer-events: none;
		background: rgba(11, 42, 33, 0.58);
		border: 0;
		border-radius: 0;
		opacity: 0;
		visibility: hidden;
	}

	.nav-open .nav-scrim {
		pointer-events: auto;
		opacity: 1;
		visibility: visible;
	}

	.top-email {
		display: none;
	}

	.reference-hero {
		margin-top: 0;
		background-position: 60% center;
	}

	.home-reference-hero {
		min-height: 590px;
		padding: 108px 5% 92px;
		background-position: 58% center;
	}

	.home-reference-copy {
		width: min(420px, 48%);
	}

	.home-search-row,
	.home-reference-lower,
	.home-signoff {
		width: calc(100% - 36px);
	}

	.home-search-row,
	.home-reference-lower {
		grid-template-columns: 1fr;
	}

	.home-coffee-card {
		grid-template-columns: 190px 1fr;
		min-height: 118px;
	}

	.home-reference-lower {
		gap: 10px;
	}

	.reference-hero-copy {
		width: 62%;
		padding: 24px;
	}

	.reference-metrics {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.jobs-reference-layout,
	.tracker-layout,
	.networking-layout {
		grid-template-columns: 1fr;
	}

	.jobs-filter-form {
		display: block;
	}

	.job-search-strip {
		grid-template-columns: 1fr 1fr;
		margin-bottom: 10px;
	}

	.job-search-strip .search-field {
		grid-column: 1 / -1;
	}

	.filter-panel,
	.jobs-results-panel,
	.jobs-activity-rail,
	.tracker-right-rail {
		grid-column: 1;
	}

	.filter-panel {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		margin-bottom: 10px;
	}

	.filter-panel-heading,
	.filter-summary,
	.filter-panel .full-width {
		grid-column: 1 / -1;
	}

	.job-cards.grid-view {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.tracker-right-rail {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.tracker-filters {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.tracker-filter-heading,
	.tracker-filters fieldset,
	.filter-footnote {
		grid-column: 1 / -1;
	}

	.tracker-filters fieldset {
		grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	}

	.table-panel-heading {
		align-items: stretch;
		flex-direction: column;
	}

	.table-tools {
		width: 100%;
	}

	.inline-search {
		flex: 1;
		min-width: 0;
	}

	.rail-page {
		grid-template-columns: 1fr;
	}

	.dark-side-rail {
		display: none;
	}

	.settings-reference-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.account-card,
	.preferences-card,
	.privacy-card,
	.integrations-card,
	.appearance-card,
	.about-card,
	.settings-notebook-art {
		grid-column: span 1;
	}

	.privacy-card {
		grid-column: 1 / -1;
	}

	.home-hero {
		grid-template-columns: 1fr;
	}

	.home-scene-panel .journey-canvas {
		min-height: 390px;
	}

	.journey-detail-inner {
		grid-template-columns: 1fr;
	}

	.journey-detail .primary {
		justify-self: start;
	}

	.home-grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 700px) {
	.topbar {
		padding: 8px 10px;
	}

	.app-frame.view-home {
		padding: 8px 6px 6px;
	}

	.view-home .topbar {
		position: relative;
		top: auto;
		left: auto;
		width: 100%;
		transform: none;
	}

	.brand strong {
		white-space: normal;
		text-align: left;
		font-size: 0.85rem;
	}

	.brand {
		gap: 8px;
	}

	.brand-mark {
		width: 32px;
		height: 32px;
		flex-basis: 32px;
	}

	.sign-out-button {
		width: 44px;
		min-height: 44px;
		padding: 0;
	}

	.sign-out-button > span {
		display: none;
	}

	.sign-out-button .icon {
		display: block;
	}

	.reference-hero {
		height: auto;
		min-height: 320px;
		align-items: flex-start;
		background-position: 68% center;
		background-size: auto 100%;
	}

	.home-reference-hero {
		height: auto;
		min-height: 0;
		margin-top: 8px;
		padding: 28px 16px 18px;
		background:
			linear-gradient(
				180deg,
				rgba(255, 244, 225, 0.95) 0%,
				rgba(255, 244, 225, 0.88) 47%,
				rgba(255, 244, 225, 0.18) 78%
			),
			url("/art/home-hero.webp") 43% bottom / auto 58% no-repeat,
			var(--cream-100);
		border-radius: 12px;
	}

	.home-reference-copy {
		width: 100%;
	}

	.home-reference-copy h1 {
		font-size: clamp(3rem, 14vw, 4.2rem);
	}

	.home-reference-copy > p:not(.eyebrow, .home-handwritten) {
		max-width: 320px;
	}

	.home-handwritten {
		display: none;
	}

	.home-reference-stats {
		position: relative;
		right: auto;
		bottom: auto;
		left: auto;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
		margin-top: 230px;
	}

	.home-reference-stats .reference-metric {
		min-height: 72px;
		padding: 10px;
	}

	.home-search-row,
	.home-reference-lower,
	.home-signoff {
		width: 100%;
		margin-right: 0;
		margin-left: 0;
	}

	.home-search-row {
		margin-top: 10px;
	}

	.home-search-panel,
	.home-recent-panel,
	.home-journey-panel {
		padding: 13px;
	}

	.home-coffee-card {
		grid-template-columns: 135px 1fr;
	}

	.home-recent-grid {
		grid-template-columns: 1fr;
	}

	.home-journey-panel .journey-canvas {
		min-height: 285px;
		height: 285px;
	}

	.home-signoff {
		display: none;
	}

	.reference-hero::after {
		background: linear-gradient(
			180deg,
			rgba(255, 248, 237, 0.98) 0%,
			rgba(255, 248, 237, 0.92) 57%,
			rgba(255, 248, 237, 0.18) 100%
		);
	}

	.reference-hero-copy {
		width: 100%;
		padding: 22px 18px;
	}

	.reference-hero h1 {
		max-width: 420px;
		font-size: clamp(2.45rem, 12vw, 3.8rem);
	}

	.reference-hero-copy > p:not(.eyebrow) {
		max-width: 440px;
	}

	.reference-metrics {
		gap: 8px;
	}

	.reference-metric {
		min-height: 72px;
		padding: 10px;
	}

	.reference-metric-icon {
		width: 37px;
		height: 37px;
		flex-basis: 37px;
	}

	.job-search-strip {
		grid-template-columns: 1fr;
	}

	.job-search-strip > * {
		grid-column: 1;
	}

	.filter-panel,
	.tracker-filters {
		grid-template-columns: 1fr;
	}

	.filter-panel > *,
	.tracker-filters > * {
		grid-column: 1;
	}

	.job-cards.grid-view {
		grid-template-columns: 1fr;
	}

	.job-card-heading {
		grid-template-columns: 42px minmax(0, 1fr);
	}

	.job-card-title {
		grid-column: 1 / -1;
		grid-row: 2;
	}

	.job-card-actions {
		grid-column: 2;
		grid-row: 1;
		justify-self: end;
	}

	.results-toolbar {
		align-items: flex-start;
		flex-wrap: wrap;
	}

	.results-toolbar > div:first-child {
		flex-wrap: wrap;
	}

	.layout-toggle {
		align-self: flex-start;
	}

	.list-view .job-card {
		display: grid;
		grid-template-columns: 1fr;
	}

	.list-view .job-card-heading,
	.list-view .job-location,
	.list-view .job-meta,
	.list-view .job-tags,
	.list-view .job-description,
	.list-view .adzuna-attribution,
	.list-view .job-controls {
		grid-column: 1;
		grid-row: auto;
		min-width: 0;
	}

	.tracker-right-rail,
	.jobs-activity-rail,
	.settings-reference-grid,
	.analytics-reference-grid {
		grid-template-columns: 1fr;
	}

	.tracker-right-rail > *,
	.jobs-activity-rail > *,
	.account-card,
	.preferences-card,
	.privacy-card,
	.integrations-card,
	.appearance-card,
	.about-card,
	.settings-notebook-art,
	.funnel-panel,
	.timeline-panel,
	.status-panel,
	.companies-panel,
	.networking-impact-panel,
	.heatmap-panel {
		grid-column: 1;
	}

	.table-tools {
		align-items: stretch;
		flex-direction: column;
	}

	.inline-search {
		min-width: 0;
	}

	.journey-dock {
		grid-template-columns: 1fr;
	}

	.journey-controls {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.journey-controls button:last-child {
		grid-column: 1 / -1;
	}

	.journey-detail-stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.home-hero {
		min-height: 0;
		padding: 18px;
	}

	.home-hero h1 {
		font-size: clamp(2.7rem, 13vw, 4rem);
	}

	.home-scene-panel {
		padding: 10px;
	}

	.home-scene-panel .journey-canvas {
		min-height: 300px;
	}

	.beta-landing {
		margin: 8px auto;
		padding: 18px;
	}

	.beta-landing-grid {
		grid-template-columns: 1fr;
		margin-top: 28px;
	}

	.beta-landing-art {
		min-height: 260px;
	}

	.grid,
	.grid-3,
	.cards {
		grid-template-columns: 1fr;
	}

	.full {
		grid-column: 1;
	}

	.secret-row {
		grid-template-columns: 1fr;
	}

	.activity-list {
		grid-template-columns: 1fr;
	}

	.legal-header {
		align-items: flex-start;
		flex-direction: column;
	}

	.legal-card {
		padding: 24px 18px;
	}
}

@media (max-height: 500px) {
	.dialog-head {
		position: relative;
	}
}

@media (pointer: coarse), (max-width: 700px) {
	:root {
		--touch-target-size: 44px;
	}

	input:not([type="checkbox"]):not([type="hidden"]),
	select,
	.networking-layout .tracker-filters input {
		height: 44px;
	}

	input,
	select,
	textarea {
		font-size: 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}

	button:hover,
	.button:hover {
		transform: none;
	}
}

.brand-mark.brand-image, .tutorial-mark.brand-image { display: block; object-fit: contain; aspect-ratio: 1; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
