.term-wrap.svelte-10qt9x1 {
		position: fixed;
		left: 0; right: 0; bottom: 0;
		background: #1a1a1a;
		color: #d6d6c4;
		font-family: ui-monospace, 'SF Mono', Menlo, monospace;
		font-size: 11px;
		line-height: 1.55;
		z-index: 80;
		border-top: 1px solid #1d4ed8;
		box-shadow: 0 -4px 16px rgba(0,0,0,0.25);
		transition: max-height 180ms ease;
		max-height: 180px;
	}
	.term-wrap.collapsed.svelte-10qt9x1 { max-height: 28px; }
	.term-bar.svelte-10qt9x1 {
		display: flex; align-items: center; justify-content: space-between;
		padding: 4px 14px; cursor: pointer; user-select: none;
		background: #222222; border-bottom: 1px solid rgba(29,78,216,0.25);
		height: 28px;
	}
	.term-title.svelte-10qt9x1 { color: #93b4fb; font-weight: 600; letter-spacing: 0.02em; }
	.term-stats.svelte-10qt9x1 { display: flex; align-items: center; gap: 10px; font-weight: 500; }
	.stat-running.svelte-10qt9x1 { color: #d49060; }
	.stat-done.svelte-10qt9x1 { color: #7fb88f; }
	.stat-cost.svelte-10qt9x1 { color: #d6d6c4; opacity: 0.7; }
	.stat-sep.svelte-10qt9x1 { color: rgba(255,255,255,0.2); }
	.badge.svelte-10qt9x1 {
		background: #1d4ed8; color: white;
		padding: 1px 8px; font-size: 11px; font-weight: 600;
		margin-left: 6px; border-radius: 999px;
	}
	.term-controls.svelte-10qt9x1 { display: flex; gap: 6px; }
	.ctl.svelte-10qt9x1 {
		background: transparent; color: #d6d6c4;
		border: 1px solid rgba(255,255,255,0.18);
		padding: 2px 12px; border-radius: 999px;
		font-family: inherit; font-size: 11px; font-weight: 500; letter-spacing: 0;
		cursor: pointer;
		transition: background .15s, border-color .15s, color .15s;
	}
	.ctl.svelte-10qt9x1:hover { background: rgba(29,78,216,0.15); border-color: #1d4ed8; color: #93b4fb; }
	.term-body.svelte-10qt9x1 {
		padding: 6px 14px; overflow-y: auto; max-height: 140px;
		background: #1a1a1a;
	}
	.term-line.svelte-10qt9x1 { white-space: pre; word-break: break-word; padding: 1px 0; font-family: ui-monospace, 'SF Mono', Menlo, monospace; }
	.term-line.svelte-10qt9x1 .ts:where(.svelte-10qt9x1) { color: rgba(214,214,196,0.4); margin-right: 8px; }
	.term-line.svelte-10qt9x1 .sym:where(.svelte-10qt9x1) { display: inline-block; width: 14px; text-align: center; font-weight: 600; color: #93b4fb; }
	.term-line.svelte-10qt9x1 .msg:where(.svelte-10qt9x1) { color: rgba(214,214,196,0.9); }
	.term-line.err.svelte-10qt9x1 .sym:where(.svelte-10qt9x1) { color: #ff7a70; }
	.term-line.err.svelte-10qt9x1 .msg:where(.svelte-10qt9x1) { color: #ffb3ad; }
	.term-line.ok.svelte-10qt9x1 .sym:where(.svelte-10qt9x1) { color: #7fb88f; }
	.term-line.ok.svelte-10qt9x1 .msg:where(.svelte-10qt9x1) { color: #b7d9c3; }
	.term-line.warn.svelte-10qt9x1 .sym:where(.svelte-10qt9x1) { color: #d49060; }
	.term-line.warn.svelte-10qt9x1 .msg:where(.svelte-10qt9x1) { color: #e8c79a; }
	.term-line.complete.svelte-10qt9x1 {
		background: rgba(201, 99, 66, 0.12);
		padding: 4px 8px; margin: 4px 0;
		border-left: 3px solid #1d4ed8;
	}
	.term-line.complete.svelte-10qt9x1 .sym:where(.svelte-10qt9x1) { color: #93b4fb; }
	.term-line.complete.svelte-10qt9x1 .msg:where(.svelte-10qt9x1) { color: #93b4fb; font-weight: 600; letter-spacing: 0.02em; }
	.prompt.svelte-10qt9x1 { color: #93b4fb; padding: 4px 0; }
	.cursor.svelte-10qt9x1 { animation: svelte-10qt9x1-blink 1s step-end infinite; }
	@keyframes svelte-10qt9x1-blink { 0%,100% { opacity: 1; } 50% { opacity: 0; } }
	.term-foot.svelte-10qt9x1 {
		padding: 2px 14px; background: #222222; color: rgba(214,214,196,0.3);
		font-size: 11px; letter-spacing: 0.04em;
		border-top: 1px solid rgba(29,78,216,0.15);
	}

	.pulse-feed-area.svelte-1f7rxzw {
		position: relative;
		font-family: var(--font-sans, 'Inter', -apple-system, system-ui, sans-serif);
	}
	.pulse-trigger.svelte-1f7rxzw {
		position: relative;
		display: inline-flex;
		align-items: center;
		gap: 7px;
		padding: 7px 13px;
		background: var(--color-surface, #ffffff);
		color: var(--color-ink, #2c2c2c);
		border: 1px solid var(--color-border, #e8e6dd);
		border-radius: var(--radius-pill, 999px);
		box-shadow: none;
		cursor: pointer;
		font-weight: 500;
		font-size: 12.5px;
		letter-spacing: 0;
		font-family: inherit;
		transition: background .15s, border-color .15s;
	}
	.pulse-trigger.svelte-1f7rxzw:hover { background: var(--color-bg-alt, #f0eee5); }
	.pf-bell.svelte-1f7rxzw { font-size: 13px; }
	.pf-label.svelte-1f7rxzw { font-weight: 500; color: var(--color-ink, #2c2c2c); }
	.pf-count.svelte-1f7rxzw { color: var(--color-muted, #6f6e69); }
	.pf-dot.svelte-1f7rxzw {
		width: 7px;
		height: 7px;
		border-radius: 50%;
		background: var(--color-accent, #1d4ed8);
		box-shadow: 0 0 0 3px var(--color-accent-soft, #e6ecfd);
		flex-shrink: 0;
	}

	.pf-panel.svelte-1f7rxzw {
		position: absolute;
		top: calc(100% + 8px);
		right: 0;
		width: 380px;
		min-width: 360px;
		max-height: 600px;
		background: var(--color-surface, #ffffff);
		color: var(--color-ink, #2c2c2c);
		border: 1px solid var(--color-border, #e8e6dd);
		border-radius: var(--radius, 12px);
		box-shadow: var(--shadow-md, 0 4px 12px rgba(0,0,0,0.08));
		z-index: 200;
		display: flex;
		flex-direction: column;
		overflow: hidden;
	}

	.pf-tabs.svelte-1f7rxzw {
		display: flex;
		gap: 2px;
		padding: 5px;
		background: #f4f3ee;
		border-bottom: 1px solid var(--color-border, #e8e6dd);
		overflow-x: auto;
		scrollbar-width: thin;
		scrollbar-color: transparent transparent;
		flex-shrink: 0;
	}
	.pf-tabs.svelte-1f7rxzw:hover {
		scrollbar-color: var(--color-accent, #1d4ed8) transparent;
	}
	.pf-tabs.svelte-1f7rxzw::-webkit-scrollbar {
		height: 4px;
	}
	.pf-tabs.svelte-1f7rxzw::-webkit-scrollbar-track {
		background: transparent;
	}
	.pf-tabs.svelte-1f7rxzw::-webkit-scrollbar-thumb {
		background: transparent;
		border-radius: 2px;
	}
	.pf-tabs.svelte-1f7rxzw:hover::-webkit-scrollbar-thumb {
		background: var(--color-accent, #1d4ed8);
		opacity: 0.5;
	}
	.pf-tab.svelte-1f7rxzw {
		flex: 0 0 auto;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 3px;
		padding: 6px 10px;
		background: transparent;
		color: var(--color-muted, #6f6e69);
		border: none;
		border-radius: var(--radius-pill, 999px);
		font-family: inherit;
		font-weight: 500;
		font-size: 11.5px;
		letter-spacing: 0;
		text-transform: none;
		cursor: pointer;
		white-space: nowrap;
		transition: background .15s, color .15s;
	}
	.pf-tab.svelte-1f7rxzw:hover { color: var(--color-ink, #2c2c2c); }
	.pf-tab-active.svelte-1f7rxzw {
		background: var(--color-surface, #ffffff);
		color: var(--color-accent, #1d4ed8);
		font-weight: 600;
		box-shadow: 0 1px 2px rgba(0,0,0,0.05);
	}
	.pf-tab-icon.svelte-1f7rxzw {
		display: inline-flex;
		align-items: center;
		flex-shrink: 0;
		font-size: 12px;
	}
	.pf-tab-count.svelte-1f7rxzw {
		font-size: 10px;
		opacity: 0.75;
		background: var(--color-border, #e8e6dd);
		border-radius: 999px;
		padding: 0 4px;
		min-width: 14px;
		text-align: center;
		line-height: 1.6;
	}
	.pf-tab-active.svelte-1f7rxzw .pf-tab-count:where(.svelte-1f7rxzw) {
		background: color-mix(in srgb, var(--color-accent, #1d4ed8) 15%, transparent);
		color: var(--color-accent, #1d4ed8);
	}
	/* Narrow fallback: wrap to 2 rows below 340px */
	@media (max-width: 340px) {
		.pf-tabs.svelte-1f7rxzw {
			flex-wrap: wrap;
			overflow-x: visible;
		}
	}

	.pf-body.svelte-1f7rxzw {
		overflow-y: auto;
		max-height: 480px;
		flex: 1;
		background: var(--color-surface, #ffffff);
	}
	.pf-empty.svelte-1f7rxzw {
		padding: 32px 12px;
		text-align: center;
		font-size: 12.5px;
		font-weight: 500;
		letter-spacing: 0;
		color: var(--color-muted, #6f6e69);
		text-transform: none;
	}
	.pf-row.svelte-1f7rxzw {
		display: grid;
		grid-template-columns: 22px 1fr auto;
		gap: 10px;
		align-items: flex-start;
		padding: 10px 14px;
		width: 100%;
		background: var(--color-surface, #ffffff);
		border: none;
		border-bottom: 1px solid #f0eee5;
		border-left: 4px solid transparent;
		border-radius: 0;
		text-align: left;
		cursor: pointer;
		font-family: inherit;
		transition: background .12s;
	}
	.pf-row.svelte-1f7rxzw:hover { background: #f4f3ee; }
	.pf-unread.svelte-1f7rxzw {
		background: #fdf6f2;
		border-left-color: var(--color-accent, #1d4ed8);
	}
	.pf-unread.svelte-1f7rxzw:hover { background: #faeee6; }
	.pf-row-icon.svelte-1f7rxzw {
		font-size: 14px;
		line-height: 1.3;
	}
	.pf-row-main.svelte-1f7rxzw {
		display: flex;
		flex-direction: column;
		min-width: 0;
	}
	.pf-row-title.svelte-1f7rxzw {
		font-size: 13px;
		font-weight: 500;
		color: var(--color-ink, #2c2c2c);
		line-height: 1.35;
		text-transform: none;
		letter-spacing: 0;
	}
	.pf-row-sub.svelte-1f7rxzw {
		font-size: 12px;
		color: var(--color-muted, #6f6e69);
		margin-top: 2px;
		line-height: 1.35;
	}
	.pf-row-ts.svelte-1f7rxzw {
		font-size: 11px;
		color: var(--color-muted, #6f6e69);
		font-weight: 500;
		letter-spacing: 0;
		text-transform: none;
		white-space: nowrap;
	}

	.pf-footer.svelte-1f7rxzw {
		display: flex;
		justify-content: space-between;
		gap: 8px;
		padding: 10px 12px;
		border-top: 1px solid var(--color-border, #e8e6dd);
		background: var(--color-surface, #ffffff);
	}
	.pf-foot-btn.svelte-1f7rxzw {
		flex: 1;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 7px 12px;
		background: var(--color-surface, #ffffff);
		color: var(--color-ink, #2c2c2c);
		border: 1px solid var(--color-border, #e8e6dd);
		border-radius: var(--radius-pill, 999px);
		font-family: inherit;
		font-weight: 500;
		font-size: 12px;
		letter-spacing: 0;
		text-transform: none;
		cursor: pointer;
		text-decoration: none;
		text-align: center;
		transition: background .15s, border-color .15s;
	}
	.pf-foot-btn.svelte-1f7rxzw:hover { background: #f4f3ee; }
	.pf-foot-link.svelte-1f7rxzw { color: var(--color-accent, #1d4ed8); }

	.pf-pipe-stats.svelte-1f7rxzw {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 8px;
		padding: 10px 14px;
		background: #f3f6fe;
		color: var(--color-accent, #1d4ed8);
		font-size: 12px;
		font-weight: 500;
		letter-spacing: 0;
		text-transform: none;
		border-bottom: 1px solid var(--color-border, #e8e6dd);
	}
	.pf-pipe-cli.svelte-1f7rxzw {
		padding: 5px 12px;
		background: var(--color-accent, #1d4ed8);
		color: #ffffff;
		border: 1px solid var(--color-accent, #1d4ed8);
		border-radius: var(--radius-pill, 999px);
		font-family: inherit;
		font-size: 11.5px;
		font-weight: 500;
		letter-spacing: 0;
		text-transform: none;
		cursor: pointer;
		transition: background .15s;
	}
	.pf-pipe-cli.svelte-1f7rxzw:hover { background: #1e40af; border-color: #1e40af; }

	/* ── Nudges (merged from former AINudges floating panel) ── */
	.pf-nudge-row.svelte-1f7rxzw {
		cursor: default;
		grid-template-columns: 22px 1fr auto;
		align-items: center;
	}
	.pf-nudge-row.svelte-1f7rxzw:hover { background: var(--color-surface, #ffffff); }
	.pf-nudge-icon.svelte-1f7rxzw {
		color: var(--color-accent, #1d4ed8);
		font-size: 14px;
	}
	.pf-nudge-actions.svelte-1f7rxzw {
		display: inline-flex;
		align-items: center;
		gap: 6px;
	}
	.pf-nudge-act.svelte-1f7rxzw {
		padding: 4px 12px;
		background: var(--color-accent, #1d4ed8);
		color: #ffffff;
		border: 1px solid var(--color-accent, #1d4ed8);
		border-radius: var(--radius-pill, 999px);
		font-family: inherit;
		font-size: 11.5px;
		font-weight: 500;
		letter-spacing: 0;
		text-transform: none;
		cursor: pointer;
		white-space: nowrap;
		transition: background .15s, border-color .15s;
	}
	.pf-nudge-act.svelte-1f7rxzw:hover { background: #1e40af; border-color: #1e40af; }
	.pf-nudge-dismiss.svelte-1f7rxzw {
		background: none;
		border: none;
		color: var(--color-muted, #6f6e69);
		font-size: 16px;
		line-height: 1;
		cursor: pointer;
		padding: 0 4px;
		font-family: inherit;
	}
	.pf-nudge-dismiss.svelte-1f7rxzw:hover { color: var(--color-ink, #2c2c2c); }

	/* ── Human-approval queue (Phase 2, §11) ── */
	.pf-appr-row.svelte-1f7rxzw {
		cursor: default;
		align-items: flex-start;
	}
	.pf-appr-row.svelte-1f7rxzw:hover { background: var(--color-surface, #ffffff); }
	.pf-appr-icon.svelte-1f7rxzw { color: var(--color-accent, #1d4ed8); }
	.pf-appr-meta.svelte-1f7rxzw {
		font-size: 11px;
		color: var(--color-muted, #6f6e69);
		margin-top: 3px;
		line-height: 1.35;
	}
	.pf-appr-actions.svelte-1f7rxzw {
		display: inline-flex;
		flex-direction: column;
		align-items: stretch;
		gap: 5px;
	}
	.pf-appr-approve.svelte-1f7rxzw,
	.pf-appr-reject.svelte-1f7rxzw,
	.pf-appr-confirm.svelte-1f7rxzw,
	.pf-appr-cancel.svelte-1f7rxzw {
		padding: 4px 12px;
		border-radius: var(--radius-pill, 999px);
		font-family: inherit;
		font-size: 11.5px;
		font-weight: 500;
		letter-spacing: 0;
		text-transform: none;
		cursor: pointer;
		white-space: nowrap;
		transition: background .15s, border-color .15s, color .15s;
	}
	.pf-appr-approve.svelte-1f7rxzw {
		background: var(--color-accent, #1d4ed8);
		color: #ffffff;
		border: 1px solid var(--color-accent, #1d4ed8);
	}
	.pf-appr-approve.svelte-1f7rxzw:hover { background: #1e40af; border-color: #1e40af; }
	.pf-appr-reject.svelte-1f7rxzw {
		background: var(--color-surface, #ffffff);
		color: var(--color-muted, #6f6e69);
		border: 1px solid var(--color-border, #e8e6dd);
	}
	.pf-appr-reject.svelte-1f7rxzw:hover { color: #c0392b; border-color: #c0392b; }
	.pf-appr-approve.svelte-1f7rxzw:disabled,
	.pf-appr-reject.svelte-1f7rxzw:disabled,
	.pf-appr-confirm.svelte-1f7rxzw:disabled {
		opacity: 0.5;
		cursor: default;
	}
	.pf-appr-reject-box.svelte-1f7rxzw {
		display: flex;
		flex-direction: column;
		gap: 6px;
		margin-top: 8px;
	}
	.pf-appr-input.svelte-1f7rxzw {
		width: 100%;
		padding: 6px 10px;
		background: var(--color-bg-alt, #f4f3ee);
		color: var(--color-ink, #2c2c2c);
		border: 1px solid var(--color-border, #e8e6dd);
		border-radius: var(--radius, 8px);
		font-family: inherit;
		font-size: 12px;
		letter-spacing: 0;
	}
	.pf-appr-input.svelte-1f7rxzw:focus {
		outline: 2px solid var(--color-accent, #1d4ed8);
		outline-offset: 1px;
		border-color: var(--color-accent, #1d4ed8);
	}
	.pf-appr-reject-btns.svelte-1f7rxzw {
		display: inline-flex;
		gap: 6px;
	}
	.pf-appr-confirm.svelte-1f7rxzw {
		background: #c0392b;
		color: #ffffff;
		border: 1px solid #c0392b;
	}
	.pf-appr-confirm.svelte-1f7rxzw:hover { background: #a93226; border-color: #a93226; }
	.pf-appr-cancel.svelte-1f7rxzw {
		background: var(--color-surface, #ffffff);
		color: var(--color-muted, #6f6e69);
		border: 1px solid var(--color-border, #e8e6dd);
	}
	.pf-appr-cancel.svelte-1f7rxzw:hover { color: var(--color-ink, #2c2c2c); }

	.pt-stack.svelte-ao2u2f {
		position: fixed;
		top: 72px;
		right: 16px;
		z-index: 5000;
		display: flex;
		flex-direction: column;
		gap: 10px;
		font-family: var(--font-sans, 'Inter', -apple-system, system-ui, sans-serif);
		pointer-events: none;
	}
	.pt-toast.svelte-ao2u2f {
		display: flex;
		align-items: stretch;
		min-width: 320px;
		max-width: 400px;
		background: var(--color-surface, #ffffff);
		color: var(--color-ink, #2c2c2c);
		border: 1px solid var(--color-border, #e8e6dd);
		border-left: 4px solid var(--color-border, #e8e6dd);
		border-radius: var(--radius, 12px);
		box-shadow: var(--shadow-md, 0 4px 12px rgba(0,0,0,0.08));
		pointer-events: auto;
		animation: svelte-ao2u2f-pt-in 180ms ease-out;
		overflow: hidden;
	}
	.pt-pipeline.svelte-ao2u2f { border-left-color: var(--color-accent, #1d4ed8); }
	.pt-pipeline.svelte-ao2u2f .pt-title:where(.svelte-ao2u2f) { color: var(--color-accent, #1d4ed8); }
	.pt-dedup.svelte-ao2u2f    { border-left-color: #d97706; }
	.pt-dedup.svelte-ao2u2f .pt-title:where(.svelte-ao2u2f) { color: #a06000; }
	.pt-body.svelte-ao2u2f {
		flex: 1;
		display: grid;
		grid-template-columns: 22px 1fr auto;
		gap: 10px;
		align-items: center;
		padding: 11px 14px;
		background: transparent;
		color: inherit;
		border: none;
		text-align: left;
		cursor: pointer;
		font-family: inherit;
		min-width: 0;
	}
	.pt-body.svelte-ao2u2f:hover { background: #faf9f5; }
	.pt-icon.svelte-ao2u2f { font-size: 14px; }
	.pt-main.svelte-ao2u2f { display: flex; flex-direction: column; min-width: 0; }
	.pt-title.svelte-ao2u2f {
		font-size: 12.5px;
		font-weight: 600;
		letter-spacing: 0;
		text-transform: none;
		color: var(--color-ink, #2c2c2c);
	}
	.pt-sub.svelte-ao2u2f {
		font-size: 12px;
		color: var(--color-muted, #6f6e69);
		margin-top: 3px;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.pt-arrow.svelte-ao2u2f {
		font-size: 11.5px;
		font-weight: 500;
		letter-spacing: 0;
		color: var(--color-accent, #1d4ed8);
		text-transform: none;
		white-space: nowrap;
	}
	.pt-x.svelte-ao2u2f {
		padding: 0 12px;
		background: transparent;
		color: var(--color-muted, #6f6e69);
		border: none;
		border-left: 1px solid var(--color-border, #e8e6dd);
		font-size: 18px;
		font-weight: 400;
		cursor: pointer;
		transition: background .12s, color .12s;
	}
	.pt-x.svelte-ao2u2f:hover { background: #f4f3ee; color: var(--color-ink, #2c2c2c); }

	@keyframes svelte-ao2u2f-pt-in {
		from { transform: translateX(20px); opacity: 0; }
		to { transform: translateX(0); opacity: 1; }
	}

	.cp-overlay.svelte-1yq04zr {
		position: fixed; inset: 0;
		background: rgba(44, 44, 44, 0.32);
		z-index: 9999;
		display: flex;
		justify-content: center;
		align-items: flex-start;
		padding-top: 12vh;
		backdrop-filter: blur(2px);
	}
	.cp-card.svelte-1yq04zr {
		width: 600px;
		max-width: calc(100vw - 32px);
		background: var(--color-surface, #fff);
		border: 1px solid var(--color-border, #e8e6dd);
		border-radius: var(--radius, 12px);
		box-shadow: var(--shadow-lg, 0 8px 24px rgba(0,0,0,0.12));
		overflow: hidden;
		display: flex;
		flex-direction: column;
		max-height: 70vh;
		font-family: 'Inter', -apple-system, system-ui, sans-serif;
	}
	.cp-input-wrap.svelte-1yq04zr {
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 14px 16px;
		border-bottom: 1px solid var(--color-border, #e8e6dd);
	}
	.cp-input-icon.svelte-1yq04zr { font-size: 18px; color: var(--color-muted, #6f6e69); }
	.cp-input.svelte-1yq04zr {
		flex: 1;
		border: none;
		outline: none;
		background: transparent;
		font-size: 15px;
		color: var(--color-ink, #2c2c2c);
		font-family: inherit;
	}
	.cp-esc.svelte-1yq04zr {
		font-size: 10px;
		padding: 2px 6px;
		background: var(--color-surface-warm, #f4f3ee);
		border: 1px solid var(--color-border, #e8e6dd);
		border-radius: 4px;
		color: var(--color-muted, #6f6e69);
		font-family: ui-monospace, SFMono-Regular, monospace;
	}
	.cp-list.svelte-1yq04zr {
		flex: 1;
		overflow-y: auto;
		padding: 6px 0;
	}
	.cp-empty.svelte-1yq04zr {
		padding: 24px;
		text-align: center;
		color: var(--color-muted, #6f6e69);
		font-size: 13px;
	}
	.cp-group-label.svelte-1yq04zr {
		padding: 8px 16px 4px;
		font-size: 10.5px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.08em;
		color: var(--color-dim, #97968f);
	}
	.cp-row.svelte-1yq04zr {
		display: flex;
		align-items: center;
		gap: 12px;
		width: 100%;
		padding: 9px 16px;
		background: transparent;
		border: none;
		text-align: left;
		cursor: pointer;
		font-family: inherit;
		color: var(--color-ink, #2c2c2c);
		transition: background 0.1s;
	}
	.cp-row-sel.svelte-1yq04zr {
		background: var(--color-accent-soft, #e6ecfd);
	}
	.cp-row-icon.svelte-1yq04zr {
		font-size: 18px;
		color: var(--color-muted, #6f6e69);
		flex-shrink: 0;
	}
	.cp-row-sel.svelte-1yq04zr .cp-row-icon:where(.svelte-1yq04zr) { color: var(--color-accent-ink, #1e40af); }
	.cp-row-text.svelte-1yq04zr {
		flex: 1;
		min-width: 0;
		display: flex;
		flex-direction: column;
		gap: 1px;
	}
	.cp-row-label.svelte-1yq04zr {
		font-size: 13.5px;
		font-weight: 500;
		color: var(--color-ink, #2c2c2c);
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.cp-row-sub.svelte-1yq04zr {
		font-size: 11.5px;
		color: var(--color-muted, #6f6e69);
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.cp-row-enter.svelte-1yq04zr {
		opacity: 0;
		font-size: 12px;
		color: var(--color-accent-ink, #1e40af);
		font-family: ui-monospace, SFMono-Regular, monospace;
	}
	.cp-row-sel.svelte-1yq04zr .cp-row-enter:where(.svelte-1yq04zr) { opacity: 1; }
	.cp-foot.svelte-1yq04zr {
		display: flex;
		gap: 14px;
		padding: 8px 16px;
		border-top: 1px solid var(--color-border, #e8e6dd);
		background: var(--color-surface-warm, #f4f3ee);
		font-size: 11px;
		color: var(--color-muted, #6f6e69);
	}
	.cp-foot.svelte-1yq04zr kbd:where(.svelte-1yq04zr) {
		display: inline-block;
		padding: 1px 5px;
		margin-right: 4px;
		background: var(--color-surface, #fff);
		border: 1px solid var(--color-border, #e8e6dd);
		border-radius: 3px;
		font-family: ui-monospace, SFMono-Regular, monospace;
		font-size: 10px;
	}

	.kh-overlay.svelte-1j4q7u9 {
		position: fixed; inset: 0;
		background: rgba(44, 44, 44, 0.32);
		z-index: 9998;
		display: flex;
		justify-content: center;
		align-items: center;
		backdrop-filter: blur(2px);
		font-family: 'Inter', -apple-system, system-ui, sans-serif;
	}
	.kh-card.svelte-1j4q7u9 {
		width: 460px;
		max-width: calc(100vw - 32px);
		background: var(--color-surface, #fff);
		border: 1px solid var(--color-border, #e8e6dd);
		border-radius: var(--radius, 12px);
		box-shadow: var(--shadow-lg, 0 8px 24px rgba(0,0,0,0.12));
		overflow: hidden;
	}
	.kh-header.svelte-1j4q7u9 {
		display: flex; align-items: center; justify-content: space-between;
		padding: 14px 18px;
		border-bottom: 1px solid var(--color-border, #e8e6dd);
	}
	.kh-title.svelte-1j4q7u9 {
		margin: 0;
		font-size: 15px;
		font-weight: 600;
		color: var(--color-ink, #2c2c2c);
		font-family: inherit;
		letter-spacing: -0.01em;
	}
	.kh-close.svelte-1j4q7u9 {
		background: transparent;
		border: none;
		font-size: 22px;
		line-height: 1;
		color: var(--color-muted, #6f6e69);
		cursor: pointer;
		padding: 0 4px;
	}
	.kh-close.svelte-1j4q7u9:hover { color: var(--color-ink, #2c2c2c); }
	.kh-list.svelte-1j4q7u9 {
		list-style: none;
		margin: 0;
		padding: 8px 0;
	}
	.kh-row.svelte-1j4q7u9 {
		display: flex;
		align-items: center;
		gap: 16px;
		padding: 8px 18px;
		font-size: 13px;
	}
	.kh-row.svelte-1j4q7u9:hover { background: var(--color-surface-warm, #f4f3ee); }
	.kh-keys.svelte-1j4q7u9 {
		display: inline-flex;
		gap: 4px;
		min-width: 80px;
		flex-shrink: 0;
	}
	.kh-kbd.svelte-1j4q7u9 {
		display: inline-block;
		padding: 2px 7px;
		background: var(--color-surface-warm, #f4f3ee);
		border: 1px solid var(--color-border, #e8e6dd);
		border-radius: 4px;
		font-family: ui-monospace, SFMono-Regular, monospace;
		font-size: 11px;
		color: var(--color-ink, #2c2c2c);
		min-width: 18px;
		text-align: center;
	}
	.kh-desc.svelte-1j4q7u9 {
		color: var(--color-ink-soft, #4a4a48);
	}
	.kh-foot.svelte-1j4q7u9 {
		padding: 10px 18px;
		font-size: 11px;
		color: var(--color-muted, #6f6e69);
		border-top: 1px solid var(--color-border, #e8e6dd);
		background: var(--color-surface-warm, #f4f3ee);
	}

	.wn-backdrop.svelte-1m75boc {
		position: fixed;
		inset: 0;
		background: rgba(20, 18, 14, 0.55);
		display: grid;
		place-items: center;
		z-index: 9998;
		font-family: 'Inter', -apple-system, system-ui, sans-serif;
		animation: svelte-1m75boc-wn-fade 0.2s ease;
	}
	@keyframes svelte-1m75boc-wn-fade { from { opacity: 0; } to { opacity: 1; } }
	.wn-card.svelte-1m75boc {
		position: relative;
		width: 600px;
		max-width: calc(100vw - 32px);
		background: #ffffff;
		border-radius: 12px;
		box-shadow: 0 24px 64px rgba(0, 0, 0, 0.28);
		padding: 28px 32px 24px;
		color: var(--color-ink, #2c2c2c);
		animation: svelte-1m75boc-wn-rise 0.22s ease;
	}
	@keyframes svelte-1m75boc-wn-rise {
		from { opacity: 0; transform: translateY(8px) scale(0.98); }
		to   { opacity: 1; transform: translateY(0) scale(1); }
	}
	.wn-close.svelte-1m75boc {
		position: absolute;
		top: 10px;
		right: 12px;
		width: 32px;
		height: 32px;
		border: none;
		background: transparent;
		color: var(--color-muted, #6f6e69);
		font-size: 22px;
		line-height: 1;
		border-radius: 8px;
		cursor: pointer;
	}
	.wn-close.svelte-1m75boc:hover { background: var(--color-surface-warm, #f4f3ee); color: var(--color-ink, #2c2c2c); }
	.wn-eyebrow.svelte-1m75boc {
		font-size: 11px;
		text-transform: uppercase;
		letter-spacing: 0.08em;
		color: var(--color-accent, #1d4ed8);
		font-weight: 600;
		margin-bottom: 6px;
	}
	.wn-title.svelte-1m75boc {
		font-family: 'Tiempos Headline', 'Charter', Georgia, serif;
		font-size: 28px;
		font-weight: 600;
		letter-spacing: -0.015em;
		margin: 0 0 18px;
		color: var(--color-ink, #2c2c2c);
	}
	.wn-list.svelte-1m75boc {
		list-style: none;
		padding: 0;
		margin: 0 0 20px;
		display: flex;
		flex-direction: column;
		gap: 10px;
	}
	.wn-list.svelte-1m75boc li:where(.svelte-1m75boc) {
		font-size: 14.5px;
		line-height: 1.55;
		color: var(--color-ink-soft, #4a4a48);
		padding: 10px 12px;
		background: var(--color-surface-warm, #f4f3ee);
		border-radius: 8px;
		display: flex;
		align-items: center;
		gap: 8px;
	}
	.wn-item-icon.svelte-1m75boc {
		flex-shrink: 0;
		display: inline-flex;
		color: var(--color-accent, #1d4ed8);
	}
	.wn-actions.svelte-1m75boc {
		display: flex;
		justify-content: flex-end;
	}
	.wn-got-it.svelte-1m75boc {
		background: var(--color-accent, #1d4ed8);
		color: #fff;
		border: none;
		padding: 10px 22px;
		border-radius: 999px;
		font-family: inherit;
		font-size: 13.5px;
		font-weight: 600;
		cursor: pointer;
		transition: filter 0.15s;
	}
	.wn-got-it.svelte-1m75boc:hover { filter: brightness(1.06); }

	.confetti-root.svelte-1l3pvrr {
		position: fixed;
		inset: 0;
		pointer-events: none;
		z-index: 10000;
		overflow: hidden;
	}
	.burst.svelte-1l3pvrr { position: absolute; inset: 0; }
	.p.svelte-1l3pvrr {
		position: absolute;
		top: -20px;
		left: var(--left);
		width: var(--size);
		height: var(--size);
		background: var(--c);
		opacity: 0;
		transform: translate3d(0, 0, 0) rotate(0deg);
		animation: svelte-1l3pvrr-fall var(--dur) cubic-bezier(0.25, 0.7, 0.5, 1) var(--delay) forwards;
		will-change: transform, opacity;
	}
	.p.circle.svelte-1l3pvrr { border-radius: 50%; }
	.p.rect.svelte-1l3pvrr   { border-radius: 1px; }
	@keyframes svelte-1l3pvrr-fall {
		0%   { opacity: 0; transform: translate3d(0, -20px, 0) rotate(0deg); }
		8%   { opacity: 1; }
		80%  { opacity: 1; }
		100% {
			opacity: 0;
			transform: translate3d(var(--drift), 100vh, 0) rotate(var(--rot));
		}
	}

	.undo-bar.svelte-f094zu {
		position: fixed;
		left: 50%;
		bottom: 48px;
		transform: translateX(-50%);
		z-index: 9999;
		display: inline-flex;
		align-items: center;
		gap: 10px;
		padding: 9px 14px 9px 16px;
		background: var(--color-accent-soft, #e6ecfd);
		color: var(--color-accent-ink, #1e40af);
		border: 1px solid var(--color-accent, #1d4ed8);
		border-radius: 999px;
		font-family: 'Inter', -apple-system, system-ui, sans-serif;
		font-size: 13px;
		font-weight: 500;
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10);
		max-width: 92vw;
	}
	.undo-msg.svelte-f094zu {
		max-width: 380px;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.undo-sep.svelte-f094zu { opacity: 0.45; }
	.undo-btn.svelte-f094zu {
		background: transparent;
		border: none;
		color: var(--color-accent-ink, #1e40af);
		font-weight: 700;
		font-size: 13px;
		text-decoration: underline;
		cursor: pointer;
		padding: 2px 4px;
		font-family: inherit;
	}
	.undo-btn.svelte-f094zu:hover { color: var(--color-accent, #1d4ed8); }
	.undo-count.svelte-f094zu {
		font-size: 11px;
		opacity: 0.7;
		font-variant-numeric: tabular-nums;
	}
	.undo-x.svelte-f094zu {
		background: transparent;
		border: none;
		color: inherit;
		font-size: 16px;
		line-height: 1;
		padding: 0 2px 0 4px;
		cursor: pointer;
		opacity: 0.55;
	}
	.undo-x.svelte-f094zu:hover { opacity: 1; }
/* PULSE design spec, taken from the design canvas. Sizes and fonts live here once;
   the skin and pages read them, so no value is typed twice. Left-rail layout only. */
.with-rail {
	--u-font: Inter, system-ui, -apple-system, sans-serif;
	--u-serif: Georgia, 'Times New Roman', serif;
	--u-fs: 13px;            /* body */
	--u-fs-sm: 12px;         /* pills, status, notes */
	--u-fs-th: 11.5px;       /* table header */
	--u-title: 22px;         /* page title, serif 600 */
	--u-banner-h: 56px;
	--u-ctl-h: 40px;         /* search, buttons, tabs */
	--u-ctl-sm: 36px;        /* buttons inside the banner */
	--u-chip-h: 26px;
	--u-row-h: 46px;
	--u-th-h: 36px;
	--u-bar-h: 30px;         /* activity bar */
	--u-rail-w: 84px;
	--u-r-banner: 18px;
	--u-r-card: 14px;
	--u-r-ctl: 11px;
	--u-r-btn: 10px;
	--u-gap: 8px;
	--u-ink: #18181b;
	--u-muted: #5b6478;
	--u-line: #dfe3ec;
	--u-accent: #2563eb;
	--u-blue: #e6ecfd;  --u-blue-ink: #0f1733;
	--u-green: #eef1f8; --u-green-ink: #0f1733;
	--u-yellow: #eef1f8; --u-yellow-ink: #0f1733;
	--u-pink: #eef1f8;  --u-pink-ink: #0f1733;
	/* Hero band (dark card with filter pills, headline, KPIs and radar) */
	--u-hero: #0f1733;  --u-hero-line: rgba(255, 255, 255, .16);  --u-hero-soft: #b8c2e6;
	--u-hero-hot: #8db0ff;
	--u-st-placed: #6b8cff; --u-st-strong: #6fd08c; --u-st-review: #f2c14e; --u-st-stuck: #ef6b5b;
}
/* Left-rail skin (feature_new_shell). Every selector starts with `.with-rail`,
   so with the flag off none of this applies and the pages look as before.
   It restyles the page chrome that already exists — headers become pastel
   banners, tables become floating rows, cards get the larger radius — and
   reads only tokens from app.css. */

/* The page ground is the soft mint of the design; cards sit on it in white. */
:root:has(.with-rail), :root:has(.with-rail) body { background: var(--color-rail-bg) !important; /* app.css sets the page ground on html and body */ }
.with-rail { background: transparent; }

/* ── Page header → banner ─────────────────────────────────────────────── */
.with-rail :is(
	.page-head, .cv-head-row, header.ap-head, .board-head, .agents-head, .users-head,
	.profile-head, .cs-hero, .page-head.section-animate,
	.jd-main div.flex:has(> div > h1.jd-page-title),
	.wrap > .head,
	div.flex.items-center:has(> div.flex-1.min-w-0 > h1),
	.h-full > div:has(> div > h1.page-title)
) {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	background: var(--tint, var(--color-pastel-blue));
	border: 0;
	border-radius: 32px;
	padding: 26px 32px;
	margin-bottom: 18px;
	box-shadow: none;
}
.with-rail :is(.page-head, .cv-head-row, header.ap-head, .board-head, .agents-head, .users-head, .profile-head, .cs-hero)::before {
	content: '';
	position: absolute;
	z-index: -1;
	width: 280px;
	height: 280px;
	border-radius: 50%;
	background: rgb(255 255 255 / 0.45);
	right: -70px;
	top: -120px;
	pointer-events: none;
}
.with-rail .cv-head-row.cv-head-row.cv-head-row { --tint: var(--color-pastel-blue); }
.with-rail .page-head.page-head.page-head { --tint: var(--color-pastel-yellow); }
.with-rail header.ap-head.ap-head.ap-head { --tint: var(--color-pastel-pink); }
.with-rail .board-head.board-head.board-head { --tint: var(--color-pastel-orange); }
.with-rail .agents-head.agents-head.agents-head { --tint: var(--color-pastel-yellow); }
.with-rail .users-head.users-head.users-head { --tint: var(--color-pastel-orange); }
.with-rail .profile-head.profile-head.profile-head { --tint: var(--color-pastel-violet); }
.with-rail .cs-hero.cs-hero.cs-hero { --tint: var(--color-pastel-pink); }
.with-rail .jd-main div.flex:has(> div > h1.jd-page-title) { --tint: var(--color-pastel-violet); }
.with-rail .wrap > .head.head.head { --tint: var(--color-pastel-violet); }
.with-rail div.flex.items-center:has(> div.flex-1.min-w-0 > h1) { --tint: var(--color-pastel-blue); padding: 22px 28px; border: 0 !important; background: var(--tint) !important; /* the page sets its own background inline */ }
.with-rail .admin-shell .page-head.page-head.page-head { --tint: var(--color-pastel-green); }

.with-rail :is(h1.page-title, h1.cv-page-title, h1.jd-page-title, h1.page-ttl, h1.cs-title) {
	font-size: clamp(30px, 3.6vw, 46px);
	font-weight: 500;
	line-height: 1.05;
	letter-spacing: -0.02em;
	text-transform: none;
	color: var(--color-ink);
}

/* ── Tables → floating rows ───────────────────────────────────────────── */
.with-rail table { border-collapse: separate; border-spacing: 0 6px; }
.with-rail table thead th { background: transparent; border: 0; }
.with-rail table tbody td { background: var(--color-surface); border-top: 0; border-bottom: 0; }
.with-rail table tbody td:first-child { border-radius: 16px 0 0 16px; }
.with-rail table tbody td:last-child { border-radius: 0 16px 16px 0; }

/* ── Cards, pills, buttons ────────────────────────────────────────────── */
.with-rail :is(.card, .warm-card, .pos-card, .stage-col, .kanban-col) { border-radius: 26px; }
.with-rail :is(.btn-primary, .btn-secondary, .btn-ghost, .btn-pill) { border-radius: 999px; }

/* ── Phone: the dock sits at the bottom, give content room ────────────── */
@media (max-width: 820px) {
	.with-rail :is(.page-head, .cv-head-row, header.ap-head, .board-head, .agents-head, .users-head, .profile-head, .cs-hero) {
		padding: 20px;
		border-radius: 26px;
	}
}

/* One theme only: neutral ground, navy band. The colour themes were retired. */

/* ── Talent Pool: filters move to pills + a sheet, details to a right panel ── */
.with-rail .cv-split.cv-split { grid-template-columns: minmax(0, 1fr); }
.with-rail .cv-split.cv-split:has(> .cv-panel) { grid-template-columns: minmax(0, 1fr) 340px; }
.with-rail .cv-split .cv-rail { display: none; }
@media (max-width: 1100px) {
	.with-rail .cv-split.cv-split:has(> .cv-panel) { grid-template-columns: minmax(0, 1fr); }
	.with-rail .cv-split .cv-panel { position: fixed; z-index: 70; left: 10px; right: 10px; bottom: 88px; max-height: 60vh; padding: 0; }
}

/* ── Positions: pastel cards, one tint per card, big serif numbers ────── */
.with-rail .warm-grid { grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); gap: 14px; }
.with-rail .warm-card {
	background: var(--c, var(--color-pastel-yellow)) !important; /* the card sets its own surface */
	border: 2px solid transparent;
	border-radius: 30px;
	padding: 22px;
	box-shadow: none;
	color: var(--color-ink);
}
.with-rail .warm-card:hover { box-shadow: 0 18px 40px -26px rgb(0 0 0 / 0.5); transform: translateY(-2px); }
.with-rail .warm-card.warm-card-selected { border-color: var(--color-ink); }
.with-rail .warm-card:nth-child(6n + 1) { --c: var(--color-pastel-yellow); }
.with-rail .warm-card:nth-child(6n + 2) { --c: var(--color-pastel-blue); }
.with-rail .warm-card:nth-child(6n + 3) { --c: var(--color-pastel-orange); }
.with-rail .warm-card:nth-child(6n + 4) { --c: var(--color-pastel-violet); }
.with-rail .warm-card:nth-child(6n + 5) { --c: var(--color-pastel-pink); }
.with-rail .warm-card:nth-child(6n + 6) { --c: var(--color-pastel-green); }
.with-rail .warm-card .warm-card-icon { width: 46px; height: 46px; border-radius: 16px; background: rgb(255 255 255 / 0.7); color: var(--color-ink); display: grid; place-items: center; }
.with-rail .warm-card .warm-card-title { font-size: 24px; line-height: 1.1; font-weight: 500; }
.with-rail .warm-card .warm-badge { background: rgb(255 255 255 / 0.75); color: var(--color-ink); border-radius: 999px; }
.with-rail .warm-card .warm-stat-val { font-size: 30px; line-height: 1.1; font-weight: 500; }
.with-rail .warm-card .warm-stat-accent { color: var(--color-ink); }
.with-rail .warm-card .warm-progress-bar { background: rgb(255 255 255 / 0.6); border-radius: 999px; }
.with-rail .warm-card .warm-progress-fill { background: var(--color-ink); border-radius: 999px; }
.with-rail .warm-card .warm-foot-open { background: var(--color-ink); color: #fff; border-radius: 999px; }
.with-rail .warm-card .warm-icon-btn { background: rgb(255 255 255 / 0.7); border: 0; border-radius: 50%; }

/* ── Position workspace: pill tabs, pastel stat cards, rounded sections ─ */
.with-rail .dash-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	background: var(--color-surface);
	border: 0;
	border-radius: 999px;
	padding: 6px;
	margin: 0 0 16px;
	width: fit-content;
	max-width: 100%;
}
.with-rail .dash-tab { flex: 0 1 auto; border: 0; border-radius: 999px; background: transparent; padding: 0 18px; min-height: 40px; font-weight: 700; }
.with-rail .dash-tab.dash-tab-active { background: var(--color-ink) !important; color: #fff !important; }
.with-rail .ink-border {
	border: 0 !important;
	border-radius: 26px;
	overflow: hidden;
	box-shadow: none !important;
}
.with-rail .dark-title-bar {
	background: transparent !important;
	color: var(--color-ink) !important;
	padding: 18px 22px 6px !important;
	font-size: 15px !important;
	font-weight: 700;
	text-transform: none !important;
	letter-spacing: 0;
}
/* The four stat boxes at the top of the dashboard */
.with-rail .grid > .ink-border.text-center { min-height: 112px; display: flex; flex-direction: column; justify-content: center; border-radius: 28px; }
.with-rail .grid > .ink-border.text-center:nth-child(4n + 1) { background: var(--color-pastel-blue) !important; }
.with-rail .grid > .ink-border.text-center:nth-child(4n + 2) { background: var(--color-pastel-green) !important; }
.with-rail .grid > .ink-border.text-center:nth-child(4n + 3) { background: var(--color-pastel-violet) !important; }
.with-rail .grid > .ink-border.text-center:nth-child(4n + 4) { background: var(--color-pastel-yellow) !important; }
.with-rail .grid > .ink-border.text-center > div:nth-of-type(1) { font-size: 40px !important; font-weight: 500 !important; line-height: 1.05; }
.with-rail :is(.send-btn, .btn-secondary, .btn-run-agent) { border-radius: 999px; }
.with-rail .dash-tab.dash-tab-active .dash-tab-value { color: #fff; }

.with-rail .dash-panel { background: transparent; border: 0; padding: 4px 0 24px; }
.with-rail > div.flex-1 { background: transparent !important; /* app.css paints this wrapper */ }

/* Tables: the card around a table steps back so its rows float on the page
   ground. Dialogs keep their surface. */
.with-rail :is(div, section):has(> table):not([role='dialog'] *, .warm-modal *, .modal *),
.with-rail :is(div, section):has(> div:only-child > table):not([role='dialog'] *, .warm-modal *, .modal *) {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}
.with-rail .warm-grid > * { min-width: 0; }
.with-rail .warm-card .warm-card-title { white-space: normal; overflow-wrap: anywhere; }
.with-rail .warm-card .warm-card-head { flex-wrap: wrap; }
.with-rail .warm-card .warm-card-meta { white-space: normal; overflow-wrap: anywhere; }

/* ── Fit the screen: pages stop centring themselves in a narrow column. ──
   Each page used to cap itself (users 1400, approvals 1400, agents 1400,
   upload 1400, API 1240, Copilot 980, profile 720, Positions 1280) and
   centre; beside the rail that left a gap on both sides. */
.with-rail :is(.users-wrap, .ap-wrap, .agents-wrap, .ig-page, .cs-wrap, .pulse-page, .profile-page, .wrap:has(> .head)) {
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	width: auto;
	padding-left: 24px;
	padding-right: 24px;
	box-sizing: border-box;
}
@media (max-width: 820px) {
	.with-rail :is(.users-wrap, .ap-wrap, .agents-wrap, .ig-page, .cs-wrap, .pulse-page, .profile-page, .wrap:has(> .head)) {
		padding-left: 12px;
		padding-right: 12px;
	}
}

/* Page wrappers that paint the near-white app background hide the mint ground
   (Talent Pool: .cv-page-wrap, .cv-main and its inner wrapper; Cost: .ca). */
.with-rail :is(.cv-page-wrap, .cv-main, .cv-main > div, .cv-split, .ca) { background: transparent !important; }
.with-rail table.cv-data-table { border-collapse: separate !important; border-spacing: 0 6px !important; }
.with-rail table.cv-data-table tbody td { border-bottom: 0 !important; }

/* Same breathing room above the content as the other pages (Users, Approvals…):
   Admin and Cost start flush with the top edge otherwise. */
.with-rail :is(.admin-shell, .ca, .an-root) { padding-top: 24px !important; box-sizing: border-box !important; /* the pages' own scoped CSS sets padding: 0 */ }

/* ── Fixed zone, scroll zone ──────────────────────────────────────────────
   On every page the banner and that page's tab / stat / filter bars stay put;
   only the content under them scrolls. Two mechanisms, because pages differ:
   · most pages: the banner and the tab bar are `sticky` inside the page's own
     scroller, the tab bar stacked just under the banner;
   · Talent Pool: its top block is a flex column and only the table scrolls (the
     header sticks to the table's own top, so no row can show above it).
   The box-shadows paint the page ground around a stuck bar so rows do not show
   through its gaps or round corners. Banner is compact (about 100px). */
.with-rail { --hero-h: 100px; --stick-gap: 12px; --stick-bar: calc(var(--hero-h) + 18px); }
.with-rail :is(
	.page-head, .cv-head-row, header.ap-head, .board-head, .agents-head, .users-head,
	.profile-head, .cs-hero, .page-head.section-animate,
	.jd-main div.flex:has(> div > h1.jd-page-title),
	.wrap > .head,
	div.flex.items-center:has(> div.flex-1.min-w-0 > h1),
	.h-full > div:has(> div > h1.page-title)
) {
	position: sticky;
	top: 0;
	z-index: 80;
	padding: 14px 28px;
	margin-bottom: var(--stick-gap);
	box-shadow: 0 -48px 0 0 var(--color-rail-bg), 0 var(--stick-gap) 0 0 var(--color-rail-bg);
}
.with-rail :is(h1.page-title, h1.cv-page-title, h1.jd-page-title, h1.page-ttl, h1.cs-title) {
	font-size: clamp(24px, 2.3vw, 30px);
}

/* Cost & analytics keeps its banner in a header inside .ca .main. */
.with-rail .ca .main > header.head {
	position: sticky; top: 0; z-index: 80; padding: 14px 28px; margin-bottom: var(--stick-gap);
	box-shadow: 0 -48px 0 0 var(--color-rail-bg), 0 var(--stick-gap) 0 0 var(--color-rail-bg);
}
.with-rail .ca .head h1 { font-size: clamp(24px, 2.3vw, 30px); }

/* Tab bars: stacked under the banner. */
.with-rail :is(.an-tabs, .dev .tabs, .ap-tabs) {
	position: sticky;
	top: var(--stick-bar);
	z-index: 25;
	box-shadow: 0 0 0 8px var(--color-rail-bg);
}

/* Talent Pool: the top block is fixed, only the table scrolls. */
/* doubled class: the page's own `.cv-main { padding-bottom: 140px !important }` ties on specificity otherwise */
.with-rail .cv-main.cv-main { display: flex; flex-direction: column; overflow-x: hidden; overflow-y: auto; padding-bottom: 44px !important; }
.with-rail .cv-main > div { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; width: 100%; }  /* the table-wrap's own min-height (300px) overflows this box on a short window, and .cv-main then scrolls */
.with-rail .cv-main > div > * { flex: none; }
.with-rail .cv-main > div > .cv-table-wrap { flex: 1 1 auto; min-height: 300px; overflow: auto; margin-bottom: 8px; }
.with-rail .cv-data-table thead th { top: 0; z-index: 2; background: var(--color-rail-bg); }
/* Slim stat strip, so the table keeps its height. */
.with-rail .cv-stats { gap: 10px; margin-bottom: 8px; }
.with-rail .cv-stats .stat { min-height: 0; padding: 8px 16px; gap: 2px; }
.with-rail .cv-stats .stat .v { font-size: 24px; }
.with-rail .cv-stats .stat .aside { transform: scale(.5); transform-origin: right center; }

@media (max-width: 820px) {
	.with-rail { --hero-h: 0px; --stick-gap: 8px; }
	.with-rail :is(.page-head, .cv-head-row, header.ap-head, .board-head, .agents-head, .users-head, .profile-head, .cs-hero) {
		position: static;
		box-shadow: none;
	}
	.with-rail :is(.an-tabs, .dev .tabs, .ap-tabs) { position: static; box-shadow: none; }
	.with-rail .cv-main { display: block; overflow-y: auto; }
	.with-rail .cv-main > div > .cv-table-wrap { overflow: auto; }
}

/* ── Talent Pool: compact top block and rows ──────────────────────────────
   About 17 of the 50 rows fit a 965px window instead of 6. The banner loses its
   sub-line (the stat strip already says the counts), the stat tiles become a
   one-line strip, the date row is tighter, and each row is about 44px with the
   email beside the name. Left-rail layout only. */
.with-rail .cv-head-row.cv-head-row { padding: 8px 22px; margin-bottom: 8px; }
.with-rail .cv-head-row .cv-page-sub { display: none; }
.with-rail .cv-head-row h1.cv-page-title { font-size: 22px; }
.with-rail .cv-stats { margin-bottom: 6px; }
.with-rail .cv-stats .stat { flex-direction: row; align-items: baseline; gap: 10px; padding: 5px 14px; border-radius: 12px; }
.with-rail .cv-stats .stat .v { font-size: 18px; }
.with-rail .cv-stats .stat .l { font-size: 10.5px; }
.with-rail .cv-stats .stat :is(.aside, .n) { display: none; }
.with-rail .cv-pillbar { margin-bottom: 6px; }
.with-rail .cv-searchrow { margin-bottom: 6px !important; }
.with-rail .cv-filterbar { padding-top: 4px; padding-bottom: 4px; margin-bottom: 4px; }
.with-rail .cv-table-wrap table { border-spacing: 0 3px; }
.with-rail .cv-data-table.cv-data-table td { padding-top: 3px; padding-bottom: 3px; }  /* doubled: the page's own td padding ties otherwise */
.with-rail .cv-data-table div:has(> .row-primary) { display: flex; align-items: baseline; gap: 8px; flex-wrap: nowrap; }
.with-rail .cv-data-table .row-sub { margin-top: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ── Candidate profile: the page scrolls, and the banner is compact ───────
   The skin made `.cand-root` height:auto so it grew past the screen and its
   parent clipped it: nothing could scroll. It now fills the pane and scrolls
   itself. The banner shrinks to one slim row so the profile gets the space. */
.with-rail .cand-root.cand-root { height: 100% !important; overflow-y: auto !important; }
.with-rail .cand-hero.cand-hero { padding: 8px 20px; gap: 8px 16px; align-items: center; margin-bottom: 8px; }
.with-rail .cand-hero-main.cand-hero-main { flex-direction: row; align-items: center; gap: 12px 18px; flex-wrap: nowrap; flex: 1 1 0; }
.with-rail .cand-hero-nav.cand-hero-nav { gap: 6px; flex-wrap: nowrap; flex: none; }
.with-rail .cand-hero-id.cand-hero-id { flex: 1 1 0; }
.with-rail .cand-hero-text.cand-hero-text { overflow: hidden; }
.with-rail .cand-name.cand-name, .with-rail .cand-sub.cand-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.with-rail .cand-chip.cand-chip { min-height: 30px; padding: 0 11px; }
.with-rail .cand-hero-id.cand-hero-id { gap: 12px; flex-wrap: nowrap; }
.with-rail .cand-av.cand-av { width: 44px; height: 44px; border-radius: 14px; font-size: 16px; }
.with-rail .cand-name.cand-name { font-size: 22px; }
.with-rail .cand-sub.cand-sub { margin: 1px 0 0; font-size: 12px; max-width: 80ch; }
.with-rail .cand-hero-actions .qa-btn.qa-btn { min-height: 32px; padding: 0 12px; }

/* ── Talent Pool: the bottom of the table ─────────────────────────────────
   The pager sits right under the table (it had a 16px margin, a rule and 14px
   of padding, so a 55px gap), and the scroll area ends with a little padding so
   the last row is not cut flush at the edge. */
.with-rail .cv-main > div > .cv-table-wrap { padding-bottom: 8px; margin-bottom: 4px; }
.with-rail .cv-main > div > .pagination-bar { margin-top: 0; padding: 6px 4px; border-top: 0; }

/* ── Banner: the decorative circle is a background, not a clipped child ───
   The banner used `overflow: hidden` to crop a pseudo-element circle, and that
   also cropped every menu that drops out of it (the "⋯" menu showed as a sliver).
   The circle is now a radial-gradient, so the banner can let menus overflow. */
.with-rail :is(
	.page-head, .cv-head-row, header.ap-head, .board-head, .agents-head, .users-head,
	.profile-head, .cs-hero, .page-head.section-animate,
	.jd-main div.flex:has(> div > h1.jd-page-title),
	.wrap > .head,
	div.flex.items-center:has(> div.flex-1.min-w-0 > h1),
	.h-full > div:has(> div > h1.page-title),
	.an-root .an-head, .ca .head
) {
	overflow: visible !important;
	border-radius: 18px;
	background-image: radial-gradient(circle 150px at calc(100% - 60px) -40px, rgb(255 255 255 / 0.45) 149px, transparent 150px) !important;
}
.with-rail :is(.page-head, .cv-head-row, header.ap-head, .board-head, .agents-head, .users-head, .profile-head, .cs-hero, .an-root .an-head, .ca .head)::before { content: none !important; }

/* ── Band + section menu layout (HeroBand.svelte, SectionMenu.svelte) ───── */
.with-rail .sect-layout { display: grid; grid-template-columns: 232px minmax(0, 1fr); gap: 14px; margin-top: 14px; align-items: start; }
.with-rail .sect-layout > .sect-main { min-width: 0; display: flex; flex-direction: column; gap: 12px; }
@media (max-width: 820px) {
	.with-rail .sect-layout { grid-template-columns: minmax(0, 1fr); }
	.with-rail .sect-layout > nav, .with-rail .sect-layout .sm { min-width: 0; max-width: 100%; }
	.with-rail .hero .qa-strip { flex-wrap: wrap; max-width: 100%; }
}

	.rail.svelte-1pwn5cg {
		position: fixed;
		left: 14px;
		top: 50%;
		transform: translateY(-50%);
		z-index: 60;
		width: 76px;
		max-height: calc(100vh - 28px);
		padding: 14px 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 10px;
		background: #fff;
		border: 1px solid var(--color-border);
		border-radius: 38px;
		box-shadow: 0 10px 28px rgb(15 23 51 / 0.1);
		overflow: visible;
	}
	.items.svelte-1pwn5cg {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 10px;
		flex: 0 1 auto;
		min-height: 0;
		overflow-y: auto;
		scrollbar-width: none;
		padding: 6px 8px; /* room for the active item's outer ring, which a scroller would clip */
	}
	.items.svelte-1pwn5cg::-webkit-scrollbar { display: none; }
	.tip.svelte-1pwn5cg {
		position: fixed;
		transform: translateY(-50%);
		z-index: 80;
		background: var(--color-ink);
		color: #fff;
		padding: 6px 11px;
		border-radius: 10px;
		font-size: 12.5px;
		font-weight: 600;
		white-space: nowrap;
		pointer-events: none;
	}
	.rb.svelte-1pwn5cg {
		position: relative;
		width: 46px;
		height: 46px;
		border-radius: 50%;
		display: grid;
		place-items: center;
		background: transparent;
		color: var(--color-ink-muted, #4b5563);
		text-decoration: none;
		transition: background 0.15s, color 0.15s;
	}
	.rb.svelte-1pwn5cg:hover { background: #f1f3f8; color: var(--color-ink); }
	.rb.svelte-1pwn5cg:focus-visible, .me.svelte-1pwn5cg:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
	.rb.on.svelte-1pwn5cg {
		background: var(--u-hero, #0f1733);
		color: #fff;
	}
	.rb.on.svelte-1pwn5cg:hover { background: var(--u-hero, #0f1733); color: #fff; }
	.rb.svelte-1pwn5cg .material-symbols-outlined:where(.svelte-1pwn5cg) { font-size: 22px; }
	hr.svelte-1pwn5cg { width: 34px; border: 0; border-top: 1px solid var(--color-border); margin: 2px 0; }

	/* Tooltip */
	[data-tip].svelte-1pwn5cg:hover::after, [data-tip].svelte-1pwn5cg:focus-visible::after {
		content: attr(data-tip);
		position: absolute;
		left: calc(100% + 14px);
		top: 50%;
		transform: translateY(-50%);
		background: var(--color-ink);
		color: #fff;
		padding: 6px 11px;
		border-radius: 10px;
		font-size: 12.5px;
		font-weight: 600;
		white-space: nowrap;
		pointer-events: none;
	}
	[data-tip].svelte-1pwn5cg { position: relative; }

	/* The existing Feed component, shown as one round button. Its panel opens
	   to the right of the rail instead of dropping under a header. */
	.rail-feed.svelte-1pwn5cg { position: relative; }
	.rail-feed.svelte-1pwn5cg .pulse-trigger {
		width: 46px;
		height: 46px;
		padding: 0;
		justify-content: center;
		border: 0;
		background: var(--color-bg-alt);
	}
	.rail-feed.svelte-1pwn5cg .pf-label, .rail-feed.svelte-1pwn5cg .pf-count { display: none; }
	.rail-feed.svelte-1pwn5cg .pf-bell { font-size: 20px; display: grid; }
	.rail-feed.svelte-1pwn5cg .pf-panel {
		top: auto;
		bottom: 0;
		right: auto;
		left: calc(100% + 14px);
	}
	.rail-feed.svelte-1pwn5cg:hover::after { display: none; }

	.ring-link.svelte-1pwn5cg {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 2px;
		color: var(--color-ink);
		text-decoration: none;
		font-size: 12px;
	}
	.ring.svelte-1pwn5cg {
		width: 44px;
		height: 44px;
		border-radius: 50%;
		display: grid;
		place-items: center;
		background: conic-gradient(var(--color-pastel-orange-ink) var(--p), var(--color-bg-alt) 0);
	}
	.ring.svelte-1pwn5cg i:where(.svelte-1pwn5cg) { width: 34px; height: 34px; border-radius: 50%; background: var(--color-surface); }

	.me-wrap.svelte-1pwn5cg { position: relative; }
	.me.svelte-1pwn5cg {
		width: 40px;
		height: 40px;
		border-radius: 50%;
		border: 0;
		background: var(--color-ink);
		color: #fff;
		font-weight: 800;
		font-size: 14px;
		cursor: pointer;
	}
	.me-menu.svelte-1pwn5cg {
		position: absolute;
		left: calc(100% + 14px);
		bottom: 0;
		min-width: 220px;
		padding: 6px;
		background: var(--color-surface);
		border-radius: 16px;
		box-shadow: 0 18px 44px -20px rgb(0 0 0 / 0.5);
		display: flex;
		flex-direction: column;
	}
	.me-menu.svelte-1pwn5cg button:where(.svelte-1pwn5cg) {
		text-align: left;
		border: 0;
		background: transparent;
		padding: 10px 12px;
		border-radius: 10px;
		font: inherit;
		font-size: 13.5px;
		cursor: pointer;
		color: var(--color-ink);
	}
	.me-menu.svelte-1pwn5cg button:where(.svelte-1pwn5cg):hover { background: var(--color-bg-alt); }
	.me-menu.svelte-1pwn5cg .danger:where(.svelte-1pwn5cg) { color: var(--color-danger, #b91c1c); }

	/* Phone: the rail becomes a dock along the bottom. */
	@media (max-width: 820px) {
		.rail.svelte-1pwn5cg {
			left: 10px;
			right: 10px;
			top: auto;
			bottom: 10px;
			transform: none;
			width: auto;
			max-height: none;
			padding: 8px 12px;
			flex-direction: row;
			justify-content: space-around;
			gap: 6px;
			border-radius: 30px;
		}
		hr.svelte-1pwn5cg, .ring-link.svelte-1pwn5cg { display: none; }
		.items.svelte-1pwn5cg { flex-direction: row; overflow-x: auto; overflow-y: hidden; flex: 1 1 auto; justify-content: flex-start; padding: 0 4px; }
		.tip.svelte-1pwn5cg { display: none; }
		[data-tip].svelte-1pwn5cg:hover::after { display: none; }
		.rail-feed.svelte-1pwn5cg .pf-panel { left: auto; right: 0; bottom: calc(100% + 12px); }
		.me-menu.svelte-1pwn5cg { left: auto; right: 0; bottom: calc(100% + 12px); }
	}

	/* Left-rail layout: the rail floats, so the page makes room for it. */
	.with-rail.svelte-12qhfyh { margin-left: 104px; }
	@media (max-width: 820px) {
		.with-rail.svelte-12qhfyh { margin-left: 0; padding-bottom: 84px; }
	}
	@media (max-width: 768px) {
		.hide-mobile.svelte-12qhfyh { display: none !important; }
	}

	/* Mobile-only utility */
	.show-mobile.svelte-12qhfyh { display: none; }
	@media (max-width: 900px) {
		.show-mobile.svelte-12qhfyh { display: inline-flex; }
		.nav-items-desktop.svelte-12qhfyh { display: none !important; }
	}

	/* Hamburger button */
	.hamburger.svelte-12qhfyh {
		background: transparent;
		border: 1px solid var(--color-border, #e8e6dd);
		border-radius: 8px;
		width: 36px;
		height: 36px;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		color: var(--color-ink, #2c2c2c);
		margin-right: 8px;
		padding: 0;
	}
	.hamburger.svelte-12qhfyh:hover { background: var(--color-surface-warm, #f4f3ee); }

	/* Mobile drawer */
	.mobile-nav-overlay.svelte-12qhfyh {
		position: fixed; inset: 0;
		background: rgba(56,56,50,0.45);
		z-index: 980;
		border: 0; padding: 0; cursor: pointer;
		animation: svelte-12qhfyh-mn-fade 0.18s ease;
	}
	.mobile-nav-drawer.svelte-12qhfyh {
		position: fixed;
		top: 0; left: 0; bottom: 0;
		width: 280px;
		max-width: 85vw;
		background: var(--color-bg-alt, #f0eee5);
		border-right: 1px solid var(--color-border, #e8e6dd);
		z-index: 981;
		display: flex;
		flex-direction: column;
		font-family: 'Inter', -apple-system, system-ui, sans-serif;
		animation: svelte-12qhfyh-mn-slide 0.22s ease;
		box-shadow: 4px 0 24px rgba(0,0,0,0.08);
	}
	@keyframes svelte-12qhfyh-mn-fade { from { opacity: 0; } to { opacity: 1; } }
	@keyframes svelte-12qhfyh-mn-slide { from { transform: translateX(-100%); } to { transform: translateX(0); } }

	.mobile-nav-head.svelte-12qhfyh {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 14px 16px;
		border-bottom: 1px solid var(--color-border, #e8e6dd);
	}
	.mobile-nav-close.svelte-12qhfyh {
		background: transparent;
		border: 1px solid var(--color-border, #e8e6dd);
		border-radius: 8px;
		width: 32px; height: 32px;
		display: inline-flex; align-items: center; justify-content: center;
		cursor: pointer;
		color: var(--color-ink-soft, #4a4a48);
	}
	.mobile-nav-close.svelte-12qhfyh:hover { background: var(--color-surface-warm, #f4f3ee); }

	.mobile-nav-list.svelte-12qhfyh {
		flex: 1;
		padding: 12px 8px;
		overflow-y: auto;
		display: flex;
		flex-direction: column;
		gap: 2px;
	}
	.mobile-nav-link.svelte-12qhfyh {
		display: flex;
		align-items: center;
		gap: 12px;
		padding: 11px 14px;
		border-radius: 10px;
		text-decoration: none;
		color: var(--color-ink-soft, #4a4a48);
		font-size: 14px;
		font-weight: 500;
		font-family: inherit;
	}
	.mobile-nav-link.svelte-12qhfyh:hover {
		background: rgba(0,0,0,0.04);
		color: var(--color-ink, #2c2c2c);
	}
	.mobile-nav-link.active.svelte-12qhfyh {
		background: var(--color-accent-soft, #e6ecfd);
		color: var(--color-accent-ink, #1e40af);
		font-weight: 600;
	}

	.mobile-nav-foot.svelte-12qhfyh {
		border-top: 1px solid var(--color-border, #e8e6dd);
		padding: 12px 16px;
		display: flex;
		flex-direction: column;
		gap: 10px;
	}
	.mobile-nav-user.svelte-12qhfyh {
		display: flex;
		align-items: center;
		gap: 10px;
	}
	.mobile-nav-user.svelte-12qhfyh .user-name:where(.svelte-12qhfyh) {
		font-size: 13px;
		color: var(--color-ink-soft, #4a4a48);
		font-weight: 500;
	}

	/* Hide PipelineTerminal on small viewports — too dense for mobile */
	@media (max-width: 900px) {
		.term-wrap,
		.pipeline-terminal,
		#pipeline-terminal,
		[data-pipeline-terminal] {
			display: none !important;
		}
	}

	/* Tighten nav padding on mobile so brand + hamburger fit */
	@media (max-width: 600px) {
		.claude-nav.svelte-12qhfyh { padding: 0 12px; }
		.brand.svelte-12qhfyh { margin-right: 12px; }
		.brand-text.svelte-12qhfyh { font-size: 16px; }
	}

	/* Skip-to-content (a11y) — visible only when focused */
	.skip-to-content.svelte-12qhfyh {
		position: absolute;
		top: -40px;
		left: 12px;
		z-index: 9999;
		background: var(--color-accent, #1d4ed8);
		color: #fff;
		padding: 8px 14px;
		border-radius: 999px;
		font-size: 13px;
		font-weight: 600;
		text-decoration: none;
		transition: top 120ms ease-out;
	}
	.skip-to-content.svelte-12qhfyh:focus,
	.skip-to-content.svelte-12qhfyh:focus-visible {
		top: 12px;
		outline: 2px solid var(--color-accent, #1d4ed8);
		outline-offset: 2px;
	}
	.route-fade.svelte-12qhfyh { will-change: opacity; }

	/* ── Claude warm top nav ── */
	.claude-nav.svelte-12qhfyh {
		height: 60px;
		display: flex;
		align-items: center;
		padding: 0 24px;
		gap: 4px;
		flex-shrink: 0;
		background: var(--color-bg-alt, #f0eee5);
		border-bottom: 1px solid var(--color-border, #e8e6dd);
		color: var(--color-ink, #2c2c2c);
		font-family: 'Inter', -apple-system, system-ui, sans-serif;
	}

	.brand.svelte-12qhfyh {
		display: flex;
		align-items: center;
		gap: 11px;
		margin-right: 28px;
		text-decoration: none;
		color: inherit;
	}
	.brand-logo.svelte-12qhfyh {
		width: 32px;
		height: 32px;
		border-radius: 9px;
		background: var(--color-accent, #1d4ed8);
		color: #fff;
		display: grid;
		place-items: center;
		font-weight: 700;
		font-size: 15px;
		font-family: 'Tiempos Headline', 'Charter', Georgia, serif;
	}
	.brand-logo-img.svelte-12qhfyh { background: transparent !important; padding: 0; overflow: hidden; }
	.brand-logo-img.svelte-12qhfyh img:where(.svelte-12qhfyh) { width: 100%; height: 100%; object-fit: cover; display: block; }
	.brand-text.svelte-12qhfyh {
		font-weight: 600;
		font-size: 17px;
		letter-spacing: -0.01em;
		font-family: 'Tiempos Headline', 'Charter', Georgia, serif;
		color: var(--color-ink, #2c2c2c);
	}

	.nav-items.svelte-12qhfyh {
		display: flex;
		gap: 2px;
		align-items: center;
	}
	.nav-item.svelte-12qhfyh {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		padding: 8px 14px;
		color: var(--color-ink-soft, #4a4a48);
		text-decoration: none;
		font-size: 13.5px;
		font-weight: 500;
		border-radius: var(--radius-sm, 8px);
		transition: background 0.15s, color 0.15s;
		font-family: inherit;
	}
	.nav-item.svelte-12qhfyh:hover {
		background: rgba(0, 0, 0, 0.04);
		color: var(--color-ink, #2c2c2c);
	}
	.nav-item.active.svelte-12qhfyh {
		background: var(--color-accent-soft, #e6ecfd);
		color: var(--color-accent-ink, #1e40af);
		font-weight: 600;
	}
	.nav-item-icon-mobile.svelte-12qhfyh { display: none; font-size: 16px; }

	/* ---- Dropdown nav (Communicate ▾) ---- */
	.nav-dropdown.svelte-12qhfyh { position: relative; }
	.nav-item-with-children.svelte-12qhfyh { display: inline-flex; align-items: center; gap: 4px; }
	.nav-caret.svelte-12qhfyh { font-size: 11px; opacity: 0.7; }
	.nav-badge.svelte-12qhfyh {
		font-size: 11px; font-weight: 700; letter-spacing: 0.06em;
		padding: 1px 6px; border-radius: 999px; margin-left: 4px;
		background: var(--color-accent, #1d4ed8); color: #fff;
		animation: svelte-12qhfyh-navBadgePulse 2s infinite;
	}
	@keyframes svelte-12qhfyh-navBadgePulse {
		0%, 100% { opacity: 1; }
		50% { opacity: 0.65; }
	}
	.nav-dropdown-menu.svelte-12qhfyh {
		position: absolute; top: calc(100% + 6px); left: 0;
		min-width: 280px; padding: 8px;
		background: var(--color-surface-bright, #fff);
		border: 1px solid var(--color-border, #e8e6dd);
		border-radius: 10px;
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08), 0 2px 6px rgba(0, 0, 0, 0.04);
		opacity: 0; visibility: hidden; transform: translateY(-4px);
		transition: opacity 140ms, transform 140ms, visibility 140ms;
		z-index: 200;
	}
	.nav-dropdown.svelte-12qhfyh:hover .nav-dropdown-menu:where(.svelte-12qhfyh),
	.nav-dropdown.svelte-12qhfyh:focus-within .nav-dropdown-menu:where(.svelte-12qhfyh) {
		opacity: 1; visibility: visible; transform: translateY(0);
	}
	.nav-dropdown-item.svelte-12qhfyh {
		display: block; padding: 10px 12px; border-radius: 7px;
		color: var(--color-on-surface, #2c2c2c); text-decoration: none;
		transition: background 120ms;
	}
	.nav-dropdown-item.svelte-12qhfyh:hover { background: var(--color-bg, #faf9f5); }
	.nav-dropdown-item.active.svelte-12qhfyh { background: rgba(201, 99, 66, 0.08); }
	.nav-dd-row.svelte-12qhfyh { display: flex; align-items: center; gap: 8px; }
	.nav-dd-icon.svelte-12qhfyh {
		font-size: 17px; color: var(--color-on-surface-dim, #6f6e69);
		flex-shrink: 0;
	}
	.nav-dropdown-item.active.svelte-12qhfyh .nav-dd-icon:where(.svelte-12qhfyh) { color: var(--color-accent, #1d4ed8); }
	.nav-dd-label.svelte-12qhfyh { font-size: 13.5px; font-weight: 600; }
	.nav-dd-soon.svelte-12qhfyh {
		font-size: 11px; font-weight: 700; letter-spacing: 0.06em;
		padding: 1px 6px; border-radius: 4px;
		background: rgba(201, 99, 66, 0.10); color: var(--color-accent, #1d4ed8);
	}
	.nav-dd-desc.svelte-12qhfyh { font-size: 11.5px; color: var(--color-on-surface-dim, #6f6e69); margin-top: 2px; }
	@media (max-width: 768px) {
		.nav-item-icon-mobile.svelte-12qhfyh { display: inline-flex; }
		.nav-item.svelte-12qhfyh { padding: 8px 10px; }
	}

	.nav-spacer.svelte-12qhfyh { flex: 1; }
	/* `flex: none` meant this group could never give up width, so between 768px
	   (where .hide-mobile starts hiding things) and ~1024px the merge, spend
	   and scope pills kept full size and pushed the header into overflow.
	   `flex: 0 1 auto` lets it shrink; the pills below cap and ellipsis their
	   own text so shrinking degrades them instead of the layout. */
	.nav-right.svelte-12qhfyh { display: flex; align-items: center; gap: 8px; flex: 0 1 auto; min-width: 0; }
	.nav-spacer.svelte-12qhfyh { min-width: 0; }
	/* The menu is the right thing to sacrifice first: it scrolls, everything
	   stays reachable, and no item is silently dropped. */
	.nav-items.svelte-12qhfyh { min-width: 0; overflow-x: auto; scrollbar-width: none; }
	.nav-items.svelte-12qhfyh::-webkit-scrollbar { display: none; }

	.merge-pill.svelte-12qhfyh {
		display: inline-flex;
		align-items: center;
		gap: 5px;
		padding: 5px 11px;
		background: var(--color-red-soft, #f5dada);
		color: var(--color-red, #a83232);
		border: 1px solid var(--color-red-soft, #f5dada);
		border-radius: var(--radius-pill, 999px);
		font-size: 12px;
		font-weight: 500;
		text-decoration: none;
		font-family: inherit;
	}
	.merge-pill.svelte-12qhfyh:hover { filter: brightness(0.97); }

	/* Monthly AI spend — a status, not a control. Clickable, but never styled
	   as a button. Hidden below 768px; the bar drops at 1024px so the header
	   still fits alongside the agents pill and the user menu. */
	.spend-pill.svelte-12qhfyh {
		display: inline-flex;
		align-items: center;
		gap: 7px;
		flex: none;
		height: 30px;
		padding: 0 11px;
		border: 1px solid var(--color-border, #e8e8ec);
		border-radius: var(--radius-pill, 999px);
		background: var(--color-surface, #ffffff);
		color: var(--color-muted, #52525b);
		font-size: 12.5px;
		font-weight: 500;
		text-decoration: none;
		font-family: inherit;
	}
	.spend-pill.svelte-12qhfyh:hover { filter: brightness(0.98); }
	.spend-text.svelte-12qhfyh { font-variant-numeric: tabular-nums; white-space: nowrap; }
	.spend-bar.svelte-12qhfyh {
		width: 44px;
		height: 5px;
		flex: none;
		border-radius: 999px;
		background: var(--color-border, #e8e8ec);
		overflow: hidden;
	}
	.spend-bar.svelte-12qhfyh i:where(.svelte-12qhfyh) {
		display: block;
		height: 100%;
		border-radius: 999px;
		background: var(--color-success, #15803d);
	}
	.spend-ok.svelte-12qhfyh { color: var(--color-success, #15803d); }
	.spend-warn.svelte-12qhfyh {
		color: var(--color-warning, #92400e);
		border-color: color-mix(in srgb, var(--color-warning, #92400e) 32%, var(--color-surface, #ffffff));
		background: color-mix(in srgb, var(--color-warning, #92400e) 10%, var(--color-surface, #ffffff));
	}
	.spend-warn.svelte-12qhfyh .spend-bar:where(.svelte-12qhfyh) i:where(.svelte-12qhfyh) { background: var(--color-warning, #92400e); }
	.spend-over.svelte-12qhfyh {
		color: var(--color-error, #b91c1c);
		border-color: color-mix(in srgb, var(--color-error, #b91c1c) 32%, var(--color-surface, #ffffff));
		background: color-mix(in srgb, var(--color-error, #b91c1c) 10%, var(--color-surface, #ffffff));
	}
	.spend-over.svelte-12qhfyh .spend-bar:where(.svelte-12qhfyh) i:where(.svelte-12qhfyh) { background: var(--color-error, #b91c1c); }
	/* 901–1024px is the tight window: desktop nav items are still shown and the
	   spend pill has just arrived. Drop the bar, the wordmark and the full
	   operator name rather than letting the header push the page sideways. */
	@media (max-width: 1024px) {
		.spend-bar.svelte-12qhfyh { display: none; }
		.brand-text.svelte-12qhfyh { display: none; }
		.brand.svelte-12qhfyh { margin-right: 14px; }
		/* 768–1024px is where the header ran out of room: too wide for
		   .hide-mobile, too narrow for everything at full size. Cap the two
		   variable-length pills rather than dropping them. */
		.scope-pill.svelte-12qhfyh { max-width: 128px; }
		.merge-pill.svelte-12qhfyh { max-width: 132px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
		.user-pill.svelte-12qhfyh .user-name:where(.svelte-12qhfyh) {
			max-width: 88px;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
		}
	}

	.scope-pill.svelte-12qhfyh {
		display: inline-flex;
		align-items: center;
		max-width: 200px;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		padding: 5px 11px;
		background: var(--color-accent-soft, #e6ecfd);
		color: var(--color-accent-ink, #1e40af);
		border: 1px solid var(--color-accent-soft, #e6ecfd);
		border-radius: var(--radius-pill, 999px);
		font-size: 12px;
		font-weight: 500;
		font-family: inherit;
	}

	.cmdk.svelte-12qhfyh {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		padding: 7px 12px;
		background: var(--color-surface, #ffffff);
		border: 1px solid var(--color-border, #e8e6dd);
		border-radius: var(--radius-pill, 999px);
		font-size: 12.5px;
		color: var(--color-muted, #6f6e69);
		cursor: pointer;
		min-width: 220px;
		font-family: inherit;
	}
	.cmdk.svelte-12qhfyh:hover { background: var(--color-surface-warm, #f4f3ee); }
	/* (unused) .cmdk .kbd {
		margin-left: auto;
		padding: 1px 6px;
		background: var(--color-surface-warm, #f4f3ee);
		border: 1px solid var(--color-border, #e8e6dd);
		border-radius: 4px;
		font-size: 11px;
		font-family: ui-monospace, SFMono-Regular, monospace;
		color: var(--color-muted, #6f6e69);
	}*/

	.user-menu-area.svelte-12qhfyh {
		position: relative;
		display: inline-block;
	}
	.user-pill.svelte-12qhfyh {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		padding: 4px 10px 4px 4px;
		border-radius: var(--radius-pill, 999px);
		background: transparent;
		border: 1px solid transparent;
		cursor: pointer;
		font-family: inherit;
		transition: background 0.15s, border-color 0.15s;
	}
	.user-pill.svelte-12qhfyh:hover {
		background: var(--color-surface-warm, #f4f3ee);
		border-color: var(--color-border, #e8e6dd);
	}
	.user-pill.svelte-12qhfyh:focus-visible {
		outline: 2px solid var(--color-accent, #1d4ed8);
		outline-offset: 2px;
	}
	.user-pill.svelte-12qhfyh .caret:where(.svelte-12qhfyh) {
		font-size: 16px;
		color: var(--color-muted, #6f6e69);
	}

	.user-menu.svelte-12qhfyh {
		position: absolute;
		top: calc(100% + 8px);
		right: 0;
		min-width: 240px;
		background: var(--color-surface, #ffffff);
		border: 1px solid var(--color-border, #e8e6dd);
		border-radius: 12px;
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
		padding: 6px;
		z-index: 200;
		display: flex;
		flex-direction: column;
		gap: 1px;
	}
	.user-menu-item.svelte-12qhfyh {
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 9px 12px;
		background: transparent;
		border: none;
		border-radius: 8px;
		font-size: 13px;
		color: var(--color-ink, #2c2c2c);
		text-align: left;
		cursor: pointer;
		font-family: inherit;
		transition: background 0.12s;
	}
	.user-menu-item.svelte-12qhfyh:hover {
		background: var(--color-accent-soft, #e6ecfd);
		color: var(--color-accent-ink, #1e40af);
	}
	.user-menu-item.svelte-12qhfyh .mi-icon:where(.svelte-12qhfyh) {
		font-size: 18px;
		color: var(--color-muted, #6f6e69);
	}
	.user-menu-item.svelte-12qhfyh:hover .mi-icon:where(.svelte-12qhfyh) {
		color: var(--color-accent-ink, #1e40af);
	}
	/* The build row is information, not an action — quieter than the items
	   above it, but still clickable to copy. */
	.user-menu-build.svelte-12qhfyh {
		font-size: 11.5px;
		color: var(--color-on-surface-dim, #6b6a63);
		font-variant-numeric: tabular-nums;
	}
	.build-copy.svelte-12qhfyh {
		margin-left: auto;
		font-size: 11px;
		color: var(--color-primary, #2d6a4f);
	}
	.user-menu-divider.svelte-12qhfyh {
		height: 1px;
		background: var(--color-border, #e8e6dd);
		margin: 4px 2px;
	}
	.user-menu-danger.svelte-12qhfyh {
		color: var(--color-red, #a83232);
	}
	.user-menu-danger.svelte-12qhfyh .mi-icon:where(.svelte-12qhfyh) {
		color: var(--color-red, #a83232);
	}
	.user-menu-danger.svelte-12qhfyh:hover {
		background: var(--color-red-soft, #f5dada);
		color: var(--color-red, #a83232);
	}
	.user-menu-danger.svelte-12qhfyh:hover .mi-icon:where(.svelte-12qhfyh) {
		color: var(--color-red, #a83232);
	}
	.avatar.svelte-12qhfyh {
		width: 28px;
		height: 28px;
		border-radius: 50%;
		background: var(--color-accent, #1d4ed8);
		color: #fff;
		display: grid;
		place-items: center;
		font-size: 11px;
		font-weight: 700;
		font-family: inherit;
	}
	.user-name.svelte-12qhfyh {
		font-size: 12.5px;
		color: var(--color-ink-soft, #4a4a48);
		font-weight: 500;
		max-width: 160px;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.logout-btn.svelte-12qhfyh {
		padding: 7px 13px;
		border-radius: var(--radius-pill, 999px);
		background: transparent;
		color: var(--color-muted, #6f6e69);
		border: 1px solid var(--color-border, #e8e6dd);
		font-size: 12.5px;
		font-weight: 500;
		cursor: pointer;
		font-family: inherit;
		transition: background 0.15s, color 0.15s, border-color 0.15s;
	}
	.logout-btn.svelte-12qhfyh:hover {
		background: var(--color-surface-warm, #f4f3ee);
		color: var(--color-ink, #2c2c2c);
		border-color: var(--color-border-strong, #d8d5cb);
	}
	.logout-btn.svelte-12qhfyh:focus-visible {
		outline: 2px solid var(--color-accent, #1d4ed8);
		outline-offset: 2px;
	}

	/* ── Footer ── */
	.claude-foot.svelte-12qhfyh {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 24px;
		height: 32px;
		flex-shrink: 0;
		background: var(--color-bg-alt, #f0eee5);
		border-top: 1px solid var(--color-border, #e8e6dd);
		color: var(--color-muted, #6f6e69);
		font-family: 'Inter', -apple-system, system-ui, sans-serif;
		font-size: 11.5px;
	}
	.foot-status.svelte-12qhfyh { display: flex; align-items: center; gap: 8px; }
	.foot-dot.svelte-12qhfyh {
		width: 6px;
		height: 6px;
		border-radius: 50%;
		background: var(--color-accent, #1d4ed8);
		box-shadow: 0 0 0 3px var(--color-accent-bg, #f3f6fe);
	}
	.foot-version.svelte-12qhfyh {
		color: var(--color-dim, #97968f);
		letter-spacing: 0.02em;
	}

	/* Notification Bell */
	.notif-badge.svelte-12qhfyh {
		position: absolute;
		top: 0;
		right: -2px;
		background: #ff4444;
		color: white;
		font-size: 11px;
		font-weight: 900;
		min-width: 16px;
		height: 16px;
		border-radius: 8px;
		display: flex;
		align-items: center;
		justify-content: center;
		line-height: 1;
		padding: 0 3px;
	}

	/* Notification Panel */
	.notif-panel.svelte-12qhfyh {
		position: absolute;
		top: calc(100% + 8px);
		right: 0;
		width: 340px;
		max-height: 420px;
		background: white;
		border: 1px solid var(--color-border, #d8d5cc);
		border-radius: 8px;
		box-shadow: 0 1px 3px rgba(0,0,0,0.06);
		z-index: 100;
		display: flex;
		flex-direction: column;
	}
	.notif-panel-header.svelte-12qhfyh {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 10px 14px;
		border-bottom: 1px solid #eee;
		color: var(--color-on-surface, #2c2c2c);
	}
	.notif-mark-all.svelte-12qhfyh {
		background: none;
		border: none;
		color: var(--color-accent, #1d4ed8);
		font-size: 11px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.06em;
		cursor: pointer;
		font-family: 'Space Grotesk', sans-serif;
	}
	.notif-mark-all.svelte-12qhfyh:hover {
		text-decoration: underline;
	}
	.notif-panel-body.svelte-12qhfyh {
		overflow-y: auto;
		flex: 1;
	}
	.notif-empty.svelte-12qhfyh {
		padding: 2rem;
		text-align: center;
		color: #aaa;
		font-size: 12px;
	}
	.notif-item.svelte-12qhfyh {
		display: flex;
		align-items: flex-start;
		gap: 8px;
		padding: 10px 14px;
		border-bottom: 1px solid #f5f5f0;
		cursor: pointer;
		width: 100%;
		background: none;
		border-left: none;
		border-right: none;
		border-top: none;
		text-align: left;
		font-family: 'Space Grotesk', sans-serif;
		transition: background 0.1s;
	}
	.notif-item.svelte-12qhfyh:hover {
		background: #fafaf5;
	}
	.notif-unread.svelte-12qhfyh {
		background: #f8fff0;
	}
	.notif-dot-wrap.svelte-12qhfyh {
		width: 8px;
		flex-shrink: 0;
		padding-top: 5px;
	}
	.notif-dot.svelte-12qhfyh {
		width: 8px;
		height: 8px;
		background: var(--color-accent, #1d4ed8);
		border: 1px solid rgba(29,78,216,0.5);
		border-radius: 50%;
	}
	.notif-content.svelte-12qhfyh {
		flex: 1;
		min-width: 0;
	}
	.notif-title.svelte-12qhfyh {
		font-size: 12px;
		font-weight: 700;
		color: var(--color-on-surface, #2c2c2c);
		line-height: 1.3;
	}
	.notif-msg.svelte-12qhfyh {
		font-size: 11px;
		color: #888;
		margin-top: 2px;
		line-height: 1.3;
	}
	.notif-time.svelte-12qhfyh {
		font-size: 11px;
		color: #bbb;
		margin-top: 3px;
	}