/* ==========================================================================
   Snipfire site
   Palette: porcelain and celadon slip, cobalt glaze, one kiln ember.
   Type: Commissioner (Kostas Bartsokas; covers Greek) with its flair axis for
   display text, JetBrains Mono for code. Both self-hosted, no Google requests.
   ========================================================================== */

@font-face {
	font-family: "CK Sans";
	src: url(../fonts/commissioner-latin-full-normal.woff2) format("woff2-variations");
	font-weight: 100 900;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "CK Sans";
	src: url(../fonts/commissioner-latin-ext-full-normal.woff2) format("woff2-variations");
	font-weight: 100 900;
	font-display: swap;
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: "CK Sans";
	src: url(../fonts/commissioner-greek-full-normal.woff2) format("woff2-variations");
	font-weight: 100 900;
	font-display: swap;
	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
	font-family: "CK Mono";
	src: url(../fonts/jetbrains-mono-latin-wght-normal.woff2) format("woff2-variations");
	font-weight: 100 800;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "CK Mono";
	src: url(../fonts/jetbrains-mono-greek-wght-normal.woff2) format("woff2-variations");
	font-weight: 100 800;
	font-display: swap;
	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

/* Tokens ------------------------------------------------------------------ */
:root {
	--bg: #f3f5f1;          /* porcelain */
	--bg-alt: #e3ebe4;      /* celadon slip */
	--surface: #ffffff;
	--ink: #0f1e3d;         /* cobalt ink */
	--ink-2: #46536d;
	--line: #c9d3cb;
	--line-soft: #dbe3dc;
	--cobalt: #2346c9;
	--cobalt-hover: #1a369e;
	--on-cobalt: #ffffff;
	--cobalt-tint: #e3e9fb;
	--ember: #ff9f2e;
	--ember-deep: #b85c00;
	--on-ember: #1b1206;
	--ok: #1c7a4c;
	--ok-tint: #dff1e6;
	--warn: #9a5200;
	--warn-tint: #fff0da;
	--bad: #c0392b;
	--deep: #0f1e3d;        /* dark bands */
	--deep-2: #172a52;
	--on-deep: #eef2fa;
	--on-deep-2: #aab6cf;

	/* The editor mock-ups are always dark, like the plugin's default theme. */
	--ed-bg: #161a22;
	--ed-panel: #1d222c;
	--ed-panel-2: #232936;
	--ed-line: #2c3340;
	--ed-text: #d5dae4;
	--ed-muted: #7d8699;
	--sx-tag: #8fa8ff;
	--sx-fn: #7fd6bd;
	--sx-str: #f5bf7a;
	--sx-kw: #c9a2ff;
	--sx-var: #ff9fb8;
	--sx-num: #f5bf7a;
	--sx-p: #a2abbd;

	--font: "CK Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
	--mono: "CK Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;

	--wrap: 1200px;
	--gutter: clamp(16px, 4vw, 40px);
	--section: clamp(72px, 9vw, 128px);
	--r-lg: 16px;
	--r-md: 10px;
	--r-sm: 6px;

	color-scheme: light;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		--bg: #0b1326;
		--bg-alt: #101c36;
		--surface: #13203d;
		--ink: #e9eef8;
		--ink-2: #a8b3ca;
		--line: #2a3a5c;
		--line-soft: #1f2d4a;
		--cobalt: #87a2ff;
		--cobalt-hover: #adc0ff;
		--on-cobalt: #0b1326;
		--cobalt-tint: #1a2a52;
		--ok: #6fd3a0;
		--ok-tint: #12352a;
		--warn: #ffc27a;
		--warn-tint: #3a2a12;
		--deep: #060c1a;
		--deep-2: #0f1a33;
		--ed-line: #333b4b;
		color-scheme: dark;
	}
}
:root[data-theme="dark"] {
	--bg: #0b1326;
	--bg-alt: #101c36;
	--surface: #13203d;
	--ink: #e9eef8;
	--ink-2: #a8b3ca;
	--line: #2a3a5c;
	--line-soft: #1f2d4a;
	--cobalt: #87a2ff;
	--cobalt-hover: #adc0ff;
	--on-cobalt: #0b1326;
	--cobalt-tint: #1a2a52;
	--ok: #6fd3a0;
	--ok-tint: #12352a;
	--warn: #ffc27a;
	--warn-tint: #3a2a12;
	--deep: #060c1a;
	--deep-2: #0f1a33;
	--ed-line: #333b4b;
	color-scheme: dark;
}

/* Base -------------------------------------------------------------------- */
*,
*::before,
*::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: 88px;
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
}

body {
	margin: 0;
	background: var(--bg);
	color: var(--ink);
	font-family: var(--font);
	font-size: 1.0625rem;
	line-height: 1.6;
	font-optical-sizing: auto;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
}

img, svg { display: block; max-width: 100%; }

h1, h2, h3, h4 {
	margin: 0;
	line-height: 1.08;
	font-weight: 780;
	letter-spacing: -0.02em;
	font-variation-settings: "FLAR" 100, "VOLM" 0;
	text-wrap: balance;
}
h2 { font-size: clamp(2rem, 1.35rem + 2.3vw, 3.25rem); }
h3 { font-size: 1.1875rem; line-height: 1.25; letter-spacing: -0.01em; font-weight: 720; font-variation-settings: "FLAR" 60; }
p { margin: 0 0 1em; text-wrap: pretty; }

a { color: var(--cobalt); text-underline-offset: 0.18em; text-decoration-thickness: 1px; }
a:hover { color: var(--cobalt-hover); text-decoration-thickness: 2px; }

code {
	font-family: var(--mono);
	font-size: 0.86em;
	background: var(--cobalt-tint);
	color: var(--ink);
	padding: 0.1em 0.35em;
	border-radius: 4px;
	overflow-wrap: anywhere;
}

:focus-visible {
	outline: 3px solid var(--cobalt);
	outline-offset: 3px;
	border-radius: 4px;
}

.ck-sr {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0);
	white-space: nowrap; border: 0;
}

.ck-skip {
	position: absolute; left: 16px; top: -100px; z-index: 100;
	background: var(--ink); color: var(--bg);
	padding: 10px 16px; border-radius: var(--r-md);
}
.ck-skip:focus { top: 12px; color: var(--bg); }

