/* ============================================================
   Marketing Intake — ShipStation-branded multi-step form
   Visual system ported from the Claude Design handoff.

   Most rules are scoped to .mi-shell so design tokens don't
   leak into the rest of the WP page. A small set of rules under
   body.mi-page are applied page-wide on pages that embed the
   shortcode — they hide the theme's default page title (the
   hero acts as the page header) and remove the page wrapper's
   side padding so the hero can be full-bleed.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Figtree:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

/* ---- Page-level hooks (only on pages that embed the shortcode) ---- */
body.mi-page .entry-title,
body.mi-page .page-title,
body.mi-page .wp-block-post-title,
body.mi-page header.entry-header,
body.mi-page .entry-header { display: none !important; }
body.mi-page .entry-content,
body.mi-page .wp-block-post-content,
body.mi-page main,
body.mi-page .site-main,
body.mi-page .content-area { padding-left: 0 !important; padding-right: 0 !important; max-width: none !important; }
body.mi-page .entry-content { margin-top: 0 !important; }
body.mi-page #marketing-intake-form-root { width: 100%; }

.mi-shell {
	/* ---- ShipStation palette ---- */
	--ss-bright-green:    #00E664;
	--ss-deep-indigo:     #11003A;
	--ss-mid-green:       #00B750;
	--ss-marigold:        #FFB400;
	--ss-indigo:          #5C50FF;

	--ss-indigo-20:       #EEEDFF;
	--ss-indigo-40:       #DEDCFF;
	--ss-indigo-60:       #BEB9FF;

	--ss-marigold-10:     #FFF8E6;
	--ss-marigold-25:     #FFECBF;

	--ss-bright-green-20: #E5FCEF;

	--ss-grey-50:         #F9F9F9;
	--ss-grey-100:        #F1F2F3;
	--ss-grey-200:        #E4E5E7;
	--ss-grey-300:        #CFD1D3;
	--ss-grey-400:        #AFB3B6;
	--ss-grey-500:        #8D9196;
	--ss-grey-violet:     #BEC0DE;

	--mi-accent:     var(--ss-bright-green);
	--mi-accent-ink: var(--ss-deep-indigo);
	--mi-link-hover: var(--ss-indigo);
	--mi-field-err:  #D92D20;
	--mi-border:     var(--ss-grey-200);
	--mi-page-bg:    #F4F5F7;

	--mi-shadow-sm: 0 1px 2px rgba(15,15,15,.06);
	--mi-shadow-md: 0 4px 16px rgba(15,15,15,.08);

	--mi-r-pill: 999px;
	--mi-r-card: 24px;
	--mi-r-input: 12px;

	--mi-font-body: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--mi-font-mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

	font-family: var(--mi-font-body);
	color: var(--ss-deep-indigo);
	line-height: 1.4;
	-webkit-font-smoothing: antialiased;
}

/* ============================================================
   Theme-style reset — neutralizes inherited theme rules so our
   design tokens win without an !important arms race.
   `all: revert` drops author/theme styles back to user-agent
   defaults; the rules that follow re-establish our base look.
   SVGs are excluded: their presentation attributes (d, cx/cy/r,
   stroke, fill, width/height) cascade at author level, so
   `all: revert` would wipe them and blank out the icons.
   ============================================================ */
.mi-shell,
.mi-shell *:where(:not(svg):not(svg *)),
.mi-shell *::before,
.mi-shell *::after { all: revert; }

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

/* Re-establish base typography and color after the revert. */
.mi-shell {
	font-family: var(--mi-font-body);
	color: var(--ss-deep-indigo);
	line-height: 1.4;
	-webkit-font-smoothing: antialiased;
}
.mi-shell h1,
.mi-shell h2,
.mi-shell h3,
.mi-shell h4,
.mi-shell p,
.mi-shell label,
.mi-shell span,
.mi-shell div,
.mi-shell button,
.mi-shell input,
.mi-shell select,
.mi-shell textarea,
.mi-shell a {
	font-family: var(--mi-font-body);
	color: inherit;
}
.mi-shell button { cursor: pointer; }
.mi-shell a { text-decoration: none; }
.mi-shell a:hover { color: var(--mi-link-hover); }
.mi-shell svg { color: inherit; }
.mi-shell svg { stroke: currentColor; fill: none; }

/* ============================================================
   Shell layout: page wrapper, the card, and header banner.
   ============================================================ */
.mi-shell {
	background: var(--mi-page-bg);
	padding: 0 0 64px;
	margin: 0;
}
.mi-form { max-width: none; margin: 0; }

