/* ==========================================================
   LinkNest Pro v3 — SEO professional directory, public profile
   and dashboard refresh. Loaded after publishers.css on those
   three screens only (see inc/enqueue.php). Presentation only:
   no data, tables or saved settings are touched by this file.
   ========================================================== */

body.ln3-pro {
	--accent: #60A5FA;
	--glow: #93C5FD;
	--accent2: #93C5FD;
	--border: rgba(96, 165, 250, .18);

	--ln3-bg: #050C1A;
	--ln3-panel: #0D2137;
	--ln3-panel-2: #0B1B30;
	--ln3-raise: #11294A;
	--ln3-line: rgba(148, 163, 184, .14);
	--ln3-line-strong: rgba(96, 165, 250, .3);
	--ln3-text: #E2E8F0;
	--ln3-soft: #CBD5E1;
	--ln3-muted: #94A3B8;
	--ln3-blue: #60A5FA;
	--ln3-blue-hi: #93C5FD;
	--ln3-blue-soft: rgba(96, 165, 250, .12);
	--ln3-ink: #0A1628;
	--ln3-r: 18px;
}

/* Site header / mobile menu keep the original brand blue. */
body.ln3-pro #site-header,
body.ln3-pro .mobile-menu {
	--accent: #2563EB;
	--glow: #3B82F6;
	--accent2: #60A5FA;
	--border: rgba(37, 99, 235, .18);
}

/* Light-blue buttons need dark text for contrast. */
body.ln3-pro .ln-btn-primary,
body.ln3-pro .ln-btn-primary-sm,
body.ln3-pro .ln-btn-primary:hover,
body.ln3-pro .ln-btn-primary-sm:hover { color: var(--ln3-ink); }
body.ln3-pro .ln-btn-outline-sm:hover { background: var(--ln3-blue-soft); }
body.ln3-pro .ln-tag { background: var(--ln3-blue-soft); }

/* ---------------- Shared building blocks ---------------- */

.ln3-wrap { width: min(1160px, 92%); margin: 0 auto; }

.ln3-kicker {
	margin: 0 0 .6rem;
	font: 700 .72rem/1.3 'Space Grotesk', sans-serif;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ln3-blue-hi);
}

