.kfp-shell {
	--kfp-ink: #152035;
	--kfp-muted: #667085;
	--kfp-line: #e5e7eb;
	--kfp-primary: #111111;
	--kfp-primary-soft: #2e2e2e;
	--kfp-danger: #b42318;
	max-width: 1120px;
	margin: 48px auto;
	padding: 0 20px;
	color: var(--kfp-ink);
}

.kfp-shell--narrow { max-width: 520px; }
.kfp-shell *, .kfp-shell *::before, .kfp-shell *::after { box-sizing: border-box; }
.kfp-shell [hidden], .kfp-modal[hidden] { display: none !important; }
.kfp-shell .screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.kfp-shell h1, .kfp-shell h2, .kfp-shell p { margin-top: 0; }
.kfp-shell h1 { margin-bottom: 8px; font-size: clamp(30px, 5vw, 44px); line-height: 1.1; }
.kfp-shell h2 { margin: 10px 0 6px; font-size: 20px; }
.kfp-shell p { color: var(--kfp-muted); }

.kfp-card {
	padding: 28px;
	border: 1px solid var(--kfp-line);
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 8px 30px rgba(21, 32, 53, .06);
}

.kfp-topbar, .kfp-article-row, .kfp-row-actions, .kfp-topbar__actions, .kfp-publish-actions {
	display: flex;
	align-items: center;
	gap: 12px;
}