/* ---------- Branded header banner: full-bleed page header ---------- */
.mi-hero {
	background: var(--ss-deep-indigo);
	padding: 64px 40px 80px;
	color: #fff;
	position: relative;
	overflow: hidden;
}
.mi-hero__inner {
	max-width: 880px;
	margin: 0 auto;
	position: relative;
}
.mi-hero__grid {
	position: absolute; inset: 0;
	background-image: radial-gradient(rgba(255,255,255,.10) 1.4px, transparent 1.4px);
	background-size: 22px 22px;
	opacity: .5;
	pointer-events: none;
}
.mi-hero__pill {
	display: inline-flex; align-items: center; gap: 7px; position: relative;
	background: rgba(255,255,255,.10);
	border: 1px solid rgba(255,255,255,.16);
	color: #fff; font-size: 15px; font-weight: 600;
	padding: 5px 12px;
	border-radius: var(--mi-r-pill);
	margin-bottom: 18px; white-space: nowrap;
}
.mi-hero__pill .mi-dot {
	width: 8px; height: 8px; border-radius: var(--mi-r-pill);
	background: var(--ss-bright-green);
}
.mi-hero,
.mi-hero * { color: #fff; }
.mi-hero h1 {
	font-size: 46px; font-weight: 800; letter-spacing: -.02em;
	line-height: 1.05; margin: 0; position: relative; color: #BEB9FF;
}
.mi-hero p {
	font-size: 18.5px; margin: 10px 0 0;
	max-width: 72ch; position: relative;
	font-weight: 600;
}
.mi-shell .mi-hero p.mi-hero__sub {
	font-size: 16px; font-weight: 500; font-style: italic;
	color: rgba(255,255,255,.78);
	margin-top: 6px;
}

/* ---------- Card body ---------- */
.mi-card {
	background: #fff;
	border-radius: var(--mi-r-card);
	box-shadow: var(--mi-shadow-md);
	border: 1px solid var(--mi-border);
	max-width: 880px;
	margin: -48px auto 0;
	position: relative;
	z-index: 1;
}
.mi-body { padding: 32px 40px 36px; }

/* Resume / draft banner — full-width, sits directly below the site nav,
   above the hero. Transparent fill with a deep-indigo frame; the content
   is constrained to the hero/card width and centered. */
.mi-resume {
	margin: 0;
	width: 100%;
	background: transparent;
	border: 1px solid var(--ss-deep-indigo);
	border-radius: 0;
	color: var(--ss-deep-indigo);
	font-size: 15.5px;
}
.mi-resume__inner {
	max-width: 880px;
	margin: 0 auto;
	padding: 12px 40px;
	display: flex; align-items: center; gap: 10px;
	justify-content: space-between;
}
/* "Start over" action inside the draft banner — a plain text link + arrow. */
.mi-shell .mi-resume__link {
	display: inline-flex; align-items: center; gap: 6px;
	background: transparent; border: 0; padding: 0;
	color: var(--ss-deep-indigo); font-weight: 700; font-size: 15.5px;
	font-family: inherit; cursor: pointer; white-space: nowrap;
}
.mi-shell .mi-resume__link::after { content: '→'; font-size: 16px; line-height: 1; }
.mi-shell .mi-resume__link:hover { color: var(--ss-indigo); text-decoration: underline; text-underline-offset: 3px; }

/* Live timeline reality-check banner */
.mi-timeline-warn {
	margin: 0 40px 4px;
	background: var(--ss-marigold-10);
	border: 1px solid var(--ss-marigold-25);
	color: #6b5200;
	padding: 10px 14px;
	border-radius: 12px;
	font-size: 15.5px;
	display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
.mi-timeline-warn__txt { flex: 1; min-width: 200px; }
.mi-timeline-warn__btn {
	background: var(--ss-deep-indigo); color: #fff;
	border: none; border-radius: var(--mi-r-pill);
	padding: 6px 14px; font-size: 15px; font-weight: 600;
	white-space: nowrap; cursor: pointer;
}
.mi-timeline-warn__btn:hover { background: #1e0a52; }

/* ---------- Branch (request type) selector ---------- */
.mi-rt-block { padding: 28px 40px 28px; }
.mi-rt-label {
	font-size: 15px; font-weight: 700;
	letter-spacing: .06em; text-transform: uppercase;
	color: var(--ss-grey-500); margin-bottom: 14px;
}

/* Card grid: full-width rows, vertically stacked */
.mi-rt-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
}
.mi-rt-card,
.mi-rt-card:hover,
.mi-rt-card:focus,
.mi-rt-card:active {
	display: flex; flex-direction: row; align-items: center; gap: 16px;
	text-align: left;
	background: #fff;
	border: 1.5px solid var(--mi-border);
	border-radius: 14px;
	padding: 16px 20px;
	cursor: pointer;
	transition: border-color .15s, transform .1s, box-shadow .15s, background .15s;
	font-family: inherit;
	color: var(--ss-deep-indigo);
}
.mi-shell .mi-rt-card__txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mi-shell .mi-rt-card:hover,
.mi-shell .mi-rt-card:focus {
	border-color: var(--ss-indigo-60);
	background: #fff;
	color: var(--ss-deep-indigo);
	transform: translateY(-1px);
	box-shadow: var(--mi-shadow-sm);
}
.mi-shell .mi-rt-card.is-active,
.mi-shell .mi-rt-card.is-active:hover,
.mi-shell .mi-rt-card.is-active:focus {
	border-color: var(--ss-deep-indigo);
	background: var(--ss-indigo-20);
	color: var(--ss-deep-indigo);
	box-shadow: 0 0 0 3px var(--ss-indigo-20);
}
.mi-shell .mi-rt-card__ic {
	width: 42px; height: 42px; border-radius: 11px;
	background: var(--ss-indigo-20); color: var(--ss-deep-indigo);
	display: inline-flex; align-items: center; justify-content: center;
	flex: 0 0 auto;
}
.mi-shell .mi-rt-current__ic {
	background: var(--ss-indigo-20); color: var(--ss-deep-indigo);
}
.mi-shell .mi-rt-card .mi-rt-card__t,
.mi-shell .mi-rt-card:hover .mi-rt-card__t {
	font-size: 17px; font-weight: 700; line-height: 1.25;
	color: var(--ss-deep-indigo);
}
.mi-shell .mi-rt-card .mi-rt-card__b,
.mi-shell .mi-rt-card:hover .mi-rt-card__b {
	font-size: 15px; line-height: 1.4;
	color: var(--ss-grey-700);
}

/* Drill-down breadcrumb row above the card grid */
.mi-shell .mi-rt-crumbs {
	display: flex; align-items: center; gap: 12px;
	margin-bottom: 12px;
}
.mi-shell .mi-rt-crumbs__label {
	font-size: 14px; font-weight: 700;
	letter-spacing: .06em; text-transform: uppercase;
	color: var(--ss-grey-500);
}


/* Sub-picker shown when a group has >1 branches */
.mi-rt-sublist {
	margin-top: 18px;
	padding: 14px 16px 16px;
	background: var(--ss-grey-50);
	border: 1px solid var(--mi-border);
	border-radius: 14px;
}
.mi-rt-sublist__label {
	font-size: 14px; font-weight: 700;
	letter-spacing: .06em; text-transform: uppercase;
	color: var(--ss-grey-500); margin-bottom: 10px;
}
.mi-rt-sublist__items {
	display: flex; flex-wrap: wrap; gap: 8px;
}
.mi-rt-sub {
	display: inline-flex; align-items: center;
	background: #fff;
	border: 1.5px solid var(--mi-border);
	color: var(--ss-deep-indigo);
	border-radius: var(--mi-r-pill);
	padding: 8px 14px;
	font-size: 16px; font-weight: 600;
	font-family: inherit;
	cursor: pointer;
	transition: all .15s;
}
.mi-rt-sub:hover {
	border-color: var(--ss-deep-indigo);
	background: var(--ss-indigo-20);
}

/* Selected request type (wizard view) — transparent fill with a deep-indigo
   frame, matching the draft banner. The Change button lives inside the border. */
.mi-rt-current {
	display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
	justify-content: space-between;
	background: transparent;
	border: 1px solid var(--ss-deep-indigo);
	border-radius: 18px;
	padding: 16px 22px;
}
.mi-shell .mi-rt-current__chip {
	display: inline-flex; align-items: center; gap: 16px;
	background: transparent;
	border: 0;
	border-radius: 0;
	padding: 0;
	flex: 1; min-width: 280px;
	box-shadow: none;
	color: var(--ss-deep-indigo);
}
.mi-shell .mi-rt-current__ic {
	width: 52px; height: 52px; border-radius: 13px;
	background: transparent; color: var(--ss-deep-indigo);
	border: 1.5px solid var(--ss-deep-indigo);
	display: inline-flex; align-items: center; justify-content: center;
	flex-shrink: 0;
}
.mi-shell .mi-rt-current__ic svg { width: 26px; height: 26px; color: var(--ss-deep-indigo); }
.mi-shell .mi-rt-current__txt {
	display: inline-flex; flex-direction: column; line-height: 1.2;
}
.mi-shell .mi-rt-current__group {
	font-size: 13px; font-weight: 700;
	letter-spacing: .08em; text-transform: uppercase;
	color: var(--ss-grey-500); margin-bottom: 4px;
}
.mi-shell .mi-rt-current__label {
	font-size: 22px; font-weight: 800; color: var(--ss-deep-indigo);
	letter-spacing: -.01em;
}
.mi-shell .mi-rt-change {
	display: inline-flex; align-items: center; gap: 6px;
	background: var(--mi-accent); border: 1.5px solid var(--mi-accent);
	color: var(--ss-deep-indigo); font-weight: 700; font-size: 15px;
	padding: 11px 22px; border-radius: var(--mi-r-pill);
	cursor: pointer; font-family: inherit;
	transition: background .15s, border-color .15s, transform .1s;
}
.mi-shell .mi-rt-change:hover {
	background: var(--ss-mid-green); border-color: var(--ss-mid-green);
	color: var(--ss-deep-indigo); transform: translateY(-1px);
}
.mi-shell .mi-rt-change::before { content: '↻'; font-size: 17px; line-height: 1; }

.mi-rt-row {
	display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
.mi-rt-chip {
	display: inline-flex; align-items: center; gap: 10px;
	border: 1.5px solid var(--ss-deep-indigo);
	background: var(--ss-indigo-20);
	color: var(--ss-deep-indigo);
	border-radius: 14px;
	padding: 10px 14px;
	font-size: 16px; font-weight: 700; line-height: 1.2;
}
.mi-rt-chip .mi-rt-chip__ic {
	width: 30px; height: 30px; border-radius: 9px;
	background: var(--ss-deep-indigo); color: var(--ss-bright-green);
	display: flex; align-items: center; justify-content: center;
	font-size: 18.5px;
}
.mi-rt-chip .mi-rt-chip__group {
	font-size: 12.5px; font-weight: 600; color: var(--ss-grey-500);
	letter-spacing: .04em; text-transform: uppercase;
	margin-bottom: 2px;
}

/* The native select — styled to match other inputs but compact for the row. */
.mi-rt-block select {
	font-family: var(--mi-font-body); font-size: 17px;
	color: var(--ss-deep-indigo);
	background: #fff;
	border: 1.5px solid var(--mi-border);
	border-radius: var(--mi-r-input);
	padding: 12px 42px 12px 14px;
	max-width: 420px; width: 100%;
	transition: border-color .15s, box-shadow .15s;
	outline: none;
	appearance: none; -webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%238D9196' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	cursor: pointer;
}
.mi-rt-block select:focus {
	border-color: var(--ss-indigo);
	box-shadow: 0 0 0 3px var(--ss-indigo-20);
}
.mi-shell .mi-rt-link {
	display: inline-flex; align-items: center;
	background: var(--ss-indigo-20); border: 1.5px solid var(--ss-indigo-40);
	color: var(--ss-deep-indigo); font-weight: 700; font-size: 15px;
	padding: 10px 18px; border-radius: var(--mi-r-pill);
	cursor: pointer; font-family: inherit;
	transition: background .15s, border-color .15s;
}
.mi-shell .mi-rt-link:hover { background: var(--ss-indigo-40); border-color: var(--ss-indigo); }

/* ---------- Step pills ---------- */
.mi-steps { padding: 22px 40px 0; }
.mi-stepper {
	list-style: none; padding: 0; margin: 0;
	display: flex; gap: 8px; flex-wrap: wrap;
}
.mi-step {
	display: inline-flex; align-items: center; gap: 9px;
	border: 1px solid var(--mi-border);
	background: #fff;
	border-radius: var(--mi-r-pill);
	padding: 8px 16px 8px 9px;
	font-size: 16px; font-weight: 600;
	color: var(--ss-grey-500);
	transition: all .15s;
	white-space: nowrap;
	cursor: not-allowed;
}
.mi-step__num {
	width: 22px; height: 22px; border-radius: var(--mi-r-pill);
	background: var(--ss-grey-200); color: #fff;
	display: flex; align-items: center; justify-content: center;
	font-size: 14px; font-weight: 700;
	flex-shrink: 0;
}
.mi-step__title { line-height: 1; }
.mi-step--current {
	background: var(--ss-deep-indigo);
	border-color: var(--ss-deep-indigo);
	color: #fff;
	cursor: default;
}
.mi-step--current .mi-step__num {
	background: var(--ss-bright-green); color: var(--ss-deep-indigo);
}
.mi-step--done {
	color: var(--ss-deep-indigo);
	border-color: var(--ss-indigo-40);
	background: var(--ss-indigo-20);
	cursor: pointer;
}
.mi-step--done .mi-step__num { background: var(--ss-mid-green); }
.mi-step--done:hover {
	border-color: var(--ss-deep-indigo);
}
.mi-step--upcoming { opacity: .85; }

/* progress meter */
.mi-meter { padding: 0 40px; margin-top: 18px; }
.mi-meter__track {
	height: 4px; background: var(--ss-grey-200);
	border-radius: var(--mi-r-pill); overflow: hidden;
}
.mi-meter__fill {
	height: 100%; background: var(--ss-mid-green);
	border-radius: var(--mi-r-pill);
	transition: width .35s cubic-bezier(.4,0,.2,1);
}

.mi-divider { border: 0; border-top: 1px solid var(--mi-border); margin: 22px 40px 0; }

/* ---------- Section heading ---------- */
.mi-step__heading { margin: 0 0 22px; }
.mi-step__heading .mi-eyebrow {
	display: inline-flex; align-items: center; gap: 8px;
	font-size: 14px; font-weight: 700;
	letter-spacing: .08em; text-transform: uppercase;
	color: var(--ss-indigo);
}
.mi-step__heading h2 {
	font-size: 30px; font-weight: 800; letter-spacing: -.02em;
	margin: 8px 0 4px;
	font-family: var(--mi-font-body);
}
.mi-step__heading p {
	font-size: 16.5px; color: var(--ss-grey-500); margin: 0;
}

.mi-intro {
	background: var(--ss-grey-50);
	border-left: 4px solid var(--ss-indigo);
	padding: .75em 1em; margin: 0 0 1em;
	white-space: pre-wrap;
	border-radius: 8px;
	font-size: 16.5px;
	color: var(--ss-deep-indigo);
}

/* ---------- Fields ---------- */
.mi-field { margin-bottom: 22px; }
.mi-field label {
	display: flex; align-items: center; gap: 6px;
	font-size: 16.5px; font-weight: 700;
	color: var(--ss-deep-indigo);
	margin-bottom: 8px;
}
.mi-required { color: var(--mi-field-err); font-weight: 700; }
/* De-emphasized optional fields (e.g. "Why this date?") */
.mi-field--subtle { margin-bottom: 16px; }
.mi-field--subtle label { font-size: 14px; font-weight: 600; color: var(--ss-grey-500); margin-bottom: 5px; }
.mi-field--subtle input { max-width: 460px; }
.mi-help { font-size: 15px; color: var(--ss-grey-500); margin: 7px 0 9px; line-height: 1.4; }
.mi-field-link { font-size: 14.5px; color: var(--ss-grey-500); margin: 7px 0 0; }
/* .mi-shell prefix so the link colour wins over `.mi-shell button { color: inherit }`. */
.mi-shell .mi-field-link__btn {
	background: none; border: none; padding: 0; margin: 0;
	font: inherit; font-weight: 700; color: var(--ss-indigo);
	cursor: pointer; text-decoration: underline;
}
.mi-shell .mi-field-link__btn:hover { background: none; text-decoration: none; }
.mi-error {
	display: flex; align-items: center; gap: 6px;
	font-size: 14.5px; color: var(--mi-field-err);
	font-weight: 600; margin-top: 7px;
}

.mi-field input[type=text],
.mi-field input[type=number],
.mi-field input[type=date],
.mi-field input[type=datetime-local],
.mi-field input[type=url],
.mi-field input[type=email],
.mi-field select,
.mi-field textarea {
	width: 100%;
	font-family: var(--mi-font-body); font-size: 17px;
	color: var(--ss-deep-indigo);
	background: #fff;
	border: 1.5px solid var(--mi-border);
	border-radius: var(--mi-r-input);
	padding: 12px 14px;
	transition: border-color .15s, box-shadow .15s;
	outline: none;
}
.mi-field input::placeholder,
.mi-field textarea::placeholder { color: var(--ss-grey-400); }
.mi-field input:hover,
.mi-field select:hover,
.mi-field textarea:hover { border-color: var(--ss-grey-300); }
.mi-field input:focus,
.mi-field select:focus,
.mi-field textarea:focus {
	border-color: var(--ss-indigo);
	box-shadow: 0 0 0 3px var(--ss-indigo-20);
}
.mi-field textarea { min-height: 104px; resize: vertical; line-height: 1.5; }

.mi-field select {
	appearance: none; -webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%238D9196' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	padding-right: 42px;
	cursor: pointer;
}

/* checkbox + radio groups (multiselect, boolean) */
.mi-checks { display: grid; gap: 9px; }
.mi-checks > label {
	display: flex; align-items: center; gap: 11px;
	cursor: pointer; user-select: none;
	border: 1.5px solid var(--mi-border);
	background: #fff;
	border-radius: 11px;
	padding: 11px 14px;
	font-size: 16.5px; font-weight: 500;
	transition: all .15s;
	margin: 0;
	color: var(--ss-deep-indigo);
}
.mi-checks > label:hover {
	border-color: var(--ss-indigo-60);
	background: var(--ss-grey-50);
}
.mi-checks > label:has(input:checked) {
	border-color: var(--ss-deep-indigo);
	background: var(--ss-indigo-20);
}
.mi-checks input[type=checkbox],
.mi-checks input[type=radio] {
	accent-color: var(--ss-deep-indigo);
	width: 18px; height: 18px; flex-shrink: 0;
}

/* user_picker chips */
.mi-userpicker__chips {
	display: flex; flex-wrap: wrap; gap: 7px;
	margin-bottom: 6px;
}
.mi-userpicker .mi-chip {
	display: inline-flex; align-items: center; gap: 7px;
	background: var(--ss-indigo-20);
	color: var(--ss-deep-indigo);
	border-radius: var(--mi-r-pill);
	padding: 5px 10px 5px 5px;
	font-size: 15.5px; font-weight: 600;
}
.mi-userpicker .mi-chip__av {
	width: 22px; height: 22px;
	border-radius: var(--mi-r-pill);
	background: var(--ss-deep-indigo); color: #fff;
	display: inline-flex; align-items: center; justify-content: center;
	font-size: 12.5px; font-weight: 700;
}
.mi-userpicker .mi-chip__x {
	background: transparent; border: 0; padding: 0; cursor: pointer;
	color: var(--ss-grey-500); font-size: 18.5px; line-height: 1;
}
.mi-userpicker .mi-chip__x:hover { color: var(--ss-deep-indigo); }
.mi-userpicker__list {
	list-style: none; padding: 0; margin: 6px 0 0;
	border: 1px solid var(--mi-border);
	border-radius: 12px;
	max-height: 220px; overflow: auto;
	background: #fff;
	box-shadow: var(--mi-shadow-sm);
}
.mi-userpicker__list li {
	padding: 10px 14px; cursor: pointer;
	border-bottom: 1px solid var(--ss-grey-100);
	font-size: 16px;
}
.mi-userpicker__list li:last-child { border-bottom: 0; }
.mi-userpicker__list li:hover { background: var(--ss-indigo-20); }

/* file uploader */
.mi-field input[type=file] {
	font-family: var(--mi-font-body); font-size: 16px;
	padding: 10px;
	border: 1.6px dashed var(--ss-grey-300);
	background: var(--ss-grey-50);
	border-radius: 14px;
	width: 100%;
}
.mi-field input[type=file]:hover {
	border-color: var(--ss-indigo);
	background: var(--ss-indigo-20);
}

.mi-stub {
	font-style: italic; color: var(--ss-grey-500);
	padding: .5em .65em; background: var(--ss-grey-50);
	border-radius: 8px;
	border: 1px dashed var(--mi-border);
}

/* ---------- Info / examples panel ---------- */
.mi-shell .mi-info {
	background: var(--ss-indigo-20);
	border-left: 3px solid var(--ss-indigo);
	border-radius: 10px;
	padding: 12px 16px;
	font-size: 15px; line-height: 1.45;
	color: var(--ss-deep-indigo);
}
.mi-shell .mi-info--tip {
	background: var(--ss-marigold-10);
	border-left-color: var(--ss-marigold);
	color: #5a4400;
}
.mi-shell .mi-info__p { margin: 0 0 6px; font-weight: 600; }
.mi-shell .mi-info__list { margin: 4px 0 0; padding-left: 22px; }
.mi-shell .mi-info__list li { margin: 2px 0; }
.mi-shell .mi-info__links { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 8px; }
.mi-shell .mi-info__link {
	display: inline-flex; align-items: center; gap: 5px;
	background: var(--ss-indigo); color: #fff;
	padding: 6px 14px; border-radius: var(--mi-r-pill);
	font-size: 14px; font-weight: 700; text-decoration: none;
	transition: background 0.15s;
}
.mi-shell .mi-info__link:hover { background: var(--ss-deep-indigo); color: #fff; }
.mi-shell .mi-info--tip .mi-info__link { background: #5a4400; color: #fff; }
.mi-shell .mi-info--tip .mi-info__link:hover { background: #3a2c00; }

/* ---------- Multi-select (ClickUp-style chips + dropdown) ---------- */
.mi-shell .mi-ms { position: relative; }
.mi-shell .mi-ms__control {
	display: flex; align-items: center; gap: 8px;
	min-height: 46px; padding: 7px 12px;
	border: 1.5px solid var(--mi-border); border-radius: var(--mi-r-input);
	background: #fff; cursor: pointer;
}
.mi-shell .mi-ms.is-open .mi-ms__control,
.mi-shell .mi-ms__control:focus { border-color: var(--ss-indigo); outline: none; }
.mi-shell .mi-ms__chips { display: flex; flex-wrap: wrap; gap: 6px; flex: 1; }
.mi-shell .mi-ms__chip {
	display: inline-flex; align-items: center; gap: 4px;
	background: var(--ss-indigo-20); color: var(--ss-deep-indigo);
	border-radius: var(--mi-r-pill); padding: 3px 6px 3px 12px;
	font-size: 14px; font-weight: 600;
}
.mi-shell .mi-ms__x {
	border: 0; background: transparent; cursor: pointer;
	font-size: 16px; line-height: 1; color: var(--ss-indigo); padding: 0 2px;
}
.mi-shell .mi-ms__x:hover { color: var(--ss-deep-indigo); }
.mi-shell .mi-ms__ph { flex: 1; color: var(--ss-grey-500); font-size: 15px; }
.mi-shell .mi-ms__caret { color: var(--ss-grey-500); font-size: 12px; flex: 0 0 auto; }
.mi-shell .mi-ms__menu {
	position: absolute; z-index: 30; left: 0; right: 0; margin: 6px 0 0;
	max-height: 280px; overflow: auto; list-style: none; padding: 6px;
	background: #fff; border: 1px solid var(--mi-border); border-radius: 12px;
	box-shadow: var(--mi-shadow-md);
}
.mi-shell .mi-ms__opt {
	display: flex; align-items: center; gap: 10px;
	padding: 9px 10px; border-radius: 8px; cursor: pointer; font-size: 15px;
}
.mi-shell .mi-ms__opt:hover { background: var(--ss-indigo-20); }
.mi-shell .mi-ms__opt.is-on { font-weight: 600; }
.mi-shell .mi-ms__head {
	padding: 10px 10px 4px; margin-top: 4px;
	font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
	color: var(--ss-grey-500, #8a8a9a); cursor: default; pointer-events: none;
}
.mi-shell .mi-ms__head:first-child { margin-top: 0; }
.mi-shell .mi-ms__box {
	width: 18px; height: 18px; flex: 0 0 auto;
	border: 1.5px solid var(--ss-grey-300); border-radius: 5px;
	display: inline-flex; align-items: center; justify-content: center;
	font-size: 12px; color: #fff;
}
.mi-shell .mi-ms__opt.is-on .mi-ms__box { background: var(--ss-indigo); border-color: var(--ss-indigo); }
.mi-shell .mi-ms__single { flex: 1; font-size: 15px; font-weight: 600; color: var(--ss-deep-indigo); }
.mi-shell .mi-ms__box--radio { border-radius: 50%; }

/* ---------- Brief extractor (paste -> AI suggests teams) ---------- */
.mi-brief-extract textarea { width: 100%; }
.mi-shell .mi-brief-extract__btn { margin-top: 8px; height: auto; padding: 8px 16px; font-size: 15px; }
.mi-brief-extract__msg { margin-top: 7px; }

/* ---------- Campaign search ---------- */
.mi-campaign .mi-userpicker__list { margin-top: .4em; }
.mi-campaign--picked .mi-chip { font-weight: 600; }
.mi-campaign__link {
	margin-left: .6em; font-weight: 500; font-size: .9em;
	color: var(--ss-deep-indigo); text-decoration: underline;
}
.mi-campaign__nomatch { margin-top: .45em; }

/* ---------- Review step ---------- */
.mi-review__intro { color: var(--ss-grey-500); margin-top: 0; font-size: 16.5px; }
.mi-review__note {
	margin: 0 0 18px;
	padding: 12px 16px;
	border-radius: 12px;
	background: var(--ss-grey-50);
	border: 1px solid var(--mi-border);
	border-left: 4px solid #BEB9FF;
	color: var(--ss-grey-700, #3a3a4a);
	font-size: 15px;
	line-height: 1.5;
}
.mi-review__section {
	border: 1px solid var(--mi-border);
	border-radius: 16px;
	overflow: hidden;
	margin: 0 0 16px;
	background: #fff;
	padding: 0;
}
.mi-review__sectionhead {
	display: flex; align-items: center; gap: 10px;
	padding: 14px 18px;
	background: var(--ss-grey-50);
	border-bottom: 1px solid var(--mi-border);
}
.mi-review__sectionhead h3 {
	font-size: 18.5px; font-weight: 700; flex: 1; margin: 0;
}
.mi-shell .mi-review__sectionhead .mi-link {
	display: inline-flex; align-items: center;
	background: var(--ss-indigo-20); border: 1.5px solid var(--ss-indigo-40);
	color: var(--ss-deep-indigo); font-weight: 700; font-size: 15px;
	padding: 9px 16px; border-radius: var(--mi-r-pill);
	cursor: pointer; font-family: inherit;
	transition: background .15s, border-color .15s;
}
.mi-shell .mi-review__sectionhead .mi-link:hover { background: var(--ss-indigo-40); border-color: var(--ss-indigo); text-decoration: none; }

.mi-review__group {
	display: grid;
	grid-template-columns: 220px 1fr;
	gap: 0;
	margin: 0;
}
.mi-review__group dt,
.mi-review__group dd {
	padding: 12px 18px;
	font-size: 16px;
	border-bottom: 1px solid var(--ss-grey-100);
	margin: 0;
}
.mi-review__group dt {
	color: var(--ss-grey-500); font-weight: 600;
}
.mi-review__group dd { color: var(--ss-deep-indigo); white-space: pre-wrap; }
.mi-review__group dt:nth-last-of-type(1),
.mi-review__group dd:nth-last-of-type(1) { border-bottom: 0; }
.mi-empty { color: var(--ss-grey-400); font-style: italic; }

/* Cross-functional spawn preview — surfaces what subtasks the server will create */
.mi-spawn {
	border-color: var(--ss-indigo-40) !important;
}
.mi-spawn .mi-review__sectionhead {
	background: var(--ss-indigo-20);
	border-bottom-color: var(--ss-indigo-40);
}
.mi-spawn .mi-review__sectionhead h3 { color: var(--ss-deep-indigo); }
.mi-spawn__count {
	font-size: 14.5px; font-weight: 600;
	color: var(--ss-indigo);
	padding: 4px 10px;
	background: #fff;
	border: 1px solid var(--ss-indigo-40);
	border-radius: var(--mi-r-pill);
}
.mi-rename__body { padding: 16px 18px 18px; }
.mi-rename__input {
	width: 100%;
	box-sizing: border-box;
	font-size: 16px;
	padding: 10px 12px;
	border: 1px solid var(--mi-border);
	border-radius: 10px;
}
.mi-rename__input:focus {
	outline: none;
	border-color: var(--ss-indigo);
	box-shadow: 0 0 0 3px var(--ss-indigo-20);
}
.mi-rename__hint {
	font-size: 14px; color: var(--ss-grey-700);
	margin: 8px 0 0;
}

.mi-spawn__body { padding: 16px 18px 18px; }
.mi-spawn__hint {
	font-size: 15.5px; color: var(--ss-grey-700);
	margin: 0 0 12px;
}
.mi-spawn__list {
	list-style: none; margin: 0; padding: 0;
	display: grid; gap: 8px;
}
.mi-spawn__item {
	display: flex; align-items: center; gap: 12px;
	background: #fff;
	border: 1px solid var(--mi-border);
	border-radius: 10px;
	padding: 10px 14px;
}
.mi-spawn__team {
	display: inline-block;
	font-size: 12.5px; font-weight: 700;
	letter-spacing: .04em; text-transform: uppercase;
	color: var(--ss-bright-green);
	background: var(--ss-deep-indigo);
	padding: 4px 9px;
	border-radius: 6px;
	flex-shrink: 0;
}
.mi-spawn__name {
	font-size: 16px; color: var(--ss-deep-indigo); font-weight: 500;
}
.mi-spawn__optional {
	margin-top: 14px;
	padding-top: 12px;
	border-top: 1px dashed var(--mi-border);
}
.mi-spawn__optional-label {
	font-size: 12.5px; font-weight: 700;
	letter-spacing: .06em; text-transform: uppercase;
	color: var(--ss-grey-500); margin-bottom: 8px;
}
.mi-spawn__optional .mi-spawn__team {
	background: var(--ss-marigold-25); color: #6b5200;
}

/* ---------- Actions footer ---------- */
.mi-actions {
	display: flex; align-items: center; gap: 16px;
	padding: 22px 40px 30px;
	border-top: 1px solid var(--mi-border);
	margin-top: 8px;
}
.mi-actions__spacer { flex: 1; }
.mi-saved {
	font-size: 15px; color: var(--ss-grey-500);
	display: flex; align-items: center; gap: 7px; margin: 0;
}
.mi-saved::before {
	content: '';
	width: 7px; height: 7px; border-radius: var(--mi-r-pill);
	background: var(--ss-mid-green);
	display: inline-block;
}

.mi-actions button,
.mi-form button[type=submit] {
	display: inline-flex; align-items: center; justify-content: center;
	gap: 8px; height: 46px; padding: 0 22px;
	border-radius: var(--mi-r-pill);
	font-family: var(--mi-font-body); font-weight: 700; font-size: 18px;
	border: 0; cursor: pointer;
	transition: filter .15s, transform .1s, background .15s, border-color .15s;
	white-space: nowrap;
	background: var(--mi-accent); color: var(--mi-accent-ink);
}
.mi-actions button:hover { filter: brightness(1.05); }
.mi-actions button:active { transform: scale(.98); }
.mi-actions button:disabled { opacity: .45; cursor: not-allowed; }
.mi-actions button.mi-secondary {
	background: var(--ss-indigo-20);
	color: var(--ss-deep-indigo);
	border: 1.5px solid var(--ss-indigo-40);
}
.mi-actions button.mi-secondary:hover {
	background: var(--ss-indigo-40);
	border-color: var(--ss-indigo);
	color: var(--ss-deep-indigo);
	filter: none;
}

/* ---------- Failure / success ---------- */
.mi-failure {
	margin: 0 40px 16px;
	padding: 14px 16px;
	background: #FEF3F2; border: 1px solid #FECDCA;
	border-left: 4px solid var(--mi-field-err);
	border-radius: 12px;
	color: var(--mi-field-err); font-weight: 600; font-size: 16px;
}
.mi-success {
	text-align: center;
	padding: 38px 40px 6px;
}
.mi-success__ring {
	width: 72px; height: 72px;
	border-radius: var(--mi-r-pill);
	background: var(--ss-bright-green-20);
	color: var(--ss-mid-green);
	display: flex; align-items: center; justify-content: center;
	margin: 0 auto 14px;
	font-size: 39px;
	animation: mi-pop .4s cubic-bezier(.2,.8,.2,1.2);
}
@keyframes mi-pop {
	from { transform: scale(.6); opacity: 0; }
	to { transform: scale(1); opacity: 1; }
}
.mi-success > strong {
	font-size: 32px; font-weight: 800; letter-spacing: -.02em;
	display: block;
}
.mi-success p { font-size: 18px; color: var(--ss-grey-500); margin: 8px auto 0; max-width: 52ch; line-height: 1.5; }
.mi-success p strong { color: var(--ss-deep-indigo); font-weight: 700; }
.mi-success a {
	color: var(--ss-indigo); font-weight: 600; text-decoration: none;
}
.mi-success a:hover { text-decoration: underline; }
.mi-success__ring.is-pending { background: var(--ss-marigold-10); color: var(--ss-marigold); }

/* Prominent warning alert at the top of the success card */
.mi-alert {
	display: flex; gap: 12px; align-items: flex-start;
	margin: 24px 40px 0;
	padding: 14px 16px;
	background: #FDECEC;
	border: 1px solid #F3B5B1; border-left: 4px solid #D92D20;
	border-radius: 12px;
	color: #7A1C16; text-align: left;
}
.mi-alert__icon {
	flex: none; width: 22px; height: 22px; margin-top: 1px;
	border-radius: var(--mi-r-pill);
	background: #D92D20; color: #fff;
	font-weight: 800; font-size: 16px; line-height: 1;
	display: flex; align-items: center; justify-content: center;
}
.mi-alert__body { font-size: 16px; line-height: 1.45; }
.mi-alert__body strong { display: block; font-size: 16.5px; margin-bottom: 2px; color: #7A1C16; }
.mi-alert__body p { margin: 0; }
.mi-alert__body ul { margin: 4px 0 0; padding-left: 18px; }
.mi-alert__body li { margin: 2px 0; }

/* Ticket links — left-aligned, compact, ClickUp-marked */
.mi-tickets {
	text-align: left;
	max-width: 560px;
	margin: 18px auto 0;
	display: flex; flex-direction: column; gap: 7px;
}
.mi-tickets__list { display: flex; flex-direction: column; gap: 6px; }
.mi-tickets__row { display: flex; align-items: center; gap: 9px; font-size: 15.5px; color: var(--ss-deep-indigo); }
.mi-tickets__k {
	flex: none; min-width: 92px;
	font-size: 12.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
	color: var(--ss-grey-500);
}
.mi-tickets__team {
	flex: none; min-width: 130px;
	font-size: 12.5px; font-weight: 700; color: var(--ss-grey-500);
}
.mi-ticket {
	display: inline-flex; align-items: center; gap: 6px;
	color: var(--ss-indigo); font-weight: 600; font-size: 15.5px;
}
.mi-cu-icon {
	flex: none; display: inline-block; width: 16px; height: 16px;
	background-repeat: no-repeat; background-position: center; background-size: contain;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect width='24' height='24' rx='6' fill='%237B68EE'/%3E%3Cpath d='M6 12.8l4 3 8-8.6' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.mi-note {
	max-width: 560px; margin: 16px auto 0; text-align: left;
	padding: 10px 14px; font-size: 15px;
	background: var(--ss-marigold-10); border: 1px solid var(--ss-marigold-25);
	border-radius: 12px; color: #6b5200;
}
.mi-note p { margin: .2em 0; }

/* external-link glyph (immune to the .mi-shell reset via background-image) */
.mi-ext-icon {
	flex: none; display: inline-block; width: 13px; height: 13px; margin-left: 5px;
	vertical-align: -1px;
	background-repeat: no-repeat; background-position: center; background-size: contain;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235C50FF' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6'/%3E%3Cpath d='M10 14 21 3'/%3E%3Cpath d='M21 14v7H3V3h7'/%3E%3C/svg%3E");
}
.mi-ext-icon--light {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6'/%3E%3Cpath d='M10 14 21 3'/%3E%3Cpath d='M21 14v7H3V3h7'/%3E%3C/svg%3E");
	margin-left: 0; margin-right: 7px;
}

/* Metadata chip card (Request ID / Priority / Target date) */
.mi-meta {
	display: inline-flex; margin: 16px auto 0;
	border: 1px solid var(--mi-border); border-radius: 14px;
	overflow: hidden; background: #fff; text-align: left;
}
.mi-meta__cell { padding: 12px 22px; display: flex; flex-direction: column; gap: 5px; }
.mi-meta__cell + .mi-meta__cell { border-left: 1px solid var(--mi-border); }
.mi-meta__k { font-size: 12px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--ss-grey-500); }
.mi-meta__id { font-size: 17px; font-weight: 700; color: var(--ss-indigo); font-family: var(--mi-font-mono); }
.mi-meta__strong { font-size: 17px; font-weight: 700; color: var(--ss-deep-indigo); }
.mi-meta__pill {
	align-self: flex-start; font-size: 15px; font-weight: 600; color: var(--ss-deep-indigo);
	background: var(--ss-grey-100); border-radius: var(--mi-r-pill); padding: 2px 12px;
}

/* Task card */
.mi-taskcard {
	margin: 18px 40px 0; text-align: left;
	border: 1px solid var(--mi-border); border-radius: var(--mi-r-card);
	overflow: hidden;
}
.mi-taskcard__head {
	display: flex; align-items: center; justify-content: space-between;
	padding: 16px 20px;
}
.mi-taskcard__title { font-size: 17px; color: var(--ss-deep-indigo); }
.mi-taskcard__title strong { font-weight: 800; }
.mi-tc-icon {
	flex: none; display: inline-block; width: 18px; height: 18px; margin-right: 9px;
	vertical-align: -4px;
	background-repeat: no-repeat; background-position: center; background-size: contain;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235C50FF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 17 2 2 4-4'/%3E%3Cpath d='m3 7 2 2 4-4'/%3E%3Cpath d='M13 6h8'/%3E%3Cpath d='M13 12h8'/%3E%3Cpath d='M13 18h8'/%3E%3C/svg%3E");
}
.mi-shell .mi-taskcard__all { display: inline-flex; align-items: center; color: var(--ss-indigo); font-weight: 600; font-size: 15.5px; }
.mi-taskcard__list {
	display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
	padding: 0 20px 14px; font-size: 15px;
}
.mi-taskcard__listk { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ss-grey-500); margin-right: 2px; }
.mi-lchip { background: var(--ss-grey-100); border-radius: 8px; padding: 3px 10px; font-weight: 600; color: var(--ss-deep-indigo); }
.mi-crumb { color: var(--ss-grey-400); }
.mi-taskcard__rows { border-top: 1px solid var(--mi-border); }
.mi-taskrow {
	display: flex; align-items: center; gap: 12px;
	padding: 13px 20px; border-bottom: 1px solid var(--ss-grey-100);
}
.mi-taskrow:last-child { border-bottom: none; }
.mi-taskrow__dot { flex: none; width: 9px; height: 9px; border-radius: var(--mi-r-pill); }
.mi-taskrow__main { flex: 1; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.mi-taskrow__team { font-size: 16px; font-weight: 700; color: var(--ss-deep-indigo); }
.mi-taskrow__sub { font-size: 14.5px; color: var(--ss-grey-500); }
.mi-taskrow__right { display: flex; align-items: center; gap: 14px; }
.mi-taskrow__id { font-size: 14px; color: var(--ss-grey-400); font-family: var(--mi-font-mono); }
.mi-shell .mi-tc-open {
	display: inline-flex; align-items: center; font-size: 15px; font-weight: 600;
	color: var(--ss-indigo);
	border: 1.5px solid var(--ss-indigo-40); border-radius: var(--mi-r-pill);
	padding: 5px 14px;
}
.mi-shell .mi-tc-open:hover { background: var(--ss-indigo-20); }

/* Success footer actions */
.mi-foot {
	display: flex; justify-content: flex-end; gap: 12px;
	margin: 16px 40px 32px;
}
.mi-shell .mi-btn {
	display: inline-flex; align-items: center; gap: 4px;
	font-size: 17px; font-weight: 700; border: none; cursor: pointer;
	padding: 12px 22px; border-radius: var(--mi-r-pill);
	text-decoration: none;
}
.mi-shell .mi-btn--dark { background: var(--ss-deep-indigo); color: #fff; }
.mi-shell .mi-btn--dark:hover { background: #2a0e6e; color: #fff; }
.mi-shell .mi-btn--go { background: var(--mi-accent); color: var(--ss-deep-indigo); }
.mi-shell .mi-btn--go:hover { background: var(--ss-mid-green); }

@media (max-width: 600px) {
	.mi-meta { display: flex; flex-direction: column; }
	.mi-meta__cell + .mi-meta__cell { border-left: none; border-top: 1px solid var(--mi-border); }
	.mi-foot { flex-direction: column-reverse; }
	.mi-btn { justify-content: center; }
}

/* fade entrance for step body */
.mi-step__body { animation: mi-fadeUp .28s ease-out; }
@keyframes mi-fadeUp {
	from { opacity: 0; transform: translateY(8px); }
	to { opacity: 1; transform: none; }
}

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
	.mi-shell { padding: 0 0 32px; }
	.mi-hero { padding: 40px 22px 64px; }
	.mi-card { margin: -36px 12px 0; border-radius: 16px; max-width: none; }
	.mi-hero h1 { font-size: 37px; }
	.mi-body { padding: 24px 22px 28px; }
	.mi-rt-block, .mi-steps, .mi-meter, .mi-actions { padding-left: 22px; padding-right: 22px; }
	.mi-divider { margin-left: 22px; margin-right: 22px; }
	.mi-failure { margin-left: 22px; margin-right: 22px; }
	.mi-resume__inner { padding-left: 22px; padding-right: 22px; }
	.mi-review__group { grid-template-columns: 1fr; }
	.mi-review__group dt { padding-bottom: 0; border-bottom: 0; }
	.mi-review__group dd { padding-top: 4px; }
	.mi-stepper { font-size: 15px; }
	.mi-rt-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
	.mi-rt-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   Intake assistant (chatbot). Mounted outside .mi-shell, so it
   carries its own colors/typography rather than the shell tokens.
   ============================================================ */
#marketing-intake-assistant-root {
	font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
.mi-assistant__launcher {
	position: fixed; right: 20px; bottom: 20px; z-index: 99999;
	display: inline-flex; align-items: center; gap: 8px;
	background: #5C50FF; color: #fff;
	border: none; border-radius: 999px;
	padding: 11px 16px; font-size: 16px; font-weight: 600;
	cursor: pointer; box-shadow: 0 6px 20px rgba(17,0,58,.22);
	font-family: inherit;
}
.mi-assistant__launcher:hover { background: #4a3ff0; }
.mi-assistant__panel {
	position: fixed; right: 20px; bottom: 20px; z-index: 99999;
	width: 360px; max-width: calc(100vw - 32px);
	height: 540px; max-height: calc(100vh - 40px);
	display: flex; flex-direction: column;
	background: #fff; border-radius: 16px; overflow: hidden;
	box-shadow: 0 12px 40px rgba(17,0,58,.28);
	border: 1px solid #E4E5E7;
}
.mi-assistant__head {
	display: flex; align-items: center; justify-content: space-between;
	background: #11003A; color: #fff; padding: 14px 16px;
}
.mi-assistant__title { font-size: 17px; font-weight: 700; }
.mi-assistant__close {
	background: none; border: none; color: #fff;
	font-size: 25.5px; line-height: 1; cursor: pointer; padding: 0 4px;
}
.mi-assistant__log {
	flex: 1; overflow-y: auto; padding: 16px;
	display: flex; flex-direction: column; gap: 10px;
	background: #F9F9F9;
}
.mi-assistant__msg {
	max-width: 85%; padding: 9px 12px; border-radius: 14px;
	font-size: 16px; line-height: 1.45; white-space: pre-wrap; word-wrap: break-word;
}
.mi-assistant__msg--bot {
	align-self: flex-start; background: #fff; color: #11003A;
	border: 1px solid #E4E5E7; border-bottom-left-radius: 4px;
}
.mi-assistant__msg--user {
	align-self: flex-end; background: #5C50FF; color: #fff;
	border-bottom-right-radius: 4px;
}
.mi-assistant__typing { color: #8D9196; font-weight: 700; letter-spacing: 2px; }
.mi-assistant__start {
	align-self: flex-start; margin-top: 2px;
	background: var(--mi-accent); color: var(--ss-deep-indigo);
	border: none; border-radius: 999px;
	padding: 9px 16px; font-size: 16px; font-weight: 700;
	cursor: pointer; font-family: inherit;
}
.mi-assistant__start:hover { background: #00cf5a; }
.mi-assistant__form {
	display: flex; gap: 8px; padding: 12px; border-top: 1px solid #E4E5E7; background: #fff;
}
.mi-assistant__input {
	flex: 1; border: 1.5px solid #E4E5E7; border-radius: 10px;
	padding: 9px 12px; font-size: 16px; font-family: inherit; color: #11003A;
}
.mi-assistant__input:focus { outline: none; border-color: #5C50FF; box-shadow: 0 0 0 3px #EEEDFF; }
.mi-assistant__send {
	background: #5C50FF; color: #fff; border: none; border-radius: 10px;
	padding: 9px 16px; font-size: 16px; font-weight: 600; cursor: pointer; font-family: inherit;
}
.mi-assistant__send:disabled { opacity: .5; cursor: default; }
@media (max-width: 520px) {
	.mi-assistant__panel { width: auto; left: 16px; right: 16px; }
}