.ln3-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .55rem;
	min-height: 48px;
	padding: .75rem 1.2rem;
	border: 1px solid transparent;
	border-radius: 12px;
	font: 600 .95rem/1.1 'Space Grotesk', sans-serif;
	text-decoration: none;
	cursor: pointer;
	transition: background .2s, border-color .2s, transform .2s, color .2s;
}
.ln3-btn svg { width: 18px; height: 18px; flex: none; }
.ln3-btn:hover { transform: translateY(-1px); }
.ln3-btn-primary { background: var(--ln3-blue); color: var(--ln3-ink); }
.ln3-btn-primary:hover { background: var(--ln3-blue-hi); color: var(--ln3-ink); }
.ln3-btn-ghost { background: rgba(255, 255, 255, .02); border-color: var(--ln3-line-strong); color: var(--ln3-text); }
.ln3-btn-ghost:hover { background: var(--ln3-blue-soft); color: #fff; }
.ln3-btn-sm { min-height: 42px; padding: .5rem .95rem; font-size: .86rem; border-radius: 10px; }
.ln3-btn[aria-disabled="true"] { opacity: .45; pointer-events: none; }

.ln3-card {
	background: var(--ln3-panel);
	border: 1px solid var(--ln3-line);
	border-radius: 22px;
	padding: 1.5rem;
}

/* ---------------- Public profile: hero ---------------- */

.ln3-hero {
	position: relative;
	padding: calc(72px + 3rem) 0 2.5rem;
	color: var(--ln3-text);
	background:
		radial-gradient(900px 420px at 85% -10%, rgba(96, 165, 250, .16), transparent 60%),
		var(--ln3-bg);
	border-bottom: 1px solid var(--ln3-line);
}
.ln3-hero-cover {
	display: block;
	width: 100%;
	height: 200px;
	margin-bottom: -60px;
	object-fit: cover;
	border: 1px solid var(--ln3-line);
	border-radius: var(--ln3-r);
}
.ln3-hero-grid {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) minmax(250px, 300px);
	gap: 2rem;
	align-items: start;
}
.ln3-hero-grid.has-cover .ln3-avatar { position: relative; margin-left: 1.5rem; }
.ln3-hero-grid.has-cover .ln3-hero-copy,
.ln3-hero-grid.has-cover .ln3-cta { padding-top: 76px; }
.ln3-avatar {
	width: 120px;
	height: 120px;
	border-radius: 28px;
	object-fit: cover;
	background: var(--ln3-panel);
	border: 3px solid var(--ln3-bg);
	box-shadow: 0 0 0 1px var(--ln3-line-strong), 0 18px 40px rgba(0, 0, 0, .35);
}
.ln3-badges { display: flex; flex-wrap: wrap; gap: .45rem; margin-bottom: .85rem; }
.ln3-badges:empty { display: none; }
.ln3-badge {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	padding: .3rem .7rem;
	border: 1px solid var(--ln3-line-strong);
	border-radius: 999px;
	background: var(--ln3-blue-soft);
	color: var(--ln3-blue-hi);
	font: 600 .74rem/1.2 'Inter', sans-serif;
}
.ln3-badge.is-green { background: rgba(52, 211, 153, .1); color: #6EE7B7; border-color: rgba(52, 211, 153, .3); }
.ln3-badge.is-amber { background: rgba(251, 191, 36, .1); color: #FCD34D; border-color: rgba(251, 191, 36, .3); }
/* Moderation warning: deliberately louder than the amber "Featured" badge. */
.ln3-badge.is-warn { background: rgba(249, 115, 22, .16); color: #FDBA74; border-color: rgba(249, 115, 22, .55); }
.ln3-hero h1 {
	margin: 0;
	color: #F8FAFC;
	font: 700 clamp(2.2rem, 4.6vw, 3.4rem)/1.04 'Space Grotesk', sans-serif;
	letter-spacing: -.03em;
	overflow-wrap: anywhere;
}
.ln3-role { margin: .55rem 0 0; color: var(--ln3-soft); font-size: 1.15rem; font-weight: 500; }
.ln3-meta {
	display: flex;
	flex-wrap: wrap;
	gap: .45rem 1.25rem;
	margin: 1rem 0 0;
	padding: 0;
	list-style: none;
	color: var(--ln3-muted);
	font-size: .9rem;
}
.ln3-meta:empty { display: none; }
.ln3-meta li { display: inline-flex; align-items: center; gap: .4rem; }
.ln3-meta svg { width: 16px; height: 16px; flex: none; }
.ln3-cta { display: flex; flex-direction: column; gap: .6rem; }
.ln3-cta-row { display: flex; flex-wrap: wrap; gap: .5rem; }
.ln3-cta-row > * { flex: 1 1 0; min-width: 0; }

.ln3-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 1px;
	margin-top: 2.25rem;
	overflow: hidden;
	border: 1px solid var(--ln3-line);
	border-radius: var(--ln3-r);
	background: var(--ln3-line);
}
.ln3-stats > div { padding: 1.15rem 1.25rem; background: var(--ln3-panel-2); }
.ln3-stats strong { display: block; color: #F8FAFC; font: 700 1.7rem/1.1 'Space Grotesk', sans-serif; }
.ln3-stats span { display: block; margin-top: .3rem; color: var(--ln3-muted); font-size: .82rem; }

.ln3-tabs {
	position: sticky;
	top: 72px;
	z-index: 20;
	background: rgba(5, 12, 26, .92);
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	border-bottom: 1px solid var(--ln3-line);
}
.ln3-tabs .ln3-wrap { display: flex; gap: .25rem; overflow-x: auto; scrollbar-width: none; }
.ln3-tabs a {
	padding: 1rem .9rem;
	border-bottom: 2px solid transparent;
	color: var(--ln3-muted);
	font: 600 .92rem 'Space Grotesk', sans-serif;
	white-space: nowrap;
	text-decoration: none;
}
.ln3-tabs a:hover,
.ln3-tabs a:focus-visible { color: #fff; border-bottom-color: var(--ln3-blue); }

/* ---------------- Public profile: sections ---------------- */

.ln3-section {
	padding: 2.5rem 0;
	background: var(--ln3-bg);
	color: var(--ln3-text);
	scroll-margin-top: 140px;
}
.ln3-section + .ln3-section { padding-top: .5rem; }
.ln3-section-head {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-end;
	gap: 1rem;
	margin-bottom: 1.25rem;
}
.ln3-section-head h2 { margin: 0; color: #F8FAFC; font: 700 clamp(1.5rem, 2.6vw, 2rem)/1.15 'Space Grotesk', sans-serif; }
.ln3-section-head p { margin: .35rem 0 0; color: var(--ln3-muted); font-size: .92rem; }

.ln3-search { position: relative; flex: 0 1 340px; }
.ln3-search svg { position: absolute; left: .85rem; top: 50%; width: 18px; height: 18px; transform: translateY(-50%); color: var(--ln3-muted); pointer-events: none; }
.ln3-search input {
	width: 100%;
	min-height: 44px;
	padding: .6rem .9rem .6rem 2.5rem;
	border: 1px solid var(--ln3-line-strong);
	border-radius: 12px;
	background: var(--ln3-bg);
	color: var(--ln3-text);
	font-size: .92rem;
}
.ln3-search input:focus { outline: 2px solid var(--ln3-blue); outline-offset: 1px; }

/* Inventory table inside the new card */
.ln3-inventory .ln-table-head {
	position: static;
	margin: 0;
	padding: .75rem .5rem;
	background: transparent;
	border-bottom: 1px solid var(--ln3-line);
}
.ln3-inventory .ln-sites-table { margin: 0; background: transparent; }
.ln3-inventory .ln-pub-site-row { border-bottom: 1px solid var(--ln3-line); }
.ln3-inventory .ln-pub-site-row:last-child { border-bottom: 0; }
.ln3-inventory .ln-pub-site-row .ln-row-grid { padding: 1rem .5rem; }
.ln3-inventory .ln-pub-site-row:hover { background: rgba(96, 165, 250, .05); }
.ln3-inventory .ln-pub-site-row.is-picked { background: rgba(96, 165, 250, .09); }
@media (min-width: 769px) {
	.ln3-inventory .ln-row-grid { grid-template-columns: minmax(220px, 1fr) 56px 56px 84px 130px 76px 92px 150px; }
	.ln3-table-scroll { overflow-x: auto; }
	.ln3-table-scroll > .ln-table-head,
	.ln3-table-scroll > .ln-sites-table { min-width: 940px; }
}

.ln-pub-site-row .ln-site-domain.ln3-site-cell { display: flex; flex-direction: row; align-items: center; gap: .8rem; }
.ln3-site-text { display: flex; flex-direction: column; min-width: 0; }
.ln3-site-text strong { overflow-wrap: anywhere; }
.ln3-pick { position: relative; display: inline-flex; flex: none; width: 26px; height: 26px; cursor: pointer; }
.ln3-pick input { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.ln3-pick > span {
	pointer-events: none;
	display: grid;
	place-items: center;
	width: 26px;
	height: 26px;
	border: 1.5px solid #64748B;
	border-radius: 8px;
	background: var(--ln3-bg);
	transition: background .15s, border-color .15s;
}
.ln3-pick > span svg { width: 14px; height: 14px; color: var(--ln3-ink); opacity: 0; }
.ln3-pick input:checked + span { background: var(--ln3-blue); border-color: var(--ln3-blue); }
.ln3-pick input:checked + span svg { opacity: 1; }
.ln3-pick input:focus-visible + span { outline: 2px solid var(--ln3-blue-hi); outline-offset: 2px; }

.ln3-pickbar {
	position: static;
	bottom: 1rem;
	z-index: 30;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-top: 1.25rem;
	padding: 1rem 1.2rem;
	border: 1px solid var(--ln3-line-strong);
	border-radius: 16px;
	background: #0F2A47;
	box-shadow: 0 18px 40px rgba(0, 0, 0, .35);
}
.ln3-pickbar.is-active { position: sticky; }
.ln3-pickbar strong { display: block; color: #fff; font: 700 1.05rem 'Space Grotesk', sans-serif; }
.ln3-pickbar > div > span { color: var(--ln3-muted); font-size: .86rem; }

/* Case studies */
.ln3-work-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1.1rem; }
.ln3-work {
	display: flex;
	flex-direction: column;
	gap: .75rem;
	overflow: hidden;
	padding: 1.3rem;
	border: 1px solid var(--ln3-line);
	border-radius: 20px;
	background: var(--ln3-panel);
}
.ln3-work-img { margin: -1.3rem -1.3rem .35rem; aspect-ratio: 16 / 9; overflow: hidden; background: var(--ln3-panel-2); }
.ln3-work-img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ln3-work h3 { margin: 0; color: #F8FAFC; font: 700 1.15rem/1.3 'Space Grotesk', sans-serif; }
.ln3-work p { margin: 0; color: var(--ln3-soft); font-size: .92rem; line-height: 1.6; }
.ln3-work .ln3-work-scope { color: var(--ln3-muted); font-size: .85rem; }
.ln3-work-outcome {
	padding: .8rem .9rem;
	border: 1px solid var(--ln3-line-strong);
	border-radius: 12px;
	background: var(--ln3-blue-soft);
	color: #E0F2FE;
	font-size: .92rem;
	line-height: 1.55;
}
.ln3-work-outcome b { display: block; margin-bottom: .25rem; color: var(--ln3-blue-hi); font: 700 .7rem/1.2 'Inter', sans-serif; letter-spacing: .07em; text-transform: uppercase; }
.ln3-link { margin-top: auto; color: var(--ln3-blue-hi); font-weight: 600; text-decoration: none; }
.ln3-link:hover { color: #fff; }
.ln3-empty { margin: 0; color: var(--ln3-muted); }

/* About */
.ln3-about { display: flex; flex-wrap: wrap; gap: 2rem; }
.ln3-about > div { flex: 1 1 300px; }
.ln3-about > div:first-child { flex-grow: 2; }
.ln3-about-bio { margin: 0; color: var(--ln3-soft); font-size: 1rem; line-height: 1.75; white-space: pre-line; }
.ln3-chips { display: flex; flex-wrap: wrap; gap: .45rem; }
.ln3-chips span { padding: .4rem .75rem; border: 1px solid var(--ln3-line); border-radius: 10px; background: var(--ln3-raise); color: var(--ln3-text); font-size: .85rem; }

/* Detail view (?site=…) sits under the new hero */
body.ln3-pro .ln-pub-detail-panel { width: min(1160px, 92%); margin: 2rem auto; }

/* "Made with LinkNest" */
.ln3-made { padding: 1rem 0 4rem; background: var(--ln3-bg); }
.ln3-made .ln3-wrap {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.2rem 1.4rem;
	border: 1px solid var(--ln3-line-strong);
	border-radius: 18px;
	background: var(--ln3-blue-soft);
}
.ln3-made p { margin: 0; color: var(--ln3-soft); }
.ln3-made strong { color: #fff; }

/* ---------------- Directory (/freelancers/) ---------------- */

body.ln3-pro .ln-pro-v2-hero-glow { background: radial-gradient(circle, rgba(96, 165, 250, .22), transparent 68%); }
body.ln3-pro .ln-pro-v2-btn-primary { background: var(--ln3-blue); color: var(--ln3-ink); box-shadow: 0 12px 30px rgba(96, 165, 250, .22); }
body.ln3-pro .ln-pro-v2-btn-primary:hover { background: var(--ln3-blue-hi); color: var(--ln3-ink); }
body.ln3-pro .ln-pro-v2-role-card.is-featured { background: linear-gradient(145deg, rgba(96, 165, 250, .14), #0a1525 58%); border-color: var(--ln3-line-strong); }
body.ln3-pro .ln-pro-v2-example-card-accent { border-color: var(--ln3-line-strong); }
body.ln3-pro .ln-pro-v2-demo-project { border-color: var(--ln3-line-strong); background: var(--ln3-blue-soft); }
body.ln3-pro .ln-pro-v2-avatar { background: linear-gradient(145deg, #3B82F6, #93C5FD); color: var(--ln3-ink); }
body.ln3-pro .ln-pro-v2-final-cta { background: linear-gradient(120deg, #0D2137, #11294A); border-top: 1px solid var(--ln3-line-strong); }
body.ln3-pro .ln-pro-v2-final-cta p { color: var(--ln3-soft); }
body.ln3-pro .ln-pro-v2-btn-light { background: var(--ln3-blue); color: var(--ln3-ink); }

body.ln3-pro .ln-pro-card {
	background: linear-gradient(180deg, var(--ln3-panel), var(--ln3-panel-2));
	border-color: var(--ln3-line);
	border-radius: var(--ln3-r);
	padding: 1.35rem;
}
body.ln3-pro .ln-pro-card:hover { border-color: var(--ln3-line-strong); box-shadow: 0 18px 40px rgba(0, 0, 0, .3); }
body.ln3-pro .ln-pro-card .ln-pro-avatar-img { width: 52px; height: 52px; border-radius: 14px; }
body.ln3-pro .ln-pro-view-btn { background: var(--ln3-blue-soft); color: var(--ln3-blue-hi); border: 1px solid var(--ln3-line-strong); transition: background .2s, color .2s; }
body.ln3-pro .ln-pro-card:hover .ln-pro-view-btn { background: var(--ln3-blue); color: var(--ln3-ink); }

/* ---------------- Dashboard ---------------- */

.ln3-dash {
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	gap: 2rem;
	align-items: start;
	width: min(1320px, 94%);
	margin: 0 auto;
	padding: calc(72px + 2rem) 0 4rem;
	color: var(--ln3-text);
}
.ln3-dash > .ln-pub-dashboard-wrap { width: auto; max-width: none; margin: 0; padding: 0; min-width: 0; }

.ln3-side {
	position: sticky;
	top: calc(72px + 1.25rem);
	display: flex;
	flex-direction: column;
	gap: 1.1rem;
	padding: 1.25rem;
	border: 1px solid var(--ln3-line);
	border-radius: 22px;
	background: var(--ln3-panel);
}
.ln3-side-me { display: flex; align-items: center; gap: .8rem; padding-bottom: 1.1rem; border-bottom: 1px solid var(--ln3-line); }
.ln3-side-me img { width: 48px; height: 48px; border-radius: 14px; object-fit: cover; }
.ln3-side-me > div { min-width: 0; }
.ln3-side-me strong { display: block; overflow: hidden; color: #fff; font: 700 1rem 'Space Grotesk', sans-serif; text-overflow: ellipsis; white-space: nowrap; }
.ln3-side-me span { display: block; color: var(--ln3-muted); font-size: .8rem; }
.ln3-side-nav { display: flex; flex-direction: column; gap: .2rem; }
.ln3-side-nav a {
	display: flex;
	align-items: center;
	gap: .7rem;
	min-height: 44px;
	padding: .55rem .75rem;
	border-radius: 11px;
	color: var(--ln3-soft);
	font: 500 .94rem 'Inter', sans-serif;
	text-decoration: none;
}
.ln3-side-nav a svg { width: 18px; height: 18px; flex: none; color: var(--ln3-muted); }
.ln3-side-nav a:hover { background: rgba(255, 255, 255, .04); color: #fff; }
.ln3-side-nav a.active { background: var(--ln3-blue-soft); color: #fff; box-shadow: inset 0 0 0 1px var(--ln3-line-strong); }
.ln3-side-nav a.active svg { color: var(--ln3-blue-hi); }
.ln3-side-foot { display: flex; flex-direction: column; gap: .6rem; padding-top: 1rem; border-top: 1px solid var(--ln3-line); }
.ln3-side-foot a { color: var(--ln3-muted); font-size: .88rem; text-decoration: none; }
.ln3-side-foot a:hover { color: #fff; }
.ln3-side-foot .ln3-side-public { color: var(--ln3-blue-hi); font-weight: 600; }
.ln3-side-foot .ln3-side-plan { color: #FCD34D; font-weight: 600; }
.ln3-side-foot .ln3-side-logout { color: #FCA5A5; }

.ln3-dash-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.ln3-dash-head h1 { margin: 0; color: #F8FAFC; font: 700 clamp(1.7rem, 3vw, 2.3rem)/1.1 'Space Grotesk', sans-serif; overflow-wrap: anywhere; }
.ln3-dash-head p:not(.ln3-kicker) { margin: .4rem 0 0; color: var(--ln3-muted); }
.ln3-dash-head strong { color: #fff; }

.ln3-share {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
	gap: 1.5rem;
	align-items: center;
	margin-bottom: 1.25rem;
	padding: 1.5rem;
	border: 1px solid var(--ln3-line-strong);
	border-radius: 22px;
	background:
		radial-gradient(600px 240px at 0% 0%, rgba(96, 165, 250, .18), transparent 70%),
		var(--ln3-panel);
}
.ln3-share-url { display: flex; flex-wrap: wrap; align-items: center; gap: .7rem; margin: .2rem 0 .55rem; }
.ln3-share-url code { padding: 0; background: none; color: #fff; font: 700 clamp(1rem, 2vw, 1.3rem) 'Space Grotesk', sans-serif; word-break: break-all; }
.ln3-share small { color: var(--ln3-muted); font-size: .86rem; }
.ln3-share small.is-warning { color: #FCD34D; }
.ln3-share-actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6rem; }
.ln3-share-actions a,
.ln3-share-actions button {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	min-height: 84px;
	padding: .7rem .4rem;
	border: 1px solid var(--ln3-line);
	border-radius: 14px;
	background: rgba(255, 255, 255, .03);
	color: var(--ln3-text);
	font: 600 .8rem 'Inter', sans-serif;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
}
.ln3-share-actions svg { width: 22px; height: 22px; color: var(--ln3-blue-hi); }
.ln3-share-actions a:hover,
.ln3-share-actions button:hover { border-color: var(--ln3-line-strong); background: var(--ln3-blue-soft); color: #fff; }

.ln3-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.ln3-kpi { padding: 1.15rem 1.2rem; border: 1px solid var(--ln3-line); border-radius: 18px; background: var(--ln3-panel); }
.ln3-kpi span { display: block; color: var(--ln3-muted); font-size: .84rem; }
.ln3-kpi strong { display: block; margin: .35rem 0; color: #F8FAFC; font: 700 1.9rem/1.1 'Space Grotesk', sans-serif; }
.ln3-kpi small { color: var(--ln3-muted); font-size: .8rem; }
.ln3-kpi small.is-up { color: #6EE7B7; }
.ln3-kpi small.is-down { color: #FCA5A5; }

.ln3-dash-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 1.25rem; margin-bottom: 1.5rem; }
.ln3-panel { padding: 1.35rem; border: 1px solid var(--ln3-line); border-radius: 20px; background: var(--ln3-panel); }
.ln3-panel h2 { margin: 0 0 .25rem; color: #F8FAFC; font: 700 1.2rem 'Space Grotesk', sans-serif; }
.ln3-panel > p { margin: 0 0 1rem; color: var(--ln3-muted); font-size: .88rem; }

.ln3-feed { margin: 0; padding: 0; list-style: none; }
.ln3-feed li { display: flex; align-items: flex-start; gap: .85rem; padding: .85rem 0; border-top: 1px solid var(--ln3-line); }
.ln3-feed li:first-child { border-top: 0; padding-top: .2rem; }
.ln3-feed i { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 11px; background: var(--ln3-blue-soft); color: var(--ln3-blue-hi); font-style: normal; }
.ln3-feed i.is-green { background: rgba(52, 211, 153, .1); color: #6EE7B7; }
.ln3-feed i svg { width: 18px; height: 18px; }
.ln3-feed b { display: block; color: var(--ln3-text); font-size: .93rem; font-weight: 500; }
.ln3-feed small { color: var(--ln3-muted); font-size: .8rem; }

.ln3-meter { height: 10px; margin: .6rem 0 1rem; overflow: hidden; border: 1px solid var(--ln3-line); border-radius: 99px; background: var(--ln3-bg); }
.ln3-meter span { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, #60A5FA, #93C5FD); }
.ln3-check { display: flex; flex-direction: column; gap: .15rem; margin: 0; padding: 0; list-style: none; }
.ln3-check a {
	display: flex;
	align-items: center;
	gap: .7rem;
	min-height: 44px;
	padding: .35rem .45rem;
	border-radius: 10px;
	color: var(--ln3-text);
	font-size: .92rem;
	text-decoration: none;
}
.ln3-check a:hover { background: rgba(255, 255, 255, .04); }
.ln3-check em { display: grid; place-items: center; flex: none; width: 22px; height: 22px; border: 1.5px solid #64748B; border-radius: 50%; font-style: normal; }
.ln3-check em svg { width: 12px; height: 12px; opacity: 0; }
.ln3-check .is-done { color: var(--ln3-muted); }
.ln3-check .is-done em { border-color: var(--ln3-blue); background: var(--ln3-blue); color: var(--ln3-ink); }
.ln3-check .is-done em svg { opacity: 1; }
.ln3-check .ln3-go { margin-left: auto; color: var(--ln3-blue-hi); font-size: .8rem; font-weight: 600; white-space: nowrap; }

/* Legacy overview stat cards are replaced by the KPI row above them. */
.ln3-dash .ln3-overview ~ .ln-dash-cards { display: none; }
.ln3-dash .ln-dash-quality-box,
.ln3-dash .ln-trial-card { border: 1px solid var(--ln3-line); border-radius: 20px; background: var(--ln3-panel); }
.ln3-dash .ln-dash-card { border-color: var(--ln3-line); border-radius: 16px; background: var(--ln3-panel); }
.ln3-dash .ln-dash-quality-box h3 { margin: 0 0 .4rem; }
.ln3-dash .ln-dash-quality-box p { margin: 0 0 1rem; color: var(--ln3-muted); line-height: 1.6; }

/* ---------------- Inventory: load more / no match ---------------- */

.ln3-btn[hidden] { display: none; }
.ln3-more {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: .75rem 1rem;
	margin-top: 1.1rem;
	padding-top: 1.1rem;
	border-top: 1px solid var(--ln3-line);
}
.ln3-more span { color: var(--ln3-muted); font-size: .88rem; }
.ln3-no-match { padding: 1.5rem .5rem; text-align: center; }

/* ---------------- Directory hero: example profile card ---------------- */

body.ln3-pro .ln3-demo-head { align-items: flex-start; padding: 1.2rem 0 .9rem; }
.ln3-demo-badges { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .45rem; }
.ln3-demo-badges .ln3-badge { padding: .2rem .5rem; font-size: .62rem; }
.ln3-demo-cta { display: grid; grid-template-columns: 1fr auto; gap: .5rem; margin-bottom: 1rem; }
.ln3-demo-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .4rem;
	min-height: 36px;
	padding: .45rem .8rem;
	border: 1px solid var(--ln3-line-strong);
	border-radius: 10px;
	color: var(--ln3-text);
	font: 600 .74rem/1.1 'Space Grotesk', sans-serif;
	white-space: nowrap;
}
.ln3-demo-btn svg { width: 14px; height: 14px; }
.ln3-demo-btn.is-primary { background: var(--ln3-blue); border-color: var(--ln3-blue); color: var(--ln3-ink); }
.ln3-demo-sites { margin: 1rem 0 0; padding: 0; list-style: none; border: 1px solid var(--ln3-line); border-radius: 14px; overflow: hidden; }
.ln3-demo-sites li { display: flex; align-items: center; gap: .7rem; padding: .65rem .8rem; border-top: 1px solid var(--ln3-line); }
.ln3-demo-sites li:first-child { border-top: 0; }
.ln3-demo-sites li.is-picked { background: rgba(96, 165, 250, .08); }
.ln3-demo-sites i { flex: none; width: 16px; height: 16px; border: 1.5px solid #64748B; border-radius: 5px; }
.ln3-demo-sites li.is-picked i {
	border-color: var(--ln3-blue);
	background: var(--ln3-blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A1628' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 11px no-repeat;
}
.ln3-demo-sites span { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.ln3-demo-sites strong { overflow: hidden; color: #E2E8F0; font-size: .74rem; text-overflow: ellipsis; white-space: nowrap; }
.ln3-demo-sites small { color: #64748b; font-size: .62rem; }
.ln3-demo-sites b { padding: .15rem .45rem; border-radius: 6px; background: var(--ln3-blue-soft); color: var(--ln3-blue-hi); font-size: .64rem; }
.ln3-demo-pickbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .6rem;
	margin-top: .8rem;
	padding: .6rem .7rem;
	border: 1px solid var(--ln3-line-strong);
	border-radius: 12px;
	background: #0F2A47;
	color: var(--ln3-soft);
	font-size: .72rem;
}
.ln3-demo-pickbar strong { color: #fff; }

/* ---------------- Directory: people photo beside "Built to be shared" ---------------- */

.ln3-how-grid.has-photo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2.5rem; align-items: center; }
/* Transparent cut-out photo: no frame, just a soft light behind the people
   so dark suits stay readable on the navy page, and a fade at the bottom
   where the photo is cropped. */
.ln3-how-photo { position: relative; display: flex; justify-content: center; align-items: flex-end; min-width: 0; margin: 0; }
.ln3-how-photo::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 46%;
	width: min(92%, 520px);
	aspect-ratio: 1;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(96, 165, 250, .26) 0%, rgba(96, 165, 250, .1) 42%, rgba(96, 165, 250, 0) 70%);
	transform: translate(-50%, -50%);
	pointer-events: none;
}
/* Crop window = the people (x 79-882, y 119-1152 of the 928x1152 photo). */
.ln3-how-cut { position: relative; width: min(100%, 420px); aspect-ratio: 803 / 1033; overflow: hidden; }
.ln3-how-cut img {
	position: absolute;
	top: -11.52%;
	left: -9.838%;
	display: block;
	width: 115.567%;
	max-width: none;
	height: auto;
	-webkit-mask-image: url("../img/freelancers-team-mask.svg");
	mask-image: url("../img/freelancers-team-mask.svg");
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
}
.ln3-how-chip {
	position: absolute;
	left: 50%;
	bottom: .75rem;
	z-index: 1;
	transform: translateX(-50%);
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	max-width: calc(100% - 2rem);
	padding: .45rem .8rem;
	overflow: hidden;
	border: 1px solid var(--ln3-line-strong);
	border-radius: 999px;
	background: rgba(10, 22, 40, .85);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	color: #E2E8F0;
	font: 600 .74rem/1.2 'Inter', sans-serif;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.ln3-how-chip span { flex: none; width: 8px; height: 8px; border-radius: 50%; background: #34D399; box-shadow: 0 0 0 4px rgba(52, 211, 153, .15); }
.ln3-how-grid.has-photo .ln-pro-v2-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ln3-how-grid.has-photo .ln-pro-v2-steps > div:nth-child(3) { border-left: 0; }
.ln3-how-grid.has-photo .ln-pro-v2-steps > div:nth-child(n+3) { border-top: 0; }
@media (max-width: 900px) {
	.ln3-how-grid.has-photo { grid-template-columns: 1fr; gap: 1.75rem; }
	.ln3-how-cut { width: min(100%, 330px); }
}
@media (max-width: 640px) {
	.ln3-how-grid.has-photo .ln-pro-v2-steps { grid-template-columns: 1fr; }
	.ln3-how-grid.has-photo .ln-pro-v2-steps > div + div { border-left: 0; border-top: 0; }
}

/* ---------------- Dashboard: warning from LinkNest ---------------- */

.ln3-warning {
	margin: 0 0 1.5rem;
	padding: 1.25rem 1.35rem;
	border: 1px solid rgba(249, 115, 22, .45);
	border-left: 4px solid #F97316;
	border-radius: var(--ln3-r);
	background: linear-gradient(180deg, rgba(249, 115, 22, .13), rgba(249, 115, 22, .04));
	color: var(--ln3-text);
}
.ln3-warning-head { display: flex; gap: .9rem; align-items: flex-start; }
.ln3-warning-icon {
	display: grid;
	flex: none;
	place-items: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: #F97316;
	color: var(--ln3-ink);
	font: 800 1.15rem/1 'Inter', sans-serif;
}
.ln3-warning h2 { margin: 0 0 .3rem; color: #FDBA74; font-size: 1.08rem; line-height: 1.3; }
.ln3-warning p { margin: 0; color: var(--ln3-soft); font-size: .9rem; line-height: 1.55; }
.ln3-warning p strong { color: #fff; }
.ln3-warning-msg {
	margin: 1rem 0 0;
	padding: .85rem 1rem;
	border: 1px solid var(--ln3-line);
	border-radius: 12px;
	background: rgba(5, 12, 26, .55);
}
.ln3-warning-msg span { display: block; margin-bottom: .35rem; color: #FDBA74; font: 700 .7rem/1 'Inter', sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.ln3-warning-msg p { color: #fff; }
.ln3-warning-actions { display: flex; flex-wrap: wrap; gap: .6rem .9rem; align-items: center; margin-top: 1rem; }
.ln3-warning-actions form { margin: 0; }
.ln3-warning-actions p.ln3-warning-sent { flex: 1 1 100%; color: #86EFAC; font-weight: 600; }
.ln3-warning-link { color: var(--ln3-blue-hi); font-size: .86rem; text-decoration: underline; text-underline-offset: 3px; }
.ln3-warning-link:hover { color: #fff; }
@media (max-width: 640px) {
	.ln3-warning-actions form, .ln3-warning-actions form .ln3-btn, .ln3-warning-actions > .ln3-btn { width: 100%; }
}

/* ---------------- Continue with Google (Join / Log In) ---------------- */

.ln3-google-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .75rem;
	width: 100%;
	min-height: 48px;
	padding: .7rem 1rem;
	border: 1px solid #747775;
	border-radius: 10px;
	background: #fff;
	color: #1F1F1F;
	font: 600 .95rem/1.2 'Inter', 'Roboto', sans-serif;
	text-decoration: none;
	transition: background .2s, box-shadow .2s;
}
.ln3-google-btn:hover { background: #F2F2F2; color: #1F1F1F; box-shadow: 0 2px 10px rgba(0, 0, 0, .25); }
.ln3-google-btn:focus-visible { outline: 2px solid var(--ln3-blue-hi); outline-offset: 2px; }
.ln3-google-btn svg { width: 20px; height: 20px; flex: none; }
.ln3-or { display: flex; align-items: center; gap: .8rem; margin: .25rem 0; color: var(--ln3-muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; }
.ln3-or::before,
.ln3-or::after { content: ""; flex: 1; height: 1px; background: var(--ln3-line); }

/* ---------------- Responsive ---------------- */

@media (max-width: 1024px) {
	.ln3-hero-grid { grid-template-columns: auto minmax(0, 1fr); }
	.ln3-cta { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; }
	.ln3-cta > .ln3-btn { flex: 1 1 220px; }
	.ln3-cta-row { flex: 1 1 100%; }
	.ln3-hero-grid.has-cover .ln3-cta { padding-top: 0; }

	.ln3-dash { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
	.ln3-side { position: static; min-width: 0; padding: 1rem; }
	.ln3-side-nav { flex-direction: row; overflow-x: auto; scrollbar-width: none; }
	.ln3-side-nav a { white-space: nowrap; }
	.ln3-side-foot { flex-direction: row; flex-wrap: wrap; gap: .6rem 1.25rem; }
	.ln3-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ln3-dash-grid,
	.ln3-share { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
	.ln3-inventory .ln-pub-site-row .ln-row-grid { padding: 1rem .25rem; }
}

@media (max-width: 640px) {
	.ln3-hero { padding-top: calc(72px + 1.75rem); }
	.ln3-hero-grid { grid-template-columns: 1fr; gap: 1.25rem; }
	.ln3-hero-grid.has-cover .ln3-hero-copy { padding-top: 0; }
	.ln3-hero-cover { height: 140px; }
	.ln3-avatar { width: 92px; height: 92px; border-radius: 22px; }
	.ln3-card { padding: 1.1rem; }
	.ln3-search { flex-basis: 100%; }
	.ln3-pickbar .ln3-btn { width: 100%; }
	.ln3-share { padding: 1.15rem; }
	.ln3-share-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ln3-kpis { grid-template-columns: 1fr 1fr; gap: .7rem; }
	.ln3-kpi strong { font-size: 1.5rem; }
}

/* ================= Dashboard v4 (overview, share kit, insights, phone tab bar) ================= */

.ln4-overview { display: flex; flex-direction: column; gap: 1.25rem; margin-bottom: 1.5rem; }
.ln4-overview > .ln3-share,
.ln4-overview .ln3-kpis,
.ln4-overview .ln3-dash-grid { margin-bottom: 0; }
.ln3-dash-grid.is-single { grid-template-columns: minmax(0, 1fr); }

/* Next step */
.ln4-next {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
	gap: 1.25rem 2rem;
	align-items: start;
	padding: 1.4rem;
	border: 1px solid var(--ln3-line-strong);
	border-radius: 20px;
	background: var(--ln3-panel);
}
.ln4-next-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.ln4-next-top .ln3-kicker { margin: 0; }
.ln4-next-pct { color: var(--ln3-soft); font-size: .88rem; }
.ln4-next-pct strong { color: #fff; }
.ln4-next .ln3-meter { margin: .7rem 0 1.1rem; }
.ln4-next h2 { margin: 0 0 .35rem; color: #fff; font: 700 clamp(1.25rem, 2.2vw, 1.55rem)/1.2 'Space Grotesk', sans-serif; }
.ln4-next-main > p:not(.ln3-kicker) { max-width: 52ch; margin: 0 0 1rem; color: var(--ln3-soft); line-height: 1.55; }
.ln4-steps { padding: .2rem .8rem; border: 1px solid var(--ln3-line); border-radius: 16px; background: var(--ln3-panel-2); }
.ln4-steps summary { display: flex; align-items: center; justify-content: space-between; min-height: 44px; color: var(--ln3-blue-hi); font-size: .9rem; font-weight: 600; list-style: none; cursor: pointer; }
.ln4-steps summary::-webkit-details-marker { display: none; }
.ln4-steps summary::after { content: '▾'; color: var(--ln3-muted); transition: transform .2s; }
.ln4-steps[open] summary::after { transform: rotate(180deg); }
.ln4-steps .ln3-check { padding-bottom: .5rem; }

/* Share kit */
.ln3-share.ln4-share { grid-template-columns: minmax(0, 1fr); }
.ln4-share-actions { grid-template-columns: repeat(5, minmax(0, 1fr)); }

/* Share-kit dialogs */
.ln4-dialog { position: fixed; inset: 0; width: min(440px, calc(100vw - 32px)); max-height: calc(100vh - 32px); margin: auto; padding: 0; border: 1px solid var(--ln3-line-strong); border-radius: 20px; background: var(--ln3-panel); color: var(--ln3-text); }
.ln4-dialog::backdrop { background: rgba(2, 6, 16, .72); }
.ln4-dialog-box { position: relative; display: flex; flex-direction: column; gap: .85rem; padding: 1.4rem; }
.ln4-dialog h3 { margin: 0; padding-right: 2.5rem; color: #fff; font: 700 1.2rem 'Space Grotesk', sans-serif; }
.ln4-dialog p { margin: 0; color: var(--ln3-soft); font-size: .9rem; line-height: 1.5; }
.ln4-dialog-x { position: absolute; top: .6rem; right: .6rem; width: 44px; height: 44px; border: 0; border-radius: 12px; background: transparent; color: var(--ln3-muted); font-size: 1.6rem; line-height: 1; cursor: pointer; }
.ln4-dialog-x:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.ln4-dialog .ln3-btn { align-self: flex-start; }
.ln4-qr { align-self: center; padding: 12px; border-radius: 16px; background: #fff; }
.ln4-qr img { display: block; width: 240px; max-width: 100%; height: auto; aspect-ratio: 1; }
.ln4-sig-preview,
.ln4-badge-preview { overflow: auto; padding: 1rem; border-radius: 12px; background: #fff; }
.ln4-badge-preview { display: flex; justify-content: center; }
.ln4-code { box-sizing: border-box; width: 100%; padding: .75rem; border: 1px solid var(--ln3-line-strong); border-radius: 10px; background: var(--ln3-bg); color: var(--ln3-soft); font: .78rem/1.45 ui-monospace, SFMono-Regular, Menlo, monospace; resize: none; }

/* Performance — laid out like the Google Analytics overview card:
   metric tabs on top, line chart with the preceding period dashed,
   y-axis labels on the right, legend underneath. */
.ln4-overview[data-range="7"] .ln4-r30,
.ln4-overview[data-range="30"] .ln4-r7 { display: none !important; }

.ln4-perf.ln4-ga { overflow: hidden; padding: 0; }
.ln4-ga .ln4-perf-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .8rem 1rem; margin: 0; padding: 1.25rem 1.4rem 1rem; }
.ln4-ga .ln4-perf-head h2 { margin: 0; }
.ln4-ga-dates { margin: .25rem 0 0; color: var(--ln3-muted); font-size: .82rem; }
.ln4-ga-range { position: relative; display: inline-flex; align-items: center; gap: .45rem; min-height: 40px; padding: 0 0 0 .75rem; border: 1px solid var(--ln3-line-strong); border-radius: 10px; background: var(--ln3-panel-2); color: var(--ln3-blue-hi); cursor: pointer; }
.ln4-ga-range svg { width: 17px; height: 17px; flex: none; }
.ln4-ga-range select { min-height: 38px; padding: 0 2rem 0 0; border: 0; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2393C5FD' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right .6rem center / 14px; color: #fff; font: 600 .88rem 'Inter', sans-serif; cursor: pointer; -webkit-appearance: none; appearance: none; }
.ln4-ga-range select:focus { outline: none; }
.ln4-ga-range:focus-within { border-color: var(--ln3-blue); box-shadow: 0 0 0 3px rgba(96, 165, 250, .25); }
.ln4-ga-range option { background: var(--ln3-panel); color: #fff; }

.ln4-ga-tabs { display: grid; grid-auto-columns: minmax(0, 1fr); grid-auto-flow: column; border-top: 1px solid var(--ln3-line); border-bottom: 1px solid var(--ln3-line); }
.ln4-ga-tab { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: .35rem; min-width: 0; padding: 1rem 1.4rem 1.1rem; border: 0; border-right: 1px solid var(--ln3-line); background: rgba(5, 12, 26, .45); color: inherit; font: inherit; text-align: left; cursor: pointer; transition: background .15s; }
.ln4-ga-tab:last-child { border-right: 0; }
.ln4-ga-tab::before { content: ''; position: absolute; top: 0; right: 0; left: 0; height: 3px; background: transparent; }
.ln4-ga-tab:hover { background: rgba(96, 165, 250, .06); }
.ln4-ga-tab[aria-pressed="true"] { background: transparent; }
.ln4-ga-tab[aria-pressed="true"]::before { background: var(--ln3-blue); }
.ln4-ga-tab:focus-visible { outline: 2px solid var(--ln3-blue); outline-offset: -2px; }
.ln4-ga-name { overflow: hidden; max-width: 100%; color: var(--ln3-muted); font-size: .84rem; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.ln4-ga-tab[aria-pressed="true"] .ln4-ga-name { color: var(--ln3-blue-hi); }
.ln4-ga-num { display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .55rem; }
.ln4-ga-num strong { color: #fff; font: 700 1.75rem/1.1 'Space Grotesk', sans-serif; }
.ln4-ga-num small { color: var(--ln3-muted); font-size: .8rem; font-weight: 700; white-space: nowrap; }
.ln4-ga-num small.is-up { color: #34D399; }
.ln4-ga-num small.is-down { color: #F87171; }

.ln4-ga-chart { position: relative; min-height: 270px; margin: 1rem 1.4rem 0; }
.ln4-ga-chart svg { display: block; overflow: visible; }
.ln4-ga-grid line { stroke: rgba(148, 163, 184, .14); stroke-width: 1; }
.ln4-ga-grid line.is-base { stroke: rgba(148, 163, 184, .38); }
.ln4-ga-grid text,
.ln4-ga-axis text { fill: var(--ln3-muted); font: 500 11px 'Inter', sans-serif; }
.ln4-ga-axis text.is-month { fill: rgba(148, 163, 184, .75); }
.ln4-ga-cur { fill: none; stroke: var(--ln3-blue); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.ln4-ga-prev { fill: none; stroke: #93C5FD; stroke-dasharray: 5 5; stroke-opacity: .5; stroke-width: 2; stroke-linejoin: round; }
.ln4-ga-stop-a { stop-color: #60A5FA; stop-opacity: .22; }
.ln4-ga-stop-b { stop-color: #60A5FA; stop-opacity: 0; }
.ln4-ga-dot { fill: var(--ln3-panel); stroke: var(--ln3-blue); stroke-width: 2; }
.ln4-ga-hover line { stroke: rgba(203, 213, 225, .45); stroke-width: 1; }
.ln4-ga-hover .is-cur { fill: var(--ln3-blue); stroke: var(--ln3-panel); stroke-width: 2; }
.ln4-ga-hover .is-prev { fill: var(--ln3-panel); stroke: #93C5FD; stroke-opacity: .75; stroke-width: 2; }
.ln4-ga-layer { cursor: crosshair; touch-action: pan-y; }
.ln4-ga-tip { position: absolute; z-index: 2; min-width: 170px; padding: .65rem .8rem; border: 1px solid var(--ln3-line-strong); border-radius: 10px; background: #0A1628; box-shadow: 0 12px 30px rgba(0, 0, 0, .45); font-size: .8rem; pointer-events: none; }
.ln4-ga-tip[hidden] { display: none; }
.ln4-ga-tip p { margin: 0; }
.ln4-ga-tip .t-h { margin-bottom: .45rem; color: var(--ln3-muted); font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.ln4-ga-tip .t-row { display: flex; align-items: center; gap: .55rem; margin-top: .25rem; color: var(--ln3-soft); white-space: nowrap; }
.ln4-ga-tip .t-row span { flex: 1; }
.ln4-ga-tip .t-row b { color: #fff; font-weight: 700; }
.ln4-ga-tip .t-row i,
.ln4-ga-legend i { display: inline-block; width: 16px; height: 0; border-top: 2.5px solid var(--ln3-blue); }
.ln4-ga-tip .t-row.is-prev i,
.ln4-ga-legend .is-prev i { border-top: 2px dashed rgba(147, 197, 253, .65); }
.ln4-ga-empty { position: absolute; margin: 0; padding: .5rem; color: var(--ln3-soft); font-size: .9rem; line-height: 1.45; text-align: center; pointer-events: none; }

.ln4-ga-legend { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem; padding: .35rem 1.4rem 1.25rem; color: var(--ln3-soft); font-size: .82rem; }
.ln4-ga-legend > span { display: inline-flex; align-items: center; gap: .45rem; }
.ln4-ga-legend b { font-weight: 500; }
.ln4-ga-legend em { margin-left: auto; color: var(--ln3-muted); font-style: normal; }

/* Sources / countries — GA-style lists that follow the date range */
.ln4-ga-cards .ln3-panel h2 { margin-bottom: .75rem; }
.ln4-ga-list { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: .9rem; }
.ln4-ga-list th { padding: 0 0 .45rem; color: var(--ln3-muted); font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-align: left; text-transform: uppercase; }
.ln4-ga-list th:last-child,
.ln4-ga-list td:last-child { width: 6.5rem; padding-left: 1rem; text-align: right; }
.ln4-ga-list td { padding: .6rem 0; border-top: 1px solid var(--ln3-line); color: var(--ln3-text); vertical-align: top; }
.ln4-ga-list td span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ln4-ga-list td i { display: block; height: 6px; margin-top: .45rem; border-radius: 99px; background: var(--ln3-line); }
.ln4-ga-list td b { display: block; height: 100%; border-radius: 99px; background: var(--ln3-blue); }
.ln4-ga-list td:last-child { color: #fff; font-weight: 700; }
.ln4-ga-list td small { margin-left: .25rem; color: var(--ln3-muted); font-weight: 500; }

/* Activity + most wanted websites */
.ln4-chip-new { margin-left: .35rem; padding: .1rem .5rem; border-radius: 99px; background: rgba(52, 211, 153, .12); color: #6EE7B7; font-size: .7rem; font-style: normal; font-weight: 700; vertical-align: middle; }
.ln4-top { width: 100%; border-collapse: collapse; font-size: .9rem; table-layout: fixed; }
.ln4-top th { padding: .4rem 0; color: var(--ln3-muted); font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-align: left; text-transform: uppercase; }
.ln4-top th + th, .ln4-top td + td { width: 4.5rem; padding-left: .75rem; text-align: right; }
.ln4-top td { overflow: hidden; padding: .65rem 0; border-top: 1px solid var(--ln3-line); color: var(--ln3-text); text-overflow: ellipsis; white-space: nowrap; }
.ln4-top td strong { color: var(--ln3-blue-hi); }
.ln4-hint { margin: .8rem 0 0; color: var(--ln3-muted); font-size: .82rem; }

/* Inventory health */
.ln4-health { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) auto; gap: 1rem 1.25rem; align-items: center; }
.ln4-health-text .ln3-kicker { margin: 0 0 .3rem; }
.ln4-health-text p:not(.ln3-kicker) { margin: 0; color: var(--ln3-soft); line-height: 1.5; }
.ln4-health-text strong { color: #fff; }
.ln4-health-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; margin: 0; padding: 0; list-style: none; }
.ln4-health-list li { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .7rem .85rem; border-radius: 12px; background: var(--ln3-panel-2); color: var(--ln3-soft); font-size: .85rem; }
.ln4-health-list strong { color: #fff; }
.ln4-health-list li.is-warn { background: rgba(249, 115, 22, .12); color: #FDE2C4; }
.ln4-health-list li.is-warn strong { color: #FDBA74; }

/* Sidebar */
.ln4-pro-soon { margin: 0; padding: .8rem .9rem; border: 1px dashed rgba(246, 194, 126, .4); border-radius: 14px; color: var(--ln3-soft); font-size: .82rem; line-height: 1.45; }
.ln4-pro-soon span { display: block; margin-bottom: .2rem; color: #F6C27E; font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

/* Phone tab bar (replaces the cut-off top menu) */
.ln4-tabbar { display: none; }

@media (max-width: 1024px) {
	.ln4-next,
	.ln4-health { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 768px) {
	.ln3-side-nav,
	.ln3-side-foot { display: none; }
	.ln3-side { padding: .85rem 1rem; }
	.ln3-side-me { padding-bottom: 0; border-bottom: 0; }
	.ln3-dash { padding-bottom: calc(4rem + 80px); }
	body.ln3-pro:has(.ln4-tabbar) { padding-bottom: 80px; }

	.ln4-tabbar {
		position: fixed;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 99;
		display: grid;
		grid-template-columns: repeat(5, minmax(0, 1fr));
		align-items: center;
		padding: 6px 4px calc(8px + env(safe-area-inset-bottom));
		border-top: 1px solid var(--ln3-line-strong);
		background: rgba(10, 22, 40, .97);
		-webkit-backdrop-filter: blur(10px);
		backdrop-filter: blur(10px);
	}
	.ln4-tabbar > a,
	.ln4-tabbar summary {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 3px;
		min-height: 52px;
		color: var(--ln3-muted);
		font: 600 .68rem 'Inter', sans-serif;
		text-decoration: none;
		list-style: none;
		cursor: pointer;
	}
	.ln4-tabbar summary::-webkit-details-marker { display: none; }
	.ln4-tabbar svg { width: 22px; height: 22px; }
	.ln4-tabbar .is-active,
	.ln4-tabbar-more[open] summary { color: var(--ln3-blue-hi); }
	.ln4-tabbar > a.ln4-tabbar-add {
		justify-self: center;
		width: 52px;
		height: 52px;
		min-height: 0;
		border-radius: 16px;
		background: var(--ln3-blue);
		color: var(--ln3-ink);
		box-shadow: 0 8px 24px rgba(96, 165, 250, .35);
	}
	.ln4-tabbar-sheet {
		position: fixed;
		right: 10px;
		bottom: calc(78px + env(safe-area-inset-bottom));
		left: 10px;
		display: flex;
		flex-direction: column;
		gap: 2px;
		padding: .6rem;
		border: 1px solid var(--ln3-line-strong);
		border-radius: 18px;
		background: var(--ln3-panel);
		box-shadow: 0 20px 50px rgba(0, 0, 0, .5);
	}
	.ln4-tabbar-sheet a { display: flex; align-items: center; gap: .75rem; min-height: 48px; padding: 0 .75rem; border-radius: 12px; color: var(--ln3-text); font-size: .95rem; text-decoration: none; }
	.ln4-tabbar-sheet a svg { color: var(--ln3-muted); }
	.ln4-tabbar-sheet a.is-active { background: var(--ln3-blue-soft); }
	.ln4-tabbar-sheet a.is-plan { color: #FCD34D; }
	.ln4-tabbar-sheet a.is-logout { color: #FCA5A5; }
}

@media (max-width: 640px) {
	.ln4-next { padding: 1.1rem; }
	.ln4-share-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.ln4-ga .ln4-perf-head { padding: 1.1rem 1rem .9rem; }
	.ln4-ga-range { width: 100%; }
	.ln4-ga-range select { flex: 1; }
	.ln4-ga-tabs { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ln4-ga-tab { padding: .85rem 1rem .95rem; border-right: 0; border-bottom: 1px solid var(--ln3-line); }
	.ln4-ga-tab:nth-child(odd) { border-right: 1px solid var(--ln3-line); }
	.ln4-ga-tab:last-child:nth-child(odd) { grid-column: 1 / -1; border-right: 0; }
	.ln4-ga-tab:nth-last-child(-n+2):nth-child(odd),
	.ln4-ga-tab:last-child { border-bottom: 0; }
	.ln4-ga-num strong { font-size: 1.4rem; }
	.ln4-ga-name { white-space: normal; }
	.ln4-ga-chart { min-height: 210px; margin: .9rem 1rem 0; }
	.ln4-ga-legend { padding: .35rem 1rem 1.1rem; }
	.ln4-ga-legend em { flex-basis: 100%; margin-left: 0; }
	.ln4-health-list { grid-template-columns: minmax(0, 1fr); }
	.ln4-dialog .ln3-btn { align-self: stretch; }
}