.kfp-topbar { justify-content: space-between; margin-bottom: 28px; }
.kfp-shell > .kfp-topbar h1 { color: #fff !important; text-shadow: 0 1px 2px rgba(0, 0, 0, .35); }
.kfp-shell > .kfp-topbar .kfp-eyebrow { color: #e5e5e5 !important; }
.kfp-shell > .kfp-topbar .kfp-back { color: #e5e5e5; }
.kfp-topbar__actions, .kfp-row-actions { flex-wrap: wrap; }
.kfp-eyebrow { margin-bottom: 6px !important; color: var(--kfp-primary) !important; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.kfp-list { display: grid; gap: 14px; }
.kfp-article-row { justify-content: space-between; }
.kfp-empty { text-align: center; }

.kfp-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 10px 18px;
	border: 1px solid #fff;
	border-radius: 10px;
	background: var(--kfp-primary);
	color: #fff !important;
	font: inherit;
	font-weight: 700;
	text-decoration: none !important;
	cursor: pointer;
}

.kfp-button--ghost { border-color: var(--kfp-primary); background: #fff; color: var(--kfp-primary) !important; }
.kfp-button--small { min-height: 38px; padding: 7px 12px; font-size: 14px; }

.kfp-button:hover,
.kfp-button:focus-visible {
	border-color: #fff;
	background: var(--kfp-primary-soft);
}

.kfp-button--ghost:hover,
.kfp-button--ghost:focus-visible {
	border-color: #fff;
	background: var(--kfp-primary-soft);
	color: #fff !important;
}

.kfp-text-button { padding: 4px; border: 0; background: transparent; color: var(--kfp-danger); font: inherit; cursor: pointer; text-decoration: underline; }
.kfp-text-button--primary { color: var(--kfp-primary); font-weight: 700; justify-self: start; }
.kfp-muted-link, .kfp-back { color: var(--kfp-muted); }
.kfp-back { display: inline-block; margin-bottom: 10px; text-decoration: none; }
.kfp-inline-form { display: inline; margin: 0; }

.kfp-form, .kfp-fields, .kfp-sidebar { display: grid; gap: 12px; }
.kfp-form { margin-top: 24px; }
.kfp-form input:not([type="checkbox"]), .kfp-fields input, .kfp-fields textarea, .kfp-sidebar select, .kfp-sidebar input[type="text"] {
	width: 100%;
	min-height: 46px;
	padding: 10px 12px;
	border: 1px solid #cfd4dc;
	border-radius: 8px;
	background: #fff;
	color: var(--kfp-ink);
	font: inherit;
}

.kfp-fields textarea { min-height: 90px; resize: vertical; }
.kfp-form label, .kfp-fields label, .kfp-sidebar label { font-weight: 700; }
.kfp-check { display: flex; align-items: center; gap: 8px; font-weight: 400 !important; }
.kfp-help { margin-top: -8px !important; font-size: 13px; }
.kfp-required { color: var(--kfp-danger); }

.kfp-editor-form { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 20px; align-items: start; }
.kfp-fields, .kfp-sidebar { min-width: 0; }
.kfp-sidebar { position: sticky; top: 24px; }
.kfp-field-group { display: grid; gap: 8px; padding-bottom: 18px; border-bottom: 1px solid var(--kfp-line); }
.kfp-new-category { display: grid; gap: 8px; padding: 12px; border-radius: 10px; background: #f5f5f5; }
.kfp-publish-actions { align-items: stretch; flex-direction: column; }
.kfp-thumbnail-preview { display: grid; min-height: 170px; place-items: center; overflow: hidden; border: 1px dashed #cfd4dc; border-radius: 10px; background: #f8fafc; color: var(--kfp-muted); }
.kfp-thumbnail-preview img { display: block; width: 100%; max-height: 260px; object-fit: cover; }
.kfp-autosave { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 10px; background: #f8fafc; color: var(--kfp-muted); font-size: 13px; }
.kfp-autosave__dot { width: 9px; height: 9px; flex: 0 0 9px; border-radius: 50%; background: #98a2b3; }
.kfp-autosave__dot.is-saving { background: #f79009; animation: kfp-pulse 1s infinite; }
.kfp-autosave__dot.is-saved { background: #12b76a; }
.kfp-autosave__dot.is-error { background: var(--kfp-danger); }
.kfp-success-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.kfp-is-invalid { border-color: var(--kfp-danger) !important; box-shadow: 0 0 0 2px rgba(180, 35, 24, .12) !important; }
.wp-editor-wrap.kfp-is-invalid { padding: 2px; border: 1px solid var(--kfp-danger); border-radius: 6px; }

@keyframes kfp-pulse {
	50% { opacity: .35; }
}

.kfp-notice { margin: 0 0 20px; padding: 12px 16px; border-radius: 10px; }
.kfp-notice--error { background: #fef3f2; color: var(--kfp-danger); }
.kfp-notice--success { background: #ecfdf3; color: #027a48; }
.kfp-status { display: inline-flex; padding: 4px 8px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.kfp-status--publish { background: #ecfdf3; color: #027a48; }
.kfp-status--draft { background: #f2f4f7; color: #475467; }

.kfp-modal { position: fixed; z-index: 100000; inset: 0; display: grid; place-items: center; padding: 20px; }
.kfp-modal__backdrop { position: absolute; inset: 0; background: rgba(10, 16, 28, .72); }
.kfp-modal__panel { position: relative; width: min(100%, 460px); padding: 28px; border-radius: 16px; background: #fff; color: var(--kfp-ink); box-shadow: 0 24px 80px rgba(0, 0, 0, .3); }
.kfp-modal__panel h2 { margin: 0 0 10px; color: var(--kfp-ink); }
.kfp-modal__panel p { margin: 0 0 22px; color: var(--kfp-muted); }
.kfp-modal__actions { display: flex; justify-content: flex-end; gap: 10px; }
.kfp-modal-open { overflow: hidden; }

@media (max-width: 960px) {
	.kfp-editor-form { grid-template-columns: minmax(0, 1fr) 270px; }
}

@media (max-width: 760px) {
	.kfp-shell { margin: 28px auto; padding: 0 14px; }
	.kfp-card { padding: 20px; }
	.kfp-topbar, .kfp-article-row { align-items: flex-start; flex-direction: column; }
	.kfp-editor-form { grid-template-columns: 1fr; }
	.kfp-sidebar { position: static; }
	.kfp-topbar__actions, .kfp-row-actions { width: 100%; }
	.kfp-success-actions, .kfp-modal__actions { align-items: stretch; flex-direction: column; }
	.kfp-success-actions .kfp-button, .kfp-modal__actions .kfp-button { width: 100%; }
}