.ck-wrap {
	width: 100%;
	max-width: calc(var(--wrap) + var(--gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.ck-lede { font-size: clamp(1.0625rem, 1rem + 0.35vw, 1.25rem); color: var(--ink-2); max-width: 38em; }
.ck-fine { font-size: 0.875rem; color: var(--ink-2); }
.ck-note { font-size: 0.9375rem; color: var(--ink-2); border-left: 3px solid var(--line); padding-left: 14px; max-width: 34em; }
.ck-minor { font-size: 1rem; margin: 28px 0 12px; }

.ck-link {
	font-weight: 650;
	text-decoration: none;
	border-bottom: 2px solid currentColor;
	padding-bottom: 1px;
}
.ck-link:hover { text-decoration: none; }

/* Buttons ----------------------------------------------------------------- */
.ck-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 48px;
	padding: 12px 24px;
	border-radius: 999px;
	border: 2px solid transparent;
	font: inherit;
	font-weight: 680;
	font-size: 1rem;
	line-height: 1.1;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.ck-btn:hover { text-decoration: none; }
.ck-btn--small { min-height: 40px; padding: 8px 18px; font-size: 0.9375rem; }
.ck-btn--primary { background: var(--cobalt); color: var(--on-cobalt); }
.ck-btn--primary:hover { background: var(--cobalt-hover); color: var(--on-cobalt); }
.ck-btn--ghost { border-color: var(--ink); color: var(--ink); background: transparent; }
.ck-btn--ghost:hover { background: var(--ink); color: var(--bg); }
.ck-btn--ember { background: var(--ember); color: var(--on-ember); }
.ck-btn--ember:hover { background: #ffb65e; color: var(--on-ember); }
.ck-btn--ghost-light { border-color: var(--on-deep); color: var(--on-deep); }
.ck-btn--ghost-light:hover { background: var(--on-deep); color: var(--deep); }

/* Badges and pills */
.ck-badge {
	display: inline-block;
	vertical-align: 0.15em;
	margin-left: 8px;
	padding: 2px 8px;
	border-radius: var(--r-sm);
	font-size: 0.75rem;
	font-weight: 650;
	line-height: 1.5;
	letter-spacing: 0;
	background: var(--cobalt-tint);
	color: var(--cobalt);
	white-space: nowrap;
	font-variation-settings: normal;
}
.ck-badge--soon { background: var(--warn-tint); color: var(--warn); }

/* Logo -------------------------------------------------------------------- */
.ck-logo {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: var(--ink);
	text-decoration: none;
}
.ck-logo:hover { color: var(--ink); text-decoration: none; }
.ck-mark { width: 30px; height: 30px; flex: none; }
.ck-mark__body, .ck-cta__mark .ck-mark__body, .ckd-app__mark .ck-mark__body, .ck-import__mark .ck-mark__body { fill: currentColor; }
.ck-mark__glow { fill: var(--ember); }
.ck-mark__prompt { stroke: var(--deep); }
.ck-logo__word {
	font-size: 1.3125rem;
	font-weight: 800;
	letter-spacing: -0.03em;
	font-variation-settings: "FLAR" 100;
}

/* Offer bar and header ---------------------------------------------------- */
.ck-offer {
	background: var(--deep);
	color: var(--on-deep);
	font-size: 0.9063rem;
}
.ck-offer__text { margin: 0; padding-block: 9px; }
.ck-offer a { color: var(--ember); font-weight: 650; margin-left: 6px; }
.ck-offer a:hover { color: #ffc27a; }
.ck-offer a:focus-visible { outline-color: var(--ember); }

.ck-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: color-mix(in srgb, var(--bg) 88%, transparent);
	-webkit-backdrop-filter: saturate(1.4) blur(12px);
	backdrop-filter: saturate(1.4) blur(12px);
	border-bottom: 1px solid var(--line-soft);
}
.admin-bar .ck-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .ck-header { top: 0; } }

.ck-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	min-height: 68px;
}
.ck-nav { display: flex; align-items: center; gap: 28px; }
.ck-nav__list {
	display: flex;
	gap: 26px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ck-nav a { color: var(--ink); text-decoration: none; font-weight: 560; font-size: 0.9688rem; }
.ck-nav a:hover { color: var(--cobalt); }
.ck-nav .ck-btn--primary { color: var(--on-cobalt); }
.ck-nav__actions { display: flex; align-items: center; gap: 20px; }
.ck-nav__actions .ck-nav__try { color: var(--cobalt); }
.ck-nav .ck-nav__lang {
	font-size: 0.8125rem;
	font-weight: 650;
	letter-spacing: 0.04em;
	padding: 3px 7px;
	border: 1px solid var(--line);
	border-radius: 6px;
	color: var(--ink-2);
}
.ck-nav .ck-nav__lang:hover { border-color: var(--cobalt); }

.ck-menu-toggle {
	display: none;
	width: 44px; height: 44px;
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	background: transparent;
	color: var(--ink);
	cursor: pointer;
	align-items: center;
	justify-content: center;
}
.ck-menu-toggle__bars,
.ck-menu-toggle__bars::before,
.ck-menu-toggle__bars::after {
	display: block;
	width: 18px; height: 2px;
	background: currentColor;
	border-radius: 2px;
	position: relative;
	transition: transform .2s ease, background-color .2s ease;
}
.ck-menu-toggle__bars::before,
.ck-menu-toggle__bars::after { content: ""; position: absolute; left: 0; }
.ck-menu-toggle__bars::before { top: -6px; }
.ck-menu-toggle__bars::after { top: 6px; }
.ck-menu-toggle[aria-expanded="true"] .ck-menu-toggle__bars { background: transparent; }
.ck-menu-toggle[aria-expanded="true"] .ck-menu-toggle__bars::before { transform: translateY(6px) rotate(45deg); }
.ck-menu-toggle[aria-expanded="true"] .ck-menu-toggle__bars::after { transform: translateY(-6px) rotate(-45deg); }

@media (min-width: 1024px) {
	.ck-nav a { white-space: nowrap; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
	.ck-nav, .ck-nav__list { gap: 18px; }
	.ck-nav__actions { gap: 14px; }
	.ck-nav a { font-size: 0.9063rem; }
	.ck-header__inner { gap: 16px; }
	:lang(el) .ck-nav__login { display: none; }
}
@media (max-width: 1023px) {
	.ck-menu-toggle { display: inline-flex; }
	.ck-nav {
		display: none;
		position: absolute;
		left: 0; right: 0; top: 100%;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		padding: 8px var(--gutter) 24px;
		background: var(--bg);
		border-bottom: 1px solid var(--line);
	}
	.ck-nav.is-open { display: flex; }
	.ck-nav__list { flex-direction: column; gap: 0; }
	.ck-nav__list a { display: block; padding: 14px 0; border-bottom: 1px solid var(--line-soft); font-size: 1.0625rem; }
	.ck-nav__actions { flex-wrap: wrap; gap: 16px 24px; padding-top: 20px; }
	.ck-nav__actions .ck-btn { flex-basis: 100%; }
}

/* Sections ---------------------------------------------------------------- */
.ck-section { padding-block: var(--section); }
.ck-section__head { margin-bottom: clamp(40px, 5vw, 64px); max-width: 52rem; }
.ck-section__head h2 { margin-bottom: 20px; }

.ck-split {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
	gap: clamp(40px, 6vw, 88px);
	align-items: center;
}
.ck-split--top { align-items: start; }
.ck-split--flip .ck-split__text { order: 2; }
.ck-split--flip .ck-split__media { order: 1; }
.ck-split__text h2 { margin-bottom: 20px; }
.ck-split__media { margin: 0; min-width: 0; }
@media (max-width: 899px) {
	.ck-split { grid-template-columns: minmax(0, 1fr); }
	.ck-split--flip .ck-split__text,
	.ck-split--flip .ck-split__media { order: initial; }
}

.ck-ticks { list-style: none; margin: 24px 0; padding: 0; display: grid; gap: 12px; }
.ck-ticks li { position: relative; padding-left: 30px; max-width: 36em; }
.ck-ticks li::before {
	content: "";
	position: absolute; left: 2px; top: 0.42em;
	width: 14px; height: 8px;
	border-left: 2.5px solid var(--cobalt);
	border-bottom: 2.5px solid var(--cobalt);
	transform: rotate(-45deg);
}

/* Mock-up surfaces */
.ck-mock {
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	padding: clamp(18px, 2.5vw, 28px);
	box-shadow: 0 1px 0 var(--line-soft), 0 24px 48px -32px rgba(15, 30, 61, .35);
	font-size: 0.9375rem;
}
.ck-mock-btn {
	display: inline-block;
	padding: 8px 16px;
	border-radius: 999px;
	background: var(--cobalt);
	color: var(--on-cobalt);
	font-weight: 650;
	font-size: 0.875rem;
}
.ck-mock-btn--light { background: var(--surface); color: var(--bad); border: 1.5px solid var(--bad); }
.ck-pill {
	display: inline-block;
	padding: 2px 10px;
	border-radius: 999px;
	background: var(--bg-alt);
	color: var(--ink-2);
	font-size: 0.8125rem;
	font-weight: 600;
	white-space: nowrap;
}
.ck-pill--ok { background: var(--ok-tint); color: var(--ok); }
.ck-pill--warn { background: var(--warn-tint); color: var(--warn); }

/* Hero -------------------------------------------------------------------- */
.ck-hero { padding-top: clamp(48px, 7vw, 96px); }
.ck-hero__intro {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
	gap: clamp(28px, 5vw, 72px);
	align-items: end;
}
.ck-hero__title {
	font-size: clamp(2.6rem, 1.2rem + 5.2vw, 5.4rem);
	line-height: 0.98;
	letter-spacing: -0.028em;
	font-weight: 820;
	font-variation-settings: "FLAR" 100, "VOLM" 40;
}
.ck-hero__lede { font-size: clamp(1.0625rem, 1rem + 0.35vw, 1.25rem); color: var(--ink-2); }
.ck-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 28px 0 18px; }
.ck-hero__fine { font-size: 0.875rem; color: var(--ink-2); margin: 0; }
@media (max-width: 899px) {
	.ck-hero__intro { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 479px) {
	.ck-hero__actions .ck-btn { flex: 1 1 100%; }
}

.ck-hero__stage {
	margin-top: clamp(44px, 6vw, 80px);
	padding-inline: var(--gutter);
	background: linear-gradient(to bottom, var(--bg) 0 55%, var(--bg-alt) 55% 100%);
}

/* Editor demo ------------------------------------------------------------- */
.ck-demo {
	position: relative;
	max-width: 1280px;
	margin: 0 auto;
}
.ckd {
	background: var(--ed-bg);
	color: var(--ed-text);
	border-radius: 14px;
	border: 1px solid #0d1017;
	box-shadow:
		0 0 0 1px rgba(255, 255, 255, .04) inset,
		0 40px 80px -40px rgba(15, 30, 61, .55),
		0 12px 24px -12px rgba(15, 30, 61, .25);
	overflow: hidden;
	font-size: 13px;
}
.ckd-top {
	display: flex;
	align-items: center;
	gap: 16px;
	height: 44px;
	padding: 0 14px;
	background: var(--ed-panel);
	border-bottom: 1px solid var(--ed-line);
}
.ckd-dots { display: flex; gap: 6px; }
.ckd-dots i { width: 11px; height: 11px; border-radius: 50%; background: #3a4150; }
.ckd-app { display: flex; align-items: center; gap: 8px; font-weight: 700; color: #fff; font-size: 13px; }
.ckd-app__mark { width: 18px; height: 18px; color: #e9eef8; }
.ckd-app__mark .ck-mark__prompt { stroke: #161a22; }
.ckd-crumb { color: var(--ed-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ckd-crumb b { color: var(--ed-text); font-weight: 600; }
.ckd-toggle { margin-left: auto; display: flex; align-items: center; gap: 8px; color: var(--ed-muted); font-weight: 600; }
.ckd-toggle__track { width: 32px; height: 18px; border-radius: 999px; background: #3a4150; position: relative; transition: background-color .25s ease; }
.ckd-toggle__knob { position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: #c9cfdb; transition: transform .25s ease; }
.ckd-toggle.is-on .ckd-toggle__track { background: #2fa36b; }
.ckd-toggle.is-on .ckd-toggle__knob { transform: translateX(14px); background: #fff; }
.ckd-toggle.is-on .ckd-toggle__label { color: #7fe0ae; }

.ckd-body {
	display: grid;
	grid-template-columns: 232px minmax(0, 1fr) 244px;
	min-height: 360px;
}
.ckd-side {
	background: var(--ed-panel);
	border-right: 1px solid var(--ed-line);
	padding: 12px 10px;
}
.ckd-search {
	padding: 7px 10px;
	border: 1px solid var(--ed-line);
	border-radius: 6px;
	color: var(--ed-muted);
	margin-bottom: 12px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.ckd-tree, .ckd-tree ul { list-style: none; margin: 0; padding: 0; }
.ckd-folder { color: var(--ed-muted); font-weight: 600; padding: 5px 6px 5px 20px; position: relative; }
.ckd-folder::before {
	content: "";
	position: absolute; left: 6px; top: 11px;
	border: 4px solid transparent;
	border-left-color: var(--ed-muted);
}
.ckd-folder.is-open::before { transform: rotate(90deg); left: 4px; top: 12px; }
.ckd-folder ul { margin: 4px 0 4px -14px; }
.ckd-count { float: right; font-weight: 500; color: #5d6679; }
.ckd-item {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 5px 8px;
	border-radius: 6px;
	color: var(--ed-text);
	font-weight: 500;
	white-space: nowrap;
}
.ckd-item.is-active { background: #2a3350; }
.ckd-type { font-family: var(--mono); font-size: 10px; font-weight: 700; padding: 1px 4px; border-radius: 3px; width: 30px; text-align: center; flex: none; }
.ckd-type--php { background: #313a66; color: #aebdff; }
.ckd-type--css { background: #203f3a; color: #7fd6bd; }
.ckd-type--js { background: #4a3a1a; color: #f5bf7a; }
.ckd-dot { width: 7px; height: 7px; border-radius: 50%; background: #4a5263; margin-left: auto; flex: none; }
.ckd-dot.is-on { background: #3bc07f; }
.ckd-chip { margin-left: auto; font-size: 10px; padding: 1px 6px; border-radius: 4px; background: #3a2f48; color: #d4b8ff; }

.ckd-main { position: relative; min-width: 0; background: var(--ed-bg); }
.ckd-tabs { display: flex; height: 36px; background: var(--ed-panel); border-bottom: 1px solid var(--ed-line); }
.ckd-tab { padding: 0 16px; display: flex; align-items: center; color: var(--ed-muted); border-right: 1px solid var(--ed-line); font-family: var(--mono); font-size: 12px; white-space: nowrap; }
.ckd-tab.is-active { background: var(--ed-bg); color: var(--ed-text); box-shadow: inset 0 2px 0 var(--ember); }

.ckd-code {
	padding: 16px 0 24px;
	font-family: var(--mono);
	font-size: 13.5px;
	line-height: 1.75;
	font-variant-ligatures: none;
}
.ckd-line { display: flex; min-height: 1.75em; }
.ckd-ln { width: 48px; flex: none; text-align: right; padding-right: 18px; color: #4f586b; user-select: none; }
.ckd-src { white-space: pre-wrap; overflow-wrap: anywhere; min-width: 0; padding-right: 16px; }
.ckd-line.is-written { animation: ckd-written 1.8s ease-out; }
@keyframes ckd-written {
	0%, 35% { background: rgba(255, 159, 46, .16); }
	100% { background: transparent; }
}
.ckd-line.is-current { background: rgba(255, 255, 255, .03); }
.t-tag { color: var(--sx-tag); }
.t-fn { color: var(--sx-fn); }
.t-str { color: var(--sx-str); }
.t-kw { color: var(--sx-kw); }
.t-var { color: var(--sx-var); }
.t-num { color: var(--sx-num); }
.t-p { color: var(--sx-p); }

.ckd-caret {
	display: inline-block;
	width: 2px;
	height: 1.25em;
	vertical-align: -0.22em;
	margin-left: -1px;
	margin-right: -1px;
	background: var(--ember);
	animation: ckd-blink 1s steps(1) infinite;
}
.ckd-caret.is-typing { animation: none; }
@keyframes ckd-blink { 50% { opacity: 0; } }

.ckd-pop {
	position: absolute;
	z-index: 3;
	width: min(440px, calc(100% - 24px));
	background: var(--ed-panel-2);
	border: 1px solid #3a4356;
	border-radius: 8px;
	box-shadow: 0 16px 32px -8px rgba(0, 0, 0, .6);
	font-family: var(--mono);
	font-size: 12.5px;
	overflow: hidden;
}
.ckd-pop[hidden] { display: none; }
.ckd-pop__list { list-style: none; margin: 0; padding: 4px; }
.ckd-pop__list li { display: flex; align-items: center; gap: 10px; padding: 4px 8px; border-radius: 4px; color: var(--ed-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ckd-pop__list li.is-sel { background: #2c3f7a; }
.ckd-pop__list li.is-pressed { background: var(--cobalt); }
.ckd-pop__list mark { background: none; color: var(--ember); font-weight: 700; }
.ckd-pop__kind { font-family: var(--font); font-size: 10px; font-weight: 700; padding: 0 5px; border-radius: 3px; background: #3a2f48; color: #d4b8ff; flex: none; }
.ckd-pop__doc { border-top: 1px solid #3a4356; padding: 8px 12px 10px; display: grid; gap: 4px; }
.ckd-pop__doc code { background: none; color: var(--sx-fn); padding: 0; font-size: 12px; }
.ckd-pop__doc span { font-family: var(--font); color: var(--ed-muted); font-size: 12px; }

.ckd-note {
	position: absolute;
	right: 16px;
	bottom: 16px;
	padding: 6px 12px;
	border-radius: 999px;
	background: rgba(255, 159, 46, .14);
	border: 1px solid rgba(255, 159, 46, .5);
	color: #ffcf94;
	font-weight: 600;
	font-size: 12px;
}
.ckd-note[hidden] { display: none; }

.ckd-rules {
	background: var(--ed-panel);
	border-left: 1px solid var(--ed-line);
	padding: 16px 14px;
}
.ckd-rules__title { margin: 0 0 10px; color: var(--ed-muted); font-weight: 700; font-size: 12px; }
.ckd-rules__title--gap { margin-top: 22px; }
.ckd-rule {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 6px;
	align-items: baseline;
	padding: 8px 10px;
	border: 1px solid var(--ed-line);
	border-radius: 6px;
	background: var(--ed-bg);
	color: var(--ed-text);
	margin-bottom: 6px;
}
.ckd-rule b { color: var(--ed-muted); font-weight: 500; }
.ckd-val { color: #aebdff; font-weight: 600; }
.ckd-val--muted { color: var(--ed-muted); font-weight: 500; margin-left: auto; }
.ckd-and { margin: 2px 0 6px 10px; color: var(--ed-muted); font-size: 12px; }

.ckd-status {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	height: 28px;
	padding: 0 14px;
	align-items: center;
	background: var(--cobalt);
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	transition: background-color .3s ease;
}
:root[data-theme="dark"] .ckd-status { background: #2346c9; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .ckd-status { background: #2346c9; } }
.ckd-status.is-busy { background: #3a4150 !important; }
.ckd-status.is-ok { background: #1f7d52 !important; }
.ckd-status__state { display: flex; align-items: center; gap: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ckd-status__meta { opacity: .75; font-weight: 500; white-space: nowrap; }

.ckd-replay {
	position: absolute;
	right: 12px;
	bottom: -44px;
	font: inherit;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--ink-2);
	background: transparent;
	border: 0;
	padding: 6px 4px;
	cursor: pointer;
	text-decoration: underline;
	text-underline-offset: 0.2em;
}
.ckd-replay:hover { color: var(--cobalt); }
.ckd-replay[hidden] { display: none; }

@media (max-width: 1099px) {
	.ckd-body { grid-template-columns: 210px minmax(0, 1fr); }
	.ckd-rules { display: none; }
}
@media (max-width: 719px) {
	.ckd-body { grid-template-columns: minmax(0, 1fr); min-height: 300px; }
	.ckd-side, .ckd-crumb, .ckd-status__meta, .ckd-tab:not(.is-active) { display: none; }
	.ckd-code { font-size: 12.5px; }
	.ckd-ln { width: 34px; padding-right: 12px; }
	.ckd-note { left: 12px; right: auto; bottom: 12px; }
}

/* Switch ------------------------------------------------------------------ */
.ck-switch { background: var(--bg-alt); padding-top: clamp(96px, 11vw, 144px); }
.ck-sources {
	list-style: none;
	margin: 0 0 24px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.ck-sources li {
	padding: 6px 14px;
	border-radius: 999px;
	background: var(--surface);
	border: 1px solid var(--line);
	font-weight: 600;
	font-size: 0.9375rem;
}

.ck-import__hint {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 14px;
	border-radius: var(--r-md);
	background: var(--cobalt-tint);
	margin-bottom: 18px;
}
.ck-import__hint span { color: var(--ink); }
.ck-import__hint span strong { font-weight: 700; }
.ck-import__mark { width: 22px; height: 22px; color: var(--ink); }
.ck-import__table { width: 100%; border-collapse: collapse; }
.ck-import__table th {
	text-align: left;
	font-size: 0.8125rem;
	font-weight: 650;
	color: var(--ink-2);
	padding: 0 8px 8px 0;
	border-bottom: 1px solid var(--line);
}
.ck-import__table td { padding: 11px 8px 11px 0; border-bottom: 1px solid var(--line-soft); vertical-align: middle; }
.ck-import__table td:first-child { font-weight: 600; }
.ck-import__table td:nth-child(2), .ck-import__table th:nth-child(2) { text-align: right; padding-right: 20px; font-variant-numeric: tabular-nums; }
.ck-import__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-top: 18px; }
.ck-import__fine { font-size: 0.8125rem; color: var(--ink-2); }
@media (max-width: 479px) {
	.ck-import__table td:nth-child(2), .ck-import__table th:nth-child(2) { display: none; }
}

/* Safe -------------------------------------------------------------------- */
.ck-steps {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: ck-step;
}
.ck-steps__item {
	position: relative;
	padding: 0 0 32px 64px;
	counter-increment: ck-step;
}
.ck-steps__item::before {
	content: counter(ck-step);
	position: absolute;
	left: 0; top: -4px;
	width: 40px; height: 40px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--ink);
	color: var(--bg);
	font-weight: 800;
	font-size: 1.0625rem;
	font-variation-settings: "FLAR" 100;
}
.ck-steps__item::after {
	content: "";
	position: absolute;
	left: 19px; top: 40px; bottom: 4px;
	width: 2px;
	background: var(--line);
}
.ck-steps__item:last-child { padding-bottom: 0; }
.ck-steps__item:last-child::after { display: none; }
.ck-steps__item:last-child::before { background: var(--ember); color: var(--on-ember); }
.ck-steps__item h3 { margin-bottom: 6px; }
.ck-steps__item p { color: var(--ink-2); margin: 0; max-width: 34em; }

.ck-crash { padding: 0; overflow: hidden; }
.ck-crash__notice {
	padding: 20px 22px 22px;
	border-left: 4px solid var(--bad);
}
.ck-crash__title { font-weight: 750; margin-bottom: 8px; font-size: 1rem; }
.ck-crash__msg { color: var(--ink-2); margin-bottom: 10px; }
.ck-crash__msg code { background: #fbe4e1; color: #8c2318; }
:root[data-theme="dark"] .ck-crash__msg code { background: #4a1f1b; color: #ffb4aa; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .ck-crash__msg code { background: #4a1f1b; color: #ffb4aa; } }
.ck-crash__code {
	background: var(--ed-bg);
	color: var(--ed-text);
	font-family: var(--mono);
	font-size: 13px;
	line-height: 1.8;
	padding: 14px 0;
}
.ck-crash__code .ckd-line.is-error { background: rgba(192, 57, 43, .22); box-shadow: inset 3px 0 0 #ff6b5b; }
.ck-crash__code .ckd-line.is-error .ckd-ln { color: #ff9a8f; }
.ck-squiggle {
	text-decoration: underline wavy #ff6b5b;
	text-decoration-thickness: 1.5px;
	text-underline-offset: 4px;
}

/* Fast (dark band) -------------------------------------------------------- */
.ck-fast { background: var(--deep); color: var(--on-deep); }
.ck-fast .ck-lede, .ck-fast .ck-ticks li { color: var(--on-deep-2); }
.ck-fast .ck-ticks li::before { border-color: var(--ember); }
.ck-fast :focus-visible { outline-color: var(--ember); }

.ck-flow { position: relative; }
.ck-flow__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 28px; }
.ck-flow__step {
	position: relative;
	display: grid;
	gap: 4px;
	padding: 18px 20px;
	border: 1px solid #2c3f6b;
	border-radius: var(--r-lg);
	background: var(--deep-2);
}
.ck-flow__step + .ck-flow__step::before {
	content: "";
	position: absolute;
	left: 32px; top: -29px;
	width: 2px; height: 28px;
	background: repeating-linear-gradient(to bottom, #5a6f9e 0 4px, transparent 4px 8px);
}
.ck-flow__label { font-weight: 720; font-size: 1.0625rem; color: var(--on-deep); }
.ck-flow__sub { color: var(--on-deep-2); font-size: 0.9375rem; font-family: var(--mono); font-size: 0.8125rem; }
.ck-flow__step--hot {
	border-color: rgba(255, 159, 46, .7);
	background: radial-gradient(120% 140% at 0% 0%, rgba(255, 159, 46, .22), transparent 60%), var(--deep-2);
}
.ck-flow__files { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.ck-flow__files code { background: #1f3260; color: #d6e0ff; font-size: 0.78rem; }
.ck-flow__db {
	display: flex;
	align-items: baseline;
	gap: 12px;
	margin: 28px 0 0;
	padding-top: 20px;
	border-top: 1px solid #2c3f6b;
	color: var(--on-deep-2);
	font-weight: 600;
	font-size: 1.0625rem;
}
.ck-flow__zero {
	font-size: 3.5rem;
	line-height: 1;
	font-weight: 850;
	color: var(--ember);
	font-variation-settings: "FLAR" 100, "VOLM" 60;
	text-shadow: 0 0 32px rgba(255, 159, 46, .45);
}

/* Conditions -------------------------------------------------------------- */
.ck-rulelist {
	list-style: none;
	margin: 24px 0;
	padding: 0;
	columns: 2;
	column-gap: 28px;
}
.ck-rulelist li {
	break-inside: avoid;
	padding: 8px 0;
	border-bottom: 1px solid var(--line-soft);
	font-weight: 560;
	font-size: 0.9688rem;
}
@media (max-width: 479px) { .ck-rulelist { columns: 1; } }

.ck-rules__title { font-weight: 750; margin-bottom: 14px; }
.ck-rules__group {
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	padding: 12px;
	background: var(--bg);
}
.ck-rules__row {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 0.9fr) minmax(0, 1.2fr);
	gap: 8px;
	align-items: center;
}
.ck-rules__row > span {
	padding: 8px 10px;
	border-radius: var(--r-sm);
	background: var(--surface);
	border: 1px solid var(--line-soft);
	font-size: 0.875rem;
	min-width: 0;
	overflow-wrap: anywhere;
}
.ck-rules__field { font-weight: 650; }
.ck-rules__op { color: var(--ink-2); }
.ck-rules__val { color: var(--cobalt); font-weight: 650; }
.ck-rules__join { font-size: 0.8125rem; color: var(--ink-2); font-weight: 650; margin: 8px 0 8px 4px; }
.ck-rules__or {
	display: flex; align-items: center; gap: 12px;
	margin: 12px 0;
	font-size: 0.8125rem; font-weight: 700; color: var(--ink-2);
}
.ck-rules__or::before, .ck-rules__or::after { content: ""; height: 1px; flex: 1; background: var(--line); }
.ck-rules__warn {
	margin-top: 16px;
	padding: 12px 14px;
	border-radius: var(--r-md);
	background: var(--warn-tint);
	color: var(--ink);
	font-size: 0.875rem;
	line-height: 1.5;
}
.ck-rules__warn strong { color: var(--warn); }
@media (max-width: 479px) {
	.ck-rules__row { grid-template-columns: minmax(0, 1fr); gap: 4px; }
}

/* Features ---------------------------------------------------------------- */
.ck-features { background: var(--bg-alt); }
.ck-groups {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(32px, 4vw, 56px);
}
@media (max-width: 899px) { .ck-groups { grid-template-columns: minmax(0, 1fr); } }
.ck-group__title {
	font-size: 1.375rem;
	padding-top: 16px;
	border-top: 3px solid var(--ink);
	margin-bottom: 8px;
}
.ck-group__list { margin: 0; }
.ck-group__item { padding: 16px 0; border-bottom: 1px solid var(--line); }
.ck-group__item dt { font-weight: 700; margin-bottom: 4px; }
.ck-group__item dd { margin: 0; color: var(--ink-2); font-size: 0.9688rem; }

.ck-soon {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 12px 28px;
	margin-top: 56px;
	padding: 24px 0 0;
	border-top: 1px dashed var(--ink-2);
}
.ck-soon__title { font-size: 1.0625rem; }
.ck-soon__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; flex: 1 1 520px; color: var(--ink-2); }
.ck-soon__list li { font-size: 0.9375rem; }

/* Proof ------------------------------------------------------------------- */
.ck-proof__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr);
	gap: clamp(32px, 6vw, 88px);
	align-items: start;
}
@media (max-width: 899px) { .ck-proof__inner { grid-template-columns: minmax(0, 1fr); } }
.ck-proof__head h2 { margin-bottom: 20px; }
.ck-proof__claim {
	margin: 0 0 28px;
	padding: 0 0 0 24px;
	border-left: 4px solid var(--ember);
}
.ck-proof__claim p {
	font-size: clamp(1.25rem, 1.05rem + 0.8vw, 1.625rem);
	line-height: 1.4;
	font-weight: 560;
	letter-spacing: -0.01em;
	margin: 0;
}
.ck-proof__facts { margin: 0 0 24px; padding-left: 20px; color: var(--ink-2); display: grid; gap: 8px; }
.ck-proof__ask { font-weight: 560; }

/* Compare ----------------------------------------------------------------- */
.ck-compare { padding-top: 0; }
.ck-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.ck-table { width: 100%; min-width: 620px; border-collapse: collapse; }
.ck-table th, .ck-table td { text-align: left; padding: 16px 18px; border-bottom: 1px solid var(--line); vertical-align: top; }
.ck-table thead th { font-size: 1.0625rem; font-weight: 750; border-bottom: 2px solid var(--ink); }
.ck-table tbody th { font-weight: 600; width: 34%; }
.ck-table td { color: var(--ink-2); width: 33%; }
.ck-table .ck-table__us { background: var(--cobalt-tint); color: var(--ink); font-weight: 650; }
.ck-table thead .ck-table__us { border-radius: var(--r-md) var(--r-md) 0 0; }
@media (max-width: 639px) {
	.ck-table { min-width: 0; }
	.ck-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.ck-table tr { display: block; padding: 16px 0; border-bottom: 1px solid var(--line); }
	.ck-table tbody tr:first-child { border-top: 2px solid var(--ink); }
	.ck-table th, .ck-table td { display: block; width: auto !important; padding: 0; border: 0; }
	.ck-table tbody th { margin-bottom: 8px; }
	.ck-table td { padding: 8px 12px; border-radius: var(--r-sm); font-size: 0.9375rem; }
	.ck-table td + td { margin-top: 4px; }
	.ck-table td::before { content: attr(data-label); display: block; font-size: 0.75rem; font-weight: 700; color: var(--ink-2); }
}
.ck-compare__foot { margin-top: 28px; display: grid; gap: 4px; max-width: 48rem; }
.ck-compare__foot .ck-link { justify-self: start; margin-top: 12px; }

/* Pricing ----------------------------------------------------------------- */
.ck-pricing { background: var(--bg-alt); }
.ck-lifetime {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) auto;
	gap: 24px 48px;
	align-items: center;
	padding: clamp(24px, 4vw, 40px);
	margin-bottom: 24px;
	border-radius: var(--r-lg);
	background:
		radial-gradient(90% 160% at 100% 100%, rgba(255, 159, 46, .28), transparent 55%),
		var(--deep);
	color: var(--on-deep);
}
.ck-lifetime__title { font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); margin-bottom: 10px; }
.ck-lifetime p { color: var(--on-deep-2); margin: 0; max-width: 36em; }
.ck-lifetime .ck-lifetime__left { margin-top: 10px; color: var(--ember); font-weight: 650; }
.ck-lifetime__buy { display: grid; gap: 14px; justify-items: start; }
.ck-lifetime .ck-price { color: var(--on-deep); }
.ck-lifetime .ck-price__per { color: var(--on-deep-2); }
.ck-lifetime :focus-visible { outline-color: var(--ember); }
@media (max-width: 719px) { .ck-lifetime { grid-template-columns: minmax(0, 1fr); } }

.ck-plans {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}
@media (max-width: 899px) { .ck-plans { grid-template-columns: minmax(0, 1fr); } }
.ck-plan {
	display: flex;
	flex-direction: column;
	padding: 24px;
	border-radius: var(--r-lg);
	background: var(--surface);
	border: 1px solid var(--line);
}
.ck-plan--agency { border: 2px solid var(--ink); }
.ck-plan__name { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font-size: 1.375rem; margin-bottom: 12px; }
.ck-plan__sites { font-size: 1rem; font-weight: 650; color: var(--cobalt); letter-spacing: 0; font-variation-settings: normal; }
.ck-price { display: flex; align-items: baseline; gap: 2px; margin: 0 0 4px; }
.ck-price__cur { font-size: 1.25rem; font-weight: 700; align-self: flex-start; margin-top: 0.35em; }
.ck-price__num { font-size: 3rem; line-height: 1; font-weight: 820; letter-spacing: -0.03em; font-variation-settings: "FLAR" 100; font-variant-numeric: tabular-nums; }
.ck-price__per { margin-left: 8px; color: var(--ink-2); font-weight: 560; }
.ck-plan__trial {
	align-self: flex-start;
	margin: 10px 0 0;
	padding: 3px 12px;
	border-radius: 999px;
	background: var(--ember);
	color: var(--on-ember);
	font-size: 0.875rem;
	font-weight: 700;
}
.ck-plan__lead { margin: 18px 0 0; padding-top: 16px; border-top: 1px solid var(--line-soft); font-weight: 700; }
.ck-plan__list { list-style: none; margin: 10px 0 24px; padding: 0; display: grid; gap: 8px; flex: 1; align-content: start; }
.ck-plan__list li { font-size: 0.9375rem; color: var(--ink-2); padding-left: 22px; position: relative; }
.ck-plan__list li::before {
	content: "";
	position: absolute; left: 2px; top: 0.45em;
	width: 11px; height: 6px;
	border-left: 2px solid var(--ok);
	border-bottom: 2px solid var(--ok);
	transform: rotate(-45deg);
}
.ck-plan__buy { display: grid; gap: 10px; justify-items: center; }
.ck-plan .ck-btn { width: 100%; white-space: normal; text-align: center; }
.ck-plan__alt { font-weight: 600; font-size: 0.9375rem; }
a.ck-btn[aria-busy="true"] { cursor: progress; opacity: .8; }

.ck-freeplan {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px 32px;
	margin-top: 16px;
	padding: 20px 24px;
	border-radius: var(--r-lg);
	border: 1px dashed var(--ink-2);
}
.ck-freeplan__title { font-size: 1.125rem; margin-bottom: 8px; }
.ck-freeplan__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 22px; color: var(--ink-2); font-size: 0.9375rem; }
.ck-freeplan__list li { position: relative; padding-left: 16px; }
.ck-freeplan__list li::before { content: ""; position: absolute; left: 0; top: 0.6em; width: 6px; height: 6px; border-radius: 50%; background: var(--ok); }
.ck-pricing__fine { margin-top: 20px; max-width: 52rem; }

/* FAQ --------------------------------------------------------------------- */
.ck-faq__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr);
	gap: clamp(32px, 6vw, 88px);
	align-items: start;
}
@media (max-width: 899px) { .ck-faq__inner { grid-template-columns: minmax(0, 1fr); } }
.ck-faq__list { border-top: 1px solid var(--line); }
.ck-faq__item { border-bottom: 1px solid var(--line); }
.ck-faq__item summary {
	list-style: none;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	gap: 24px;
	padding: 20px 0;
	font-weight: 680;
	font-size: 1.0938rem;
}
.ck-faq__item summary::-webkit-details-marker { display: none; }
.ck-faq__item summary::after {
	content: "";
	flex: none;
	width: 14px; height: 14px;
	margin-top: 0.35em;
	background:
		linear-gradient(var(--ink), var(--ink)) center / 14px 2px no-repeat,
		linear-gradient(var(--ink), var(--ink)) center / 2px 14px no-repeat;
	transition: transform .2s ease;
}
.ck-faq__item[open] summary::after { transform: rotate(45deg); }
.ck-faq__item summary:hover { color: var(--cobalt); }
.ck-faq__item p { margin: -4px 0 22px; color: var(--ink-2); max-width: 40em; }

/* CTA --------------------------------------------------------------------- */
.ck-cta {
	background:
		radial-gradient(60% 120% at 0% 100%, rgba(255, 159, 46, .24), transparent 60%),
		var(--deep);
	color: var(--on-deep);
	padding-block: clamp(72px, 9vw, 120px);
}
.ck-cta__inner { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: clamp(24px, 4vw, 56px); align-items: center; }
.ck-cta__mark { width: clamp(88px, 12vw, 160px); height: auto; color: #2f5be0; grid-row: span 3; filter: drop-shadow(0 0 40px rgba(255, 159, 46, .35)); }
.ck-cta__mark .ck-mark__prompt { stroke: var(--deep); }
.ck-cta h2 { margin-bottom: 14px; }
.ck-cta .ck-lede { color: var(--on-deep-2); margin: 0; }
.ck-cta .ck-hero__actions { margin-bottom: 0; }
.ck-cta :focus-visible { outline-color: var(--ember); }
@media (max-width: 599px) {
	.ck-cta__inner { grid-template-columns: minmax(0, 1fr); }
	.ck-cta__mark { grid-row: auto; width: 72px; margin-bottom: 24px; }
}

/* Footer ------------------------------------------------------------------ */
.ck-footer { padding: 72px 0 32px; border-top: 1px solid var(--line); font-size: 0.9375rem; }
.ck-footer__top {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) repeat(4, minmax(0, 1fr));
	gap: 40px 32px;
}
@media (max-width: 1023px) { .ck-footer__top { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ck-footer__brand { grid-column: 1 / -1; } }
.ck-footer__tagline { margin: 16px 0 8px; font-weight: 750; font-size: 1.125rem; font-variation-settings: "FLAR" 100; }
.ck-footer__blurb { color: var(--ink-2); max-width: 26em; }
.ck-footer__heading { font-size: 0.9375rem; font-weight: 750; margin-bottom: 12px; letter-spacing: 0; font-variation-settings: normal; }
.ck-footer__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ck-footer__col a { color: var(--ink-2); text-decoration: none; }
.ck-footer__col a:hover { color: var(--cobalt); text-decoration: underline; }
.ck-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 16px;
	margin-top: 56px;
	padding-top: 24px;
	border-top: 1px solid var(--line-soft);
	color: var(--ink-2);
	font-size: 0.875rem;
}
.ck-footer__bottom p { margin: 0; }
.ck-footer__legal { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: center; }
.ck-footer__legal a { color: var(--ink-2); }
.ck-theme-toggle {
	font: inherit;
	color: var(--ink-2);
	background: transparent;
	border: 1px solid var(--line);
	border-radius: 999px;
	padding: 4px 12px;
	cursor: pointer;
}
.ck-theme-toggle:hover { color: var(--ink); border-color: var(--ink-2); }

/* Generic pages ----------------------------------------------------------- */
.ck-page { padding-block: var(--section); }
.ck-prose { max-width: 46rem; }
.ck-prose h1 { font-size: clamp(2.25rem, 1.5rem + 3vw, 3.5rem); margin-bottom: 24px; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}

/* ==========================================================================
   Compare page
   ========================================================================== */

/* Page intro (shared by inner pages) */
.ck-phero { padding-block: clamp(48px, 7vw, 96px) clamp(40px, 5vw, 64px); }
.ck-phero .ck-wrap {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
	gap: 32px clamp(28px, 5vw, 72px);
	align-items: end;
}
.ck-phero__title {
	font-size: clamp(2.4rem, 1.3rem + 4vw, 4.25rem);
	line-height: 1;
	letter-spacing: -0.028em;
	font-weight: 820;
	font-variation-settings: "FLAR" 100, "VOLM" 40;
}
.ck-phero__side .ck-lede { margin-bottom: 16px; }
.ck-phero__content, .ck-jump { grid-column: 1 / -1; }
@media (max-width: 899px) { .ck-phero .ck-wrap { grid-template-columns: minmax(0, 1fr); } }

.ck-checked { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin: 0; font-size: 0.9375rem; }
.ck-checked__date {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 4px 12px;
	border-radius: 999px;
	background: var(--ok-tint);
	color: var(--ok);
	font-weight: 650;
}
.ck-checked__date::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }

.ck-jump { padding-top: 24px; border-top: 1px solid var(--line); }
.ck-jump ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.ck-jump a {
	display: inline-block;
	padding: 8px 16px;
	border: 1px solid var(--line);
	border-radius: 999px;
	color: var(--ink);
	text-decoration: none;
	font-weight: 600;
	font-size: 0.9375rem;
	background: var(--surface);
}
.ck-jump a:hover { border-color: var(--ink); color: var(--ink); }

/* Which one fits */
.ck-fit { background: var(--bg-alt); }
.ck-fit__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr);
	gap: clamp(32px, 6vw, 88px);
	align-items: start;
}
.ck-fit__inner h2 { margin-bottom: 20px; }
@media (max-width: 899px) { .ck-fit__inner { grid-template-columns: minmax(0, 1fr); } }
.ck-fit__list { margin: 0; border-top: 1px solid var(--line); }
.ck-fit__item {
	display: grid;
	grid-template-columns: minmax(0, 13rem) minmax(0, 1fr);
	gap: 4px 24px;
	padding: 18px 0;
	border-bottom: 1px solid var(--line);
}
.ck-fit__item dt { font-weight: 750; }
.ck-fit__item dd { margin: 0; color: var(--ink-2); }
.ck-fit__item--us {
	margin-top: 12px;
	padding: 20px;
	border: 0;
	border-radius: var(--r-lg);
	background: var(--deep);
	color: var(--on-deep);
}
.ck-fit__item--us dd { color: var(--on-deep-2); }
.ck-fit__item--us dt { color: var(--ember); }
@media (max-width: 599px) { .ck-fit__item { grid-template-columns: minmax(0, 1fr); } }

/* State marks, used in the matrix and its legend */
.ck-state { display: inline-flex; align-items: flex-start; gap: 8px; }
.ck-state::before {
	flex: none;
	display: inline-grid;
	place-items: center;
	width: 18px;
	height: 18px;
	margin-top: 0.12em;
	border-radius: 50%;
	font-size: 11.5px;
	font-weight: 800;
	line-height: 1;
	font-family: var(--font);
}
.ck-state--yes::before { content: "✓"; background: var(--ok); color: var(--bg); }
.ck-state--paid::before { content: "$"; background: var(--cobalt-tint); color: var(--cobalt); }
.ck-state--partial::before { content: ""; border: 2px solid var(--warn); background: linear-gradient(90deg, var(--warn) 50%, transparent 50%); width: 16px; height: 16px; }
.ck-state--no::before { content: "–"; background: var(--line-soft); color: var(--ink-2); }
.ck-state--unknown { color: var(--ink-2); }
.ck-state--unknown::before { content: "?"; border: 1.5px dashed var(--ink-2); color: var(--ink-2); width: 16px; height: 16px; }
.ck-state--soon::before { content: "…"; background: var(--warn-tint); color: var(--warn); }
.ck-state--na { color: var(--ink-2); }
.ck-state--note::before, .ck-state--na::before { display: none; }

.ck-legend {
	list-style: none;
	margin: 0 0 28px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 24px;
	font-size: 0.9375rem;
}
.ck-legend__item { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.ck-legend__item--unknown { flex-basis: 100%; }
.ck-legend__help { color: var(--ink-2); font-size: 0.875rem; }

/* Matrix tables */
.ck-matrix { font-size: 0.9375rem; }
.ck-matrix__table { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
.ck-matrix__table th,
.ck-matrix__table td {
	text-align: left;
	vertical-align: top;
	padding: 14px 14px;
	border-bottom: 1px solid var(--line-soft);
	overflow-wrap: anywhere;
}
.ck-matrix__table thead th {
	position: sticky;
	top: 68px;
	z-index: 2;
	background: var(--bg);
	border-bottom: 2px solid var(--ink);
	font-size: 1rem;
	font-weight: 750;
	vertical-align: bottom;
}
.ck-prices .ck-matrix__table thead th { background: var(--bg-alt); }
.ck-matrix__corner { width: 22%; }
.ck-matrix__table tbody th { font-weight: 620; color: var(--ink); }
.ck-matrix__table td { color: var(--ink); }
.ck-matrix__table .ck-matrix__us { background: var(--cobalt-tint); font-weight: 600; }
.ck-matrix__table thead .ck-matrix__us { background: var(--cobalt-tint); border-radius: var(--r-md) var(--r-md) 0 0; }
.ck-matrix__help { display: block; margin-top: 4px; font-weight: 450; font-size: 0.8438rem; color: var(--ink-2); }
.ck-matrix__group th {
	padding-top: 36px;
	border-bottom: 1px solid var(--ink);
	font-size: 1.125rem;
	font-weight: 780;
	font-variation-settings: "FLAR" 100;
	letter-spacing: -0.01em;
	background: transparent;
}
.ck-matrix__table tbody:first-of-type .ck-matrix__group th { padding-top: 20px; }

.ck-picker { display: none; }
@media (max-width: 899px) {
	.ck-matrix { overflow-x: auto; -webkit-overflow-scrolling: touch; }
	.ck-matrix__table { min-width: 860px; }
	.ck-matrix[data-show] { overflow: visible; }
	/* One competitor at a time: each row becomes a label line over two cells. */
	.ck-matrix[data-show] .ck-matrix__table,
	.ck-matrix[data-show] thead,
	.ck-matrix[data-show] tbody { display: block; min-width: 0; }
	.ck-matrix[data-show] tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.ck-matrix[data-show] tr > * { display: block; width: auto; }
	.ck-matrix[data-show] thead {
		position: sticky;
		top: 68px;
		z-index: 2;
		background: var(--bg);
	}
	.ck-matrix[data-show] thead th { position: static; }
	.ck-matrix[data-show] .ck-matrix__corner { display: none; }
	.ck-matrix[data-show] tbody th[scope="row"],
	.ck-matrix[data-show] .ck-matrix__group th { grid-column: 1 / -1; }
	.ck-matrix[data-show] tbody th[scope="row"] { border-bottom: 0; padding: 16px 0 6px; }
	.ck-matrix[data-show] .ck-matrix__group th { padding: 28px 0 10px; }
	.ck-matrix[data-show] td { padding-top: 10px; padding-bottom: 12px; }
	.ck-prices .ck-matrix[data-show] thead { background: var(--bg-alt); }
	.ck-matrix[data-show="wcb"] [data-col]:not([data-col="us"]):not([data-col="wcb"]),
	.ck-matrix[data-show="wpcode"] [data-col]:not([data-col="us"]):not([data-col="wpcode"]),
	.ck-matrix[data-show="cs"] [data-col]:not([data-col="us"]):not([data-col="cs"]),
	.ck-matrix[data-show="fs"] [data-col]:not([data-col="us"]):not([data-col="fs"]) { display: none; }
	.ck-matrix__table th, .ck-matrix__table td { padding: 12px 10px; }
	.ck-picker:not([hidden]) { display: grid; gap: 10px; margin-bottom: 20px; }
	.ck-picker__label { font-weight: 700; font-size: 0.9375rem; }
	.ck-picker__opts { display: flex; flex-wrap: wrap; gap: 8px; }
	.ck-picker__opt {
		font: inherit;
		font-size: 0.9375rem;
		font-weight: 600;
		padding: 8px 14px;
		min-height: 40px;
		border-radius: 999px;
		border: 1px solid var(--line);
		background: var(--surface);
		color: var(--ink);
		cursor: pointer;
	}
	.ck-picker__opt[aria-pressed="true"] { background: var(--ink); color: var(--bg); border-color: var(--ink); }
}
@media (max-width: 1023px) { .ck-matrix__table thead th { top: 68px; } }

/* Prices */
.ck-prices { background: var(--bg-alt); }
.ck-matrix--prices .ck-matrix__table td { font-variant-numeric: tabular-nums; }
.ck-prices__notes { margin: 24px 0 0; padding-left: 20px; display: grid; gap: 6px; color: var(--ink-2); font-size: 0.875rem; max-width: 52rem; }

/* Coming from WPCodeBox (dark band) */
.ck-from { background: var(--deep); color: var(--on-deep); }
.ck-from .ck-lede { color: var(--on-deep-2); }
.ck-from :focus-visible { outline-color: var(--ember); }
.ck-from__cols {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(24px, 4vw, 48px);
}
@media (max-width: 899px) { .ck-from__cols { grid-template-columns: minmax(0, 1fr); } }
.ck-from__col { padding-top: 16px; border-top: 2px solid #3a4d7a; }
.ck-from__col--gain { border-top-color: var(--ember); }
.ck-from__col h3 { margin-bottom: 16px; font-size: 1.25rem; }
.ck-from__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.ck-from__list li { position: relative; padding-left: 28px; color: var(--on-deep-2); }
.ck-from__list li::before {
	position: absolute;
	left: 0;
	top: 0.2em;
	width: 18px;
	height: 18px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	font-size: 12px;
	font-weight: 800;
	line-height: 1;
}
.ck-from__list--same li::before { content: "="; background: #22345e; color: #aebdff; }
.ck-from__list--gain li { color: var(--on-deep); }
.ck-from__list--gain li::before { content: "+"; background: var(--ember); color: var(--on-ember); }
.ck-from__list--lose li::before { content: "–"; background: #2a2f3d; color: var(--on-deep-2); }
.ck-from__next { margin: 40px 0 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 20px; color: var(--on-deep-2); }
.ck-from .ck-link { color: var(--on-deep); border-bottom-color: var(--ember); }
.ck-from .ck-link:hover { color: var(--ember); }

/* How we checked */
.ck-method__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr);
	gap: clamp(32px, 6vw, 88px);
	align-items: start;
}
@media (max-width: 899px) { .ck-method__inner { grid-template-columns: minmax(0, 1fr); } }
.ck-method__body { max-width: 44rem; }
.ck-method__body > p { color: var(--ink-2); }
.ck-method__list { list-style: none; margin: 24px 0; padding: 0; border-top: 1px solid var(--line); }
.ck-method__list li { display: grid; grid-template-columns: minmax(0, 10rem) minmax(0, 1fr); gap: 2px 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.ck-method__ver { grid-column: 1; font-size: 0.8125rem; color: var(--ink-2); }
.ck-method__links { grid-column: 2; grid-row: 1 / span 2; display: flex; flex-direction: column; gap: 2px; font-size: 0.875rem; overflow-wrap: anywhere; }
@media (max-width: 599px) {
	.ck-method__list li { grid-template-columns: minmax(0, 1fr); }
	.ck-method__links { grid-column: 1; grid-row: auto; }
}

/* ==========================================================================
   Pricing page
   ========================================================================== */
.ck-pricing-page .ck-pricing { padding-top: 0; background: var(--bg); }
.ck-pricing-page .ck-plan { background: var(--surface); }
.ck-planmatrix { background: var(--bg-alt); }
.ck-matrix--plans .ck-matrix__corner { width: 46%; }
.ck-matrix--plans td { text-align: center; }
.ck-matrix--plans thead th[scope="col"]:not(.ck-matrix__corner) { text-align: center; }
.ck-matrix--plans thead th { background: var(--bg-alt); }
.ck-matrix--plans .ck-state { justify-content: center; }
.ck-state--icon { gap: 0; }
.ck-state--icon::before { margin-top: 0; }
.ck-state--icon.ck-state--no::before { content: "–"; background: transparent; color: var(--ink-2); font-size: 16px; }
@media (max-width: 899px) {
	.ck-matrix--plans { overflow: visible; }
	.ck-matrix--plans .ck-matrix__table { min-width: 0; }
	.ck-matrix--plans .ck-matrix__corner { width: 40%; }
	.ck-matrix--plans th, .ck-matrix--plans td { padding: 10px 6px; font-size: 0.875rem; }
}
.ck-planmatrix__soon { margin-top: 20px; }

.ck-guarantee__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
	gap: clamp(32px, 6vw, 88px);
	align-items: start;
}
@media (max-width: 899px) { .ck-guarantee__inner { grid-template-columns: minmax(0, 1fr); } }
.ck-guarantee__card {
	padding: clamp(24px, 4vw, 40px);
	border-radius: var(--r-lg);
	background:
		radial-gradient(90% 140% at 100% 0%, rgba(255, 159, 46, .22), transparent 55%),
		var(--deep);
	color: var(--on-deep);
}
.ck-guarantee__card h2 { font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.5rem); margin: 20px 0 14px; }
.ck-guarantee__card p { color: var(--on-deep-2); }
.ck-guarantee__mark { width: 56px; height: 56px; color: #2f5be0; }
.ck-guarantee__mark .ck-mark__prompt { stroke: var(--deep); }
.ck-guarantee__sign {
	margin: 24px 0 0;
	padding-top: 16px;
	border-top: 1px solid #2c3f6b;
	font-weight: 700;
	color: var(--on-deep) !important;
	font-variation-settings: "FLAR" 100;
}
.ck-guarantee__terms h3 { font-size: 1.25rem; margin: 0 0 8px; }
.ck-guarantee__terms p { color: var(--ink-2); margin-bottom: 28px; max-width: 36em; }
.ck-guarantee__terms p:last-child { margin-bottom: 0; }
.ck-guarantee__terms a { font-weight: 650; }

/* ==========================================================================
   Shared inner-page pieces: code blocks, feature lists, section nav
   ========================================================================== */
.ck-code {
	margin: 0 0 20px;
	padding: 16px 18px;
	border-radius: var(--r-md);
	background: var(--ed-bg);
	color: var(--ed-text);
	font-family: var(--mono);
	font-size: 0.875rem;
	line-height: 1.7;
	overflow-x: auto;
	white-space: pre;
	tab-size: 4;
}
.ck-code .c { color: var(--ed-muted); }
.ck-code .p { color: var(--sx-fn); user-select: none; }
.ck-code code, .ck-band--deep .ck-code code { background: none; color: inherit; padding: 0; font-size: inherit; overflow-wrap: normal; border-radius: 0; }

.ck-list { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; }
@media (max-width: 719px) { .ck-list { grid-template-columns: minmax(0, 1fr); } }
.ck-list > li { padding: 16px 0; border-bottom: 1px solid var(--line); }
.ck-list__title { display: block; font-weight: 700; margin-bottom: 4px; }
.ck-list__text { display: block; color: var(--ink-2); font-size: 0.9688rem; }

.ck-band { background: var(--bg-alt); }
.ck-band--deep { background: var(--deep); color: var(--on-deep); }
.ck-band--deep .ck-lede, .ck-band--deep .ck-list__text, .ck-band--deep p { color: var(--on-deep-2); }
.ck-band--deep .ck-list > li { border-color: #2c3f6b; }
.ck-band--deep .ck-badge { background: #22345e; color: #aebdff; }
.ck-band--deep :focus-visible { outline-color: var(--ember); }
.ck-band--deep .ck-link { color: var(--on-deep); border-bottom-color: var(--ember); }
.ck-band--deep code { background: #1f3260; color: #d6e0ff; }

.ck-cols2 {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr);
	gap: clamp(32px, 6vw, 88px);
	align-items: start;
}
@media (max-width: 899px) { .ck-cols2 { grid-template-columns: minmax(0, 1fr); } }
.ck-cols2 h2 { margin-bottom: 20px; }
.ck-sticky { position: sticky; top: 100px; }
@media (max-width: 899px) { .ck-sticky { position: static; } }

.ck-table-simple { width: 100%; border-collapse: collapse; font-size: 0.9375rem; }
.ck-table-simple th, .ck-table-simple td { text-align: left; vertical-align: top; padding: 12px 12px 12px 0; border-bottom: 1px solid var(--line); }
.ck-table-simple thead th { font-weight: 750; border-bottom: 2px solid var(--ink); }
.ck-table-simple td code, .ck-table-simple th code { white-space: nowrap; }
.ck-table-wrap { overflow-x: auto; }

/* Switch pages */
.ck-srccards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 899px) { .ck-srccards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 559px) { .ck-srccards { grid-template-columns: minmax(0, 1fr); } }
.ck-srccard__link {
	display: grid;
	gap: 6px;
	height: 100%;
	padding: 20px 22px;
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	background: var(--surface);
	color: var(--ink);
	text-decoration: none;
	transition: border-color .15s ease;
}
.ck-srccard__link:hover { border-color: var(--ink); color: var(--ink); text-decoration: none; }
.ck-srccard__name { font-size: 1.25rem; font-weight: 780; letter-spacing: -0.01em; font-variation-settings: "FLAR" 100; }
.ck-srccard__name .ck-badge { font-variation-settings: normal; }
.ck-srccard__what { color: var(--ink-2); font-size: 0.9375rem; }
.ck-srccard__go { margin-top: 8px; color: var(--cobalt); font-weight: 650; font-size: 0.9375rem; }
.ck-ticks--big { margin-top: 0; }
.ck-ticks--big li { font-size: 1.0625rem; }
.ck-notyet { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 10px; }
.ck-notyet li { position: relative; padding-left: 30px; color: var(--ink-2); max-width: 36em; }
.ck-notyet li::before { content: "–"; position: absolute; left: 4px; top: 0; font-weight: 800; color: var(--warn); }
.ck-sources--links a { color: var(--ink); text-decoration: none; }
.ck-sources--links li:has(a:hover) { border-color: var(--ink); }
.ck-steps--switch .ck-steps__item:last-child::before { background: var(--ok); color: #fff; }

/* Features, Safety, Agencies, Roadmap */
.ck-pillars { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 899px) { .ck-pillars { grid-template-columns: minmax(0, 1fr); } }
.ck-pillar {
	display: grid;
	align-content: start;
	gap: 8px;
	padding: 24px;
	border-radius: var(--r-lg);
	border: 1px solid #2c3f6b;
	background: var(--deep-2);
	color: var(--on-deep);
	text-decoration: none;
}
a.ck-pillar:hover { border-color: var(--ember); color: var(--on-deep); text-decoration: none; }
.ck-pillar__title { font-size: 1.25rem; font-weight: 780; font-variation-settings: "FLAR" 100; letter-spacing: -0.01em; }
.ck-pillar__text { color: var(--on-deep-2); }
.ck-pillar__go { margin-top: 6px; color: var(--ember); font-weight: 650; }

.ck-list--one { grid-template-columns: minmax(0, 1fr); }
.ck-cols2--even { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
@media (max-width: 899px) { .ck-cols2--even { grid-template-columns: minmax(0, 1fr); } }

.ck-qa { margin: 0; border-top: 1px solid var(--line); }
.ck-qa > div { padding: 18px 0; border-bottom: 1px solid var(--line); }
.ck-qa dt { font-weight: 700; margin-bottom: 6px; }
.ck-qa dd { margin: 0; color: var(--ink-2); max-width: 40em; }

.ck-band--deep .ck-minor { color: var(--on-deep); }

.ck-repo__inner {
	border-radius: var(--r-lg);
	border: 1px solid #2c3f6b;
	background: var(--ed-bg);
	color: var(--ed-text);
	overflow: hidden;
	font-size: 0.875rem;
}
.ck-repo__bar { display: flex; justify-content: space-between; margin: 0; padding: 12px 16px; background: var(--ed-panel); border-bottom: 1px solid var(--ed-line); font-weight: 700; }
.ck-repo__branch { font-family: var(--mono); font-size: 0.75rem; padding: 2px 8px; border-radius: 999px; background: #22345e; color: #aebdff; font-weight: 600; }
.ck-repo__commit { display: flex; justify-content: space-between; gap: 12px; margin: 0; padding: 12px 16px; border-bottom: 1px solid var(--ed-line); background: rgba(255, 159, 46, .08); }
.ck-repo__commit b { font-weight: 600; }
.ck-repo__commit span { color: var(--ed-muted); white-space: nowrap; }
.ck-repo__tree { list-style: none; margin: 0; padding: 10px 0; font-family: var(--mono); font-size: 0.8125rem; }
.ck-repo__tree li { padding: 5px 16px; }
.ck-repo__tree li.is-dir { color: #aebdff; font-weight: 600; }
.ck-repo__tree li.is-in { padding-left: 34px; }
.ck-repo__tree li.is-in2 { padding-left: 52px; }
.ck-repo__tree li.is-meta { color: var(--ed-muted); }
.ck-repo__tree li.is-changed { color: var(--sx-str); }
.ck-repo__tree li.is-changed::after { content: "M"; float: right; color: var(--ember); font-weight: 700; }

.ck-log ul { list-style: none; margin: 0; padding: 0; }
.ck-log li {
	display: grid;
	grid-template-columns: 5.5rem minmax(0, 1fr) auto;
	grid-template-areas: "who what when" "who via when";
	gap: 2px 12px;
	padding: 12px 0;
	border-bottom: 1px solid var(--line-soft);
}
.ck-log li:last-child { border-bottom: 0; }
.ck-log__who { grid-area: who; font-weight: 700; }
.ck-log__what { grid-area: what; }
.ck-log__via { grid-area: via; font-size: 0.8125rem; color: var(--ink-2); }
.ck-log__when { grid-area: when; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.ck-log li.is-auto .ck-log__who { color: var(--bad); }

.ck-roadmap { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 899px) { .ck-roadmap { grid-template-columns: minmax(0, 1fr); } }
.ck-roadmap__col { padding: 24px; border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--line); }
.ck-roadmap__col--built { border-top: 4px solid var(--ok); }
.ck-roadmap__col--next { border-top: 4px solid var(--ember); }
.ck-roadmap__col--later { border-top: 4px solid var(--line); }
.ck-roadmap__title { font-size: 1.5rem; margin-bottom: 4px; }
.ck-roadmap__lede { color: var(--ink-2); margin-bottom: 16px; }
.ck-roadmap__list { list-style: none; margin: 0; padding: 0; }
.ck-roadmap__list li { padding: 10px 0; border-top: 1px solid var(--line-soft); font-size: 0.9688rem; }
@media (max-width: 639px) {
	.ck-table-simple thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.ck-table-simple tr { display: block; padding: 12px 0; border-bottom: 1px solid var(--line); }
	.ck-table-simple th, .ck-table-simple td { display: block; padding: 2px 0; border: 0; }
	.ck-table-simple td code, .ck-table-simple th code { white-space: normal; overflow-wrap: anywhere; }
	.ck-levels td:last-child { color: var(--ink-2); font-size: 0.875rem; }
}

/* ==========================================================================
   Try, Contact, Legal, Docs, Snippet library, Hook reference
   ========================================================================== */

.ck-section--flush { padding-top: 0; }
.ck-section--tight { padding-block: 0 var(--section); }

/* Readable text (docs, legal, library) */
.ck-prose > * + * { margin-top: 0; }
.ck-prose h2 { font-size: clamp(1.5rem, 1.2rem + 1vw, 1.875rem); margin: 44px 0 14px; letter-spacing: -0.015em; }
.ck-prose h3 { margin: 32px 0 10px; }
.ck-prose h2:first-child, .ck-prose h3:first-child { margin-top: 0; }
.ck-prose ul, .ck-prose ol { padding-left: 1.3em; margin: 0 0 1.1em; }
.ck-prose li { margin-bottom: 0.4em; }
.ck-prose li > p { margin-bottom: 0.4em; }
.ck-prose blockquote { margin: 24px 0; padding: 14px 18px; border-left: 4px solid var(--cobalt); background: var(--cobalt-tint); border-radius: 0 var(--r-md) var(--r-md) 0; }
.ck-prose blockquote p:last-child { margin-bottom: 0; }
.ck-prose .ck-code { margin: 0 0 1.4em; }
.ck-prose img { max-width: 100%; height: auto; border-radius: var(--r-md); }
.ck-prose table { margin-bottom: 1.4em; }
.ck-prose hr { border: 0; border-top: 1px solid var(--line); margin: 40px 0; }
.ck-anchor { opacity: 0; margin-left: 6px; color: var(--ink-2); text-decoration: none; font-weight: 500; }
h2:hover > .ck-anchor, h3:hover > .ck-anchor, .ck-anchor:focus { opacity: 1; }
.ck-callout--warning, .ck-callout--important { border-left-color: var(--warn) !important; background: var(--warn-tint) !important; }
.ck-callout--plan .ck-badge { margin: 0 8px 0 0; }
mark.ck-missing { background: var(--warn-tint); color: var(--warn); padding: 0 4px; border-radius: 4px; font-size: 0.9em; }

/* Breadcrumbs, meta, chips, search */
.ck-crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-size: 0.9375rem; color: var(--ink-2); margin-bottom: 20px; }
.ck-crumbs a { color: var(--ink-2); }
.ck-meta { list-style: none; margin: 20px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ck-meta li { padding: 6px 12px; border: 1px solid var(--line); border-radius: 999px; font-size: 0.875rem; background: var(--surface); }
.ck-meta__k { color: var(--ink-2); margin-right: 4px; }
.ck-meta code { background: none; padding: 0; }
.ck-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ck-chip { padding: 7px 14px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--ink); font-size: 0.9375rem; font-weight: 600; text-decoration: none; }
.ck-chip:hover { border-color: var(--ink); color: var(--ink); text-decoration: none; }
.ck-chip[aria-current="true"] { background: var(--ink); border-color: var(--ink); color: var(--bg); }
.ck-search { margin: 0; }
.ck-search input, .ck-field input, .ck-field select, .ck-field textarea {
	width: 100%;
	font: inherit;
	font-size: 1rem;
	color: var(--ink);
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	padding: 11px 14px;
	min-height: 46px;
}
.ck-search input:focus, .ck-field input:focus, .ck-field select:focus, .ck-field textarea:focus { outline: 2px solid var(--cobalt); outline-offset: 1px; border-color: var(--cobalt); }
.ck-lib-tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; margin-bottom: 28px; }
.ck-lib-tools .ck-search { flex: 0 1 300px; }
@media (max-width: 719px) { .ck-lib-tools .ck-search { flex-basis: 100%; } }
.ck-lib-empty { margin-top: 24px; color: var(--ink-2); }

/* Snippet cards */
.ck-lib-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 999px) { .ck-lib-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { .ck-lib-grid { grid-template-columns: minmax(0, 1fr); } }
.ck-lib-card[hidden] { display: none; }
.ck-lib-card__link { display: grid; align-content: start; gap: 8px; height: 100%; padding: 20px 22px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); color: var(--ink); text-decoration: none; transition: border-color .15s ease; }
.ck-lib-card__link:hover { border-color: var(--ink); color: var(--ink); text-decoration: none; }
.ck-lib-card__meta { display: flex; align-items: center; gap: 10px; font-size: 0.8125rem; color: var(--ink-2); }
.ck-lib-card__type { font-family: var(--mono); font-size: 0.75rem; font-weight: 700; padding: 2px 7px; border-radius: 5px; background: var(--cobalt-tint); color: var(--cobalt); }
.ck-lib-card__type--css { background: #e6f4ee; color: #17714a; }
.ck-lib-card__type--js { background: var(--warn-tint); color: var(--warn); }
.ck-lib-card__type--html { background: #f7e7f0; color: #9a2f68; }
:root[data-theme="dark"] .ck-lib-card__type--css { background: #16372a; color: #7fd6bd; }
:root[data-theme="dark"] .ck-lib-card__type--html { background: #3b1d2d; color: #ffa3d1; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .ck-lib-card__type--css { background: #16372a; color: #7fd6bd; } :root:not([data-theme="light"]) .ck-lib-card__type--html { background: #3b1d2d; color: #ffa3d1; } }
.ck-lib-card__title { font-size: 1.125rem; font-weight: 750; line-height: 1.25; letter-spacing: -0.01em; }
.ck-lib-card__text { color: var(--ink-2); font-size: 0.9375rem; }

/* Single snippet / hook */
.ck-lib-item { padding-top: clamp(40px, 6vw, 72px); }
.ck-lib-item__head { max-width: 50rem; margin-bottom: 36px; }
.ck-lib-item__head h1 { font-size: clamp(2.1rem, 1.4rem + 2.6vw, 3.25rem); margin-bottom: 18px; }
.ck-hook-name { font-family: var(--mono); font-variation-settings: normal; letter-spacing: -0.02em; font-weight: 700; overflow-wrap: anywhere; }
.ck-lib-item__body { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: clamp(28px, 4vw, 56px); align-items: start; }
@media (max-width: 999px) { .ck-lib-item__body { grid-template-columns: minmax(0, 1fr); } }
.ck-lib-item__main { min-width: 0; }
.ck-lib-item__main > .ck-codebox { margin-bottom: 36px; }
.ck-lib-item__side { position: sticky; top: 100px; display: grid; gap: 16px; }
@media (max-width: 999px) { .ck-lib-item__side { position: static; } }
.ck-howto, .ck-related-hooks { padding: 22px; border-radius: var(--r-lg); background: var(--bg-alt); }
.ck-howto__title { font-size: 1.125rem; margin-bottom: 12px; letter-spacing: -0.01em; }
.ck-howto__steps { margin: 0 0 16px; padding-left: 1.2em; font-size: 0.9688rem; }
.ck-howto__steps li { margin-bottom: 6px; }
.ck-howto p { font-size: 0.9688rem; }
.ck-howto__cta { margin: 0 0 14px; }
.ck-howto .ck-note { font-size: 0.875rem; }
.ck-related-hooks ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ck-lib-item__tested { font-size: 0.875rem; }
.ck-lib-related { margin-top: clamp(48px, 6vw, 80px); }
.ck-lib-related h2 { font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); margin-bottom: 20px; }
.ck-params th { width: 34%; }
.ck-params__type { display: block; margin-top: 4px; font-weight: 500; font-size: 0.8125rem; color: var(--ink-2); font-family: var(--mono); }

/* Code box with copy */
.ck-codebox { border-radius: var(--r-md); overflow: hidden; background: var(--ed-bg); }
.ck-codebox__bar { display: flex; align-items: center; justify-content: space-between; padding: 8px 10px 8px 16px; background: var(--ed-panel); border-bottom: 1px solid var(--ed-line); }
.ck-codebox__lang { font-family: var(--mono); font-size: 0.8125rem; color: var(--ed-muted); }
.ck-codebox__copy { font: inherit; font-size: 0.8125rem; font-weight: 650; color: var(--ed-text); background: var(--ed-panel-2); border: 1px solid var(--ed-line); border-radius: 6px; padding: 5px 12px; cursor: pointer; }
.ck-codebox__copy:hover { border-color: var(--ed-muted); }
.ck-codebox__copy.is-done { color: #7fd6bd; }
.ck-codebox__code { margin: 0; border-radius: 0; max-height: 640px; }
.ck-code { font-variant-ligatures: none; }

/* Hook list */
.ck-hooks__group { font-size: 1.375rem; margin: 36px 0 12px; }
.ck-hooks__group:first-of-type { margin-top: 0; }
.ck-hooks { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.ck-hooks[hidden], .ck-hooks__group[hidden], .ck-hooks__item[hidden] { display: none; }
.ck-hooks__link { display: grid; grid-template-columns: minmax(0, 24rem) auto minmax(0, 1fr); gap: 6px 18px; align-items: baseline; padding: 14px 4px; border-bottom: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.ck-hooks__link:hover { background: var(--surface); color: var(--ink); text-decoration: none; }
.ck-hooks__name { background: none; padding: 0; font-size: 0.9688rem; font-weight: 650; color: var(--cobalt); overflow-wrap: anywhere; }
.ck-hooks__kind { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ink-2); }
.ck-hooks__kind--filter { color: var(--ok); }
.ck-hooks__text { color: var(--ink-2); font-size: 0.9375rem; }
@media (max-width: 799px) { .ck-hooks__link { grid-template-columns: minmax(0, 1fr) auto; } .ck-hooks__text { grid-column: 1 / -1; } }

/* Try page */
.ck-try { border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--line); background: var(--surface); box-shadow: 0 30px 60px -40px rgba(15, 30, 61, .45); }
.ck-try__bar { display: flex; align-items: center; gap: 14px; padding: 10px 14px; background: var(--bg-alt); border-bottom: 1px solid var(--line); }
.ck-try__dots { display: inline-flex; gap: 6px; }
.ck-try__dots i { width: 10px; height: 10px; border-radius: 50%; background: var(--line); }
.ck-try__addr { flex: 1; max-width: 420px; padding: 4px 12px; border-radius: 6px; background: var(--surface); color: var(--ink-2); font-size: 0.8125rem; font-family: var(--mono); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ck-try__stage { position: relative; min-height: 460px; display: grid; place-items: center; padding: 40px 20px; background: radial-gradient(ellipse at 50% 120%, rgba(255, 159, 46, .18), transparent 60%); }
.ck-try__stage.is-live { padding: 0; min-height: 0; display: block; }
.ck-try__start { display: grid; justify-items: center; text-align: center; gap: 10px; max-width: 34rem; }
.ck-try__mark { width: 64px; height: 64px; }
.ck-try__title { font-size: clamp(1.375rem, 1.1rem + 1vw, 1.75rem); font-weight: 780; letter-spacing: -0.015em; line-height: 1.2; margin: 6px 0 0; font-variation-settings: "FLAR" 100; }
.ck-try__fine { color: var(--ink-2); font-size: 0.9375rem; margin: 0; }
.ck-try__buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 10px 0 4px; }
.ck-try__buttons--left { justify-content: flex-start; }
.ck-try__loading { position: absolute; inset: 0; display: grid; place-items: center; margin: 0; color: var(--ink-2); }
.ck-try__frame { display: block; width: 100%; height: min(78vh, 820px); border: 0; background: #fff; }
.ck-try__privacy { margin-top: 18px; }
.ck-tries { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; counter-reset: ck-try; }
@media (max-width: 899px) { .ck-tries { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 559px) { .ck-tries { grid-template-columns: minmax(0, 1fr); } }
.ck-tries li { counter-increment: ck-try; padding: 22px; border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--line); }
.ck-tries li::before { content: counter(ck-try); display: grid; place-items: center; width: 32px; height: 32px; margin-bottom: 12px; border-radius: 50%; background: var(--ink); color: var(--bg); font-weight: 800; font-size: 0.9375rem; }
.ck-tries h3 { margin-bottom: 6px; }
.ck-tries p { color: var(--ink-2); margin: 0; font-size: 0.9688rem; }

/* Contact page */
.ck-help-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.ck-help-card { display: grid; align-content: start; gap: 8px; padding: 24px; border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--line); }
.ck-help-card h3 { font-size: 1.25rem; }
.ck-help-card p { color: var(--ink-2); margin: 0; font-size: 0.9688rem; }
.ck-help-card__links { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 8px !important; }
.ck-form { display: grid; gap: 18px; }
.ck-form__row--two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
@media (max-width: 599px) { .ck-form__row--two { grid-template-columns: minmax(0, 1fr); } }
.ck-field { margin: 0; display: grid; gap: 6px; }
.ck-field label { font-weight: 650; font-size: 0.9375rem; }
.ck-field textarea { min-height: 180px; resize: vertical; line-height: 1.5; }
.ck-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.ck-form__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; margin: 0; }
.ck-form__foot .ck-note { border: 0; padding: 0; }
.ck-alert { padding: 16px 18px; border-radius: var(--r-md); margin-bottom: 20px; }
.ck-alert p:last-child { margin-bottom: 0; }
.ck-alert--ok { background: var(--ok-tint); color: var(--ink); border-left: 4px solid var(--ok); }
.ck-alert--bad { background: #fbe4e1; color: #7a1f14; border-left: 4px solid var(--bad); }
:root[data-theme="dark"] .ck-alert--bad { background: #4a1f1b; color: #ffd2cc; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .ck-alert--bad { background: #4a1f1b; color: #ffd2cc; } }
.ck-biz { max-width: none; }

/* Legal pages */
.ck-legal { padding-top: clamp(40px, 6vw, 72px); }
.ck-legal__inner { display: grid; grid-template-columns: 220px minmax(0, 46rem); gap: clamp(28px, 5vw, 72px); align-items: start; }
@media (max-width: 899px) { .ck-legal__inner { grid-template-columns: minmax(0, 1fr); } }
.ck-legal__nav { position: sticky; top: 100px; }
@media (max-width: 899px) { .ck-legal__nav { position: static; } }
.ck-legal__nav ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
@media (max-width: 899px) { .ck-legal__nav ul { display: flex; flex-wrap: wrap; gap: 8px; } }
.ck-legal__nav a { display: block; padding: 8px 12px; border-radius: var(--r-sm); color: var(--ink); text-decoration: none; font-weight: 600; font-size: 0.9688rem; }
.ck-legal__nav a:hover { background: var(--bg-alt); }
.ck-legal__nav a[aria-current="page"] { background: var(--ink); color: var(--bg); }
.ck-legal__body h1 { font-size: clamp(2.25rem, 1.5rem + 3vw, 3.25rem); margin-bottom: 28px; }
.ck-legal__draft { padding: 12px 16px; border-radius: var(--r-md); background: var(--warn-tint); color: var(--warn); font-weight: 600; font-size: 0.9375rem; margin-bottom: 28px; }

/* Docs */
.ck-docs { display: grid; grid-template-columns: 250px minmax(0, 1fr) 200px; gap: clamp(28px, 3.5vw, 56px); align-items: start; padding-block: clamp(32px, 4vw, 56px) var(--section); }
@media (max-width: 1199px) { .ck-docs { grid-template-columns: 240px minmax(0, 1fr); } .ck-docs__toc { display: none; } }
@media (max-width: 899px) { .ck-docs { grid-template-columns: minmax(0, 1fr); } .ck-docs__side { display: none; } }
.ck-docs__side, .ck-docs__toc { position: sticky; top: 88px; max-height: calc(100vh - 110px); overflow-y: auto; font-size: 0.9375rem; }
.ck-docs__mobilenav { display: none; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); }
@media (max-width: 899px) { .ck-docs__mobilenav { display: block; } }
.ck-docs__mobilenav summary { padding: 12px 16px; font-weight: 700; cursor: pointer; }
.ck-docs__mobilenav .ck-docs__nav { padding: 0 16px 16px; }
.ck-docs__search { margin-bottom: 18px; }
.ck-docs__search input { min-height: 40px; padding: 8px 12px; font-size: 0.9375rem; }
.ck-docs__section { margin-bottom: 20px; }
.ck-docs__section[hidden], .ck-docs__section li[hidden], .ck-docs-home__section[hidden], .ck-docs-home li[hidden] { display: none; }
.ck-docs__head { font-size: 0.75rem; font-weight: 750; text-transform: uppercase; letter-spacing: 0.08em; color: var(--ink-2); margin: 0 0 8px; }
.ck-docs__nav ul, .ck-docs__toc ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.ck-docs__nav li { display: flex; align-items: center; gap: 4px; }
.ck-docs__nav a, .ck-docs__toc a { display: block; padding: 5px 10px; border-radius: var(--r-sm); color: var(--ink); text-decoration: none; line-height: 1.35; }
.ck-docs__nav a:hover, .ck-docs__toc a:hover { background: var(--bg-alt); color: var(--ink); }
.ck-docs__nav a[aria-current="page"] { background: var(--cobalt-tint); color: var(--cobalt); font-weight: 650; }
.ck-docs__nav .ck-badge { margin-left: 0; font-size: 0.6875rem; padding: 1px 6px; }
.ck-docs__toc a { color: var(--ink-2); padding-left: 12px; border-left: 2px solid var(--line); border-radius: 0; }
.ck-docs__main { min-width: 0; }
.ck-docs__title { font-size: clamp(2rem, 1.4rem + 2.2vw, 3rem); margin-bottom: 24px; }
.ck-docs__lang { font-size: 0.9375rem; color: var(--ink-2); margin-top: -12px; }
.ck-docs__body { max-width: 44rem; }
.ck-doc-table code { white-space: normal; }
.ck-docs__pager { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 48px 0 24px; max-width: 44rem; }
.ck-docs__pager a { display: grid; gap: 2px; padding: 14px 18px; border: 1px solid var(--line); border-radius: var(--r-md); color: var(--ink); text-decoration: none; font-weight: 650; }
.ck-docs__pager a:hover { border-color: var(--ink); text-decoration: none; color: var(--ink); }
.ck-docs__pager span { font-size: 0.8125rem; font-weight: 500; color: var(--ink-2); }
.ck-docs__next { grid-column: 2; text-align: right; }
.ck-docs__help { max-width: 44rem; }
.ck-docs__bigsearch { max-width: 520px; margin-bottom: 36px; }
.ck-docs-home { columns: 3 260px; column-gap: 32px; }
.ck-docs-home__section { break-inside: avoid; margin-bottom: 32px; }
.ck-docs-home__title { font-size: 1.25rem; margin-bottom: 10px; }
.ck-docs-home ul { list-style: none; margin: 0; padding: 0; }
.ck-docs-home li { padding: 6px 0; border-bottom: 1px solid var(--line-soft); }
.ck-docs-home a { color: var(--ink); text-decoration: none; font-weight: 550; }
.ck-docs-home a:hover { color: var(--cobalt); }