/**
 * ListingPilot public generator.
 *
 * Inherits the host theme's design tokens (--ink, --hairline, --paper, --slate,
 * --rosewood, --sp-*, and the Fraunces / IBM Plex Mono / Instrument Sans stack)
 * when present, with sensible fallbacks so it still looks clean on any theme.
 */
.lp-pub {
	--_ink: var(--ink, #17181c);
	--_paper: var(--paper, #fefdfb);
	--_fog: var(--fog, #f7f3ee);
	--_slate: var(--slate, #6e6a63);
	--_hair: var(--hairline, #e9e2d8);
	--_accent: var(--rosewood, #a8574e);
	--_sans: 'Instrument Sans', -apple-system, BlinkMacSystemFont, sans-serif;
	--_serif: 'Fraunces', Georgia, serif;
	--_mono: 'IBM Plex Mono', ui-monospace, monospace;

	font-family: var(--_sans);
	color: var(--_ink);
	max-width: 720px;
}

.lp-pub * { box-sizing: border-box; }

.lp-pub-intro { margin-bottom: var(--sp-5, 24px); }
.lp-pub-title {
	font-family: var(--_serif);
	font-weight: 400;
	font-size: clamp(22px, 2.6vw, 28px);
	line-height: 1.12;
	margin: 0 0 8px;
	letter-spacing: -0.01em;
}
.lp-pub-sub { color: var(--_slate); font-size: 15px; line-height: 1.6; margin: 0; }
.lp-pub-muted { color: var(--_slate); font-size: 14px; }

/* Form -------------------------------------------------------------------- */
.lp-pub-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--sp-4, 16px);
}
.lp-pub-field { display: flex; flex-direction: column; gap: 6px; }
.lp-pub-field-full { grid-column: 1 / -1; }
.lp-pub-field > span {
	font-family: var(--_mono);
	font-size: 11px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--_slate);
}
.lp-pub-field input,
.lp-pub-field select,
.lp-pub-field textarea {
	font-family: var(--_sans);
	font-size: 15px;
	color: var(--_ink);
	background: var(--_paper);
	border: 1px solid var(--_hair);
	border-radius: 10px;
	padding: 11px 14px;
	width: 100%;
	transition: border-color 180ms cubic-bezier(.16,1,.3,1);
}
.lp-pub-field textarea { resize: vertical; min-height: 58px; line-height: 1.55; }
.lp-pub-field input:focus,
.lp-pub-field select:focus,
.lp-pub-field textarea:focus {
	outline: none;
	border-color: var(--_accent);
}

/* Honeypot: visually and semantically hidden, still in the DOM for bots. */
.lp-pub-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px; height: 1px; overflow: hidden;
}

.lp-pub-actions {
	display: flex;
	align-items: center;
	gap: var(--sp-4, 16px);
	margin-top: var(--sp-5, 24px);
	flex-wrap: wrap;
}
.lp-pub-btn {
	font-family: var(--_sans);
	font-size: 14px;
	font-weight: 500;
	background: var(--_ink);
	color: var(--_paper);
	border: 1px solid var(--_ink);
	border-radius: 100px;
	padding: 12px 26px;
	cursor: pointer;
	transition: transform 180ms cubic-bezier(.16,1,.3,1), box-shadow 180ms cubic-bezier(.16,1,.3,1);
}
.lp-pub-btn:hover:not(:disabled) {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px -10px rgba(168, 87, 78, 0.45);
}
.lp-pub-btn:disabled { opacity: 0.55; cursor: default; }
.lp-pub-note { font-family: var(--_mono); font-size: 11px; color: var(--_slate); letter-spacing: 0.02em; }

/* Result ------------------------------------------------------------------ */
.lp-pub-result { margin-top: var(--sp-7, 48px); }

.lp-pub-scores {
	display: flex;
	gap: var(--sp-3, 12px);
	flex-wrap: wrap;
	margin-bottom: var(--sp-5, 24px);
}
.lp-pub-score {
	flex: 1;
	min-width: 92px;
	border: 1px solid var(--_hair);
	border-radius: 12px;
	padding: 14px 16px;
	background: var(--_fog);
}
.lp-pub-score b { display: block; font-family: var(--_serif); font-size: 24px; font-weight: 400; }
.lp-pub-score span { font-family: var(--_mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--_slate); }

.lp-pub-group { margin-bottom: var(--sp-6, 32px); }
.lp-pub-group-title {
	font-family: var(--_mono);
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--_accent);
	margin: 0 0 var(--sp-3, 12px);
}
.lp-pub-item {
	border: 1px solid var(--_hair);
	border-radius: 12px;
	padding: 14px 16px;
	margin-bottom: var(--sp-3, 12px);
}
.lp-pub-item-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 8px;
}
.lp-pub-item-label { font-family: var(--_mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.03em; color: var(--_slate); }
.lp-pub-item-body { font-size: 15px; line-height: 1.65; white-space: pre-wrap; word-break: break-word; }
.lp-pub-item-body ul { margin: 4px 0 0; padding-left: 18px; }
.lp-pub-item-body li { margin-bottom: 4px; }
.lp-pub-item-body pre {
	background: var(--_fog); border: 1px solid var(--_hair); border-radius: 8px;
	padding: 10px; overflow-x: auto; font-family: var(--_mono); font-size: 12px; margin: 0;
}
.lp-pub-copy {
	font-family: var(--_mono);
	font-size: 10px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	background: transparent;
	border: 1px solid var(--_hair);
	color: var(--_slate);
	border-radius: 100px;
	padding: 5px 12px;
	cursor: pointer;
	transition: border-color 180ms, color 180ms;
	white-space: nowrap;
}
.lp-pub-copy:hover { border-color: var(--_accent); color: var(--_accent); }

.lp-pub-toolbar { display: flex; justify-content: flex-end; margin-bottom: var(--sp-4, 16px); }

/* Loading + error --------------------------------------------------------- */
.lp-pub-loading {
	display: flex; align-items: center; gap: 12px;
	color: var(--_slate); font-size: 14px; padding: var(--sp-5, 24px) 0;
}
.lp-pub-spinner {
	width: 18px; height: 18px; border-radius: 50%;
	border: 2px solid var(--_hair); border-top-color: var(--_accent);
	animation: lp-pub-spin 0.7s linear infinite;
}
@keyframes lp-pub-spin { to { transform: rotate(360deg); } }

.lp-pub-error {
	border: 1px solid var(--_accent);
	background: rgba(168, 87, 78, 0.06);
	border-radius: 12px;
	padding: 14px 16px;
	font-size: 14px;
	color: var(--_ink);
}

@media (max-width: 560px) {
	.lp-pub-grid { grid-template-columns: 1fr; }
}