:root { --kp-blue: #1d2e8e; --kp-blue-deep: #142374; --kp-red: #b3172d; --kp-paper: #f4f6fb; --kp-ink: #152038; --kp-muted: #69738a; --kp-line: #e1e6ef; --kp-white: #fff; }
* { box-sizing: border-box; }
.admin-body { min-height: 100vh; margin: 0; color: var(--kp-ink); background: var(--kp-paper); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.admin-body a { color: inherit; text-decoration: none; }
.admin-body img { display: block; max-width: 100%; }
.admin-shell { min-height: 100vh; display: flex; }
.admin-sidebar { position: fixed; inset: 0 auto 0 0; z-index: 8; width: 264px; display: flex; flex-direction: column; color: #d7ddff; background: var(--kp-blue-deep); }
.admin-brand { padding: 28px 25px 23px; border-bottom: 1px solid rgba(255,255,255,.13); }
.admin-brand img { width: 166px; height: 64px; object-fit: contain; object-position: left center; filter: brightness(0) invert(1); }
.admin-brand p { margin: 12px 0 0; color: #aeb9ef; font-size: 10px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.admin-nav { display: grid; gap: 5px; padding: 25px 14px; }
.admin-nav a { display: flex; align-items: center; gap: 12px; padding: 12px 12px; border-radius: 7px; color: #cdd5fe; font-size: 13px; font-weight: 720; transition: .16s ease; }
.admin-nav a span { width: 18px; color: #aeb9ef; text-align: center; font-size: 17px; }
.admin-nav a:hover, .admin-nav a.is-active { color: #fff; background: rgba(255,255,255,.12); }
.admin-nav a.is-active span { color: #fff; }
.admin-sidebar-bottom { margin-top: auto; padding: 17px 19px 22px; border-top: 1px solid rgba(255,255,255,.13); }
.editor-ident { display: flex; align-items: center; gap: 10px; }
.editor-avatar { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 50%; color: var(--kp-blue); background: #fff; font-size: 13px; font-weight: 900; }
.editor-ident strong, .editor-ident span:not(.editor-avatar) { display: block; }
.editor-ident strong { color: #fff; font-size: 12px; }
.editor-ident div > span { margin-top: 3px; color: #aeb9ef; font-size: 10px; font-weight: 700; }
.public-link { display: inline-block; margin: 20px 0 13px; color: #cdd5fe; font-size: 12px; font-weight: 700; }
.public-link:hover { color: #fff; }
.admin-sidebar-bottom form button { width: 100%; padding: 10px 12px; border: 1px solid rgba(255,255,255,.34); border-radius: 5px; color: #fff; background: transparent; font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
.admin-sidebar-bottom form button:hover { color: var(--kp-blue); background: #fff; }
.admin-main { width: calc(100% - 264px); min-height: 100vh; margin-left: 264px; }
.admin-topbar { min-height: 78px; display: flex; align-items: center; justify-content: space-between; padding: 0 42px; border-bottom: 1px solid var(--kp-line); background: rgba(255,255,255,.88); }
.admin-topbar p { margin: 0 0 3px; color: var(--kp-muted); font-size: 10px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.admin-topbar strong { font-size: 14px; }
.admin-topbar > a { color: var(--kp-blue); font-size: 12px; font-weight: 800; }
.admin-menu-toggle { display: none; }
.admin-content { width: min(1160px, calc(100% - 70px)); margin: auto; padding: 45px 0 64px; }
.admin-page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 31px; }
.admin-page-heading p { margin: 0 0 8px; color: var(--kp-red); font-size: 11px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.admin-page-heading h1 { margin: 0; color: var(--kp-ink); font-size: clamp(29px, 3.5vw, 44px); letter-spacing: -.06em; line-height: .95; }
.admin-primary-action, .editor-save { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 13px 17px; border: 0; border-radius: 5px; color: #fff; background: var(--kp-red); font: inherit; font-size: 12px; font-weight: 850; cursor: pointer; }
.admin-primary-action:hover, .editor-save:hover { background: #891123; }
.admin-secondary-action { padding: 10px 0; color: var(--kp-blue); font-size: 12px; font-weight: 850; }
.metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 29px; }
.metric-grid article { min-height: 145px; padding: 20px; border: 1px solid var(--kp-line); background: #fff; box-shadow: 0 8px 18px rgba(32,47,84,.03); }
.metric-grid span { color: var(--kp-muted); font-size: 11px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.metric-grid strong { display: block; margin: 12px 0 3px; color: var(--kp-blue); font-size: 38px; letter-spacing: -.06em; line-height: .9; }
.metric-grid p { margin: 0; color: var(--kp-muted); font-size: 12px; }
.admin-panel, .editor-panel { border: 1px solid var(--kp-line); background: #fff; box-shadow: 0 8px 18px rgba(32,47,84,.025); }
.panel-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 24px 25px 20px; border-bottom: 1px solid var(--kp-line); }
.panel-heading p, .panel-heading h2 { margin: 0; }
.panel-heading p { color: var(--kp-muted); font-size: 10px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.panel-heading h2 { margin-top: 7px; font-size: 23px; letter-spacing: -.05em; }
.panel-heading > a { color: var(--kp-red); font-size: 12px; font-weight: 850; }
.article-admin-list { display: grid; }
.admin-post-row { display: grid; grid-template-columns: 92px minmax(0, 1fr) 115px; align-items: center; gap: 18px; padding: 15px 25px; border-bottom: 1px solid var(--kp-line); }
.admin-post-row:last-child { border-bottom: 0; }
.admin-post-image { height: 65px; overflow: hidden; color: #fff; background: var(--kp-blue); }
.admin-post-image img { width: 100%; height: 100%; object-fit: cover; }
.admin-post-image span { height: 100%; display: grid; place-items: center; font-size: 18px; font-weight: 900; letter-spacing: -.08em; }
.admin-post-copy { min-width: 0; }
.admin-post-copy h3 { margin: 6px 0 5px; overflow: hidden; font-size: 15px; letter-spacing: -.02em; text-overflow: ellipsis; white-space: nowrap; }
.admin-post-copy p { margin: 0; overflow: hidden; color: var(--kp-muted); font-size: 12px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.status-pill, .featured-pill { display: inline-block; padding: 4px 6px; border-radius: 3px; font-size: 9px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.status-published { color: #147047; background: #e4f6ed; }
.status-draft { color: #8d6411; background: #fff4d8; }
.status-archived { color: #69738a; background: #edf0f4; }
.featured-pill { margin-left: 5px; color: var(--kp-red); background: #fff0f2; }
.admin-post-meta { display: grid; justify-items: end; gap: 9px; }
.admin-post-meta time { color: var(--kp-muted); font-size: 11px; }
.admin-post-meta a { color: var(--kp-blue); font-size: 12px; font-weight: 850; }
.admin-empty { padding: 30px; color: var(--kp-muted); font-size: 13px; }
.admin-alert { margin: 0 0 23px; padding: 13px 15px; border: 1px solid #dce3f2; border-left: 4px solid var(--kp-blue); color: #314264; background: #fff; font-size: 13px; font-weight: 650; }
.admin-alert-success { border-left-color: #18734d; color: #14633f; }
.admin-alert-error { border-left-color: var(--kp-red); color: #8e1d2f; }
.editor-heading { align-items: center; }
.editor-form { display: grid; grid-template-columns: minmax(0, 1fr) 295px; gap: 22px; align-items: start; }
.editor-panel { padding: 25px; }
.editor-side { display: grid; gap: 17px; }
.editor-panel h2 { margin: 0 0 20px; font-size: 16px; letter-spacing: -.02em; }
.editor-field { display: grid; gap: 8px; margin-bottom: 17px; color: #44506a; font-size: 11px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.editor-field:last-child { margin-bottom: 0; }
.editor-field input, .editor-field textarea, .editor-field select { width: 100%; padding: 11px 12px; border: 1px solid #d9e0eb; border-radius: 4px; outline: none; color: var(--kp-ink); background: #fff; font: 500 14px/1.45 Inter, ui-sans-serif, system-ui, sans-serif; letter-spacing: normal; text-transform: none; transition: border-color .16s ease, box-shadow .16s ease; }
.editor-field textarea { resize: vertical; }
.editor-field input:focus, .editor-field textarea:focus, .editor-field select:focus { border-color: var(--kp-blue); box-shadow: 0 0 0 3px rgba(29,46,142,.1); }
.editor-title-field input { padding: 0; border: 0; border-bottom: 2px solid #d9e0eb; border-radius: 0; font-size: 29px; font-weight: 850; letter-spacing: -.045em; }
.editor-title-field input:focus { border-bottom-color: var(--kp-blue); box-shadow: none; }
.editor-check { display: flex; align-items: center; gap: 8px; color: #44506a; font-size: 12px; font-weight: 700; }
.editor-check input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--kp-blue); }
.editor-save { width: 100%; min-height: 47px; }
.field-error, .form-error { color: var(--kp-red); font-size: 11px; font-weight: 650; text-transform: none; letter-spacing: normal; }

.pro-login { width: min(1010px, calc(100% - 40px)); min-height: calc(100vh - 282px); margin: auto; display: grid; grid-template-columns: minmax(0, 1fr) 380px; align-items: center; gap: 84px; padding: 68px 0; }
.pro-login-intro h1 { margin: 0; color: var(--kp-ink); font-size: clamp(45px, 5.8vw, 76px); letter-spacing: -.075em; line-height: .87; }
.pro-login-intro h1 em { color: var(--kp-red); font-style: normal; }
.pro-login-intro > p:not(.eyebrow) { max-width: 445px; margin: 26px 0 22px; color: var(--kp-muted); font-size: 16px; line-height: 1.65; }
.pro-login-intro > a { color: var(--kp-blue); font-size: 12px; font-weight: 850; }
.pro-login-card { padding: 34px; border: 1px solid var(--kp-line); background: #fff; box-shadow: 0 18px 38px rgba(29,46,142,.11); }
.pro-login-kicker { margin: 0 0 8px; color: var(--kp-red); font-size: 10px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.pro-login-card h2 { margin: 0; font-size: 31px; letter-spacing: -.055em; }
.pro-login-card > p:not(.pro-login-kicker):not(.pro-login-help) { margin: 9px 0 26px; color: var(--kp-muted); font-size: 13px; line-height: 1.5; }
.pro-login-card form { display: grid; gap: 8px; }
.pro-login-card label { margin-top: 8px; color: #44506a; font-size: 11px; font-weight: 850; text-transform: uppercase; letter-spacing: .05em; }
.pro-login-card input { width: 100%; padding: 12px; border: 1px solid #d9e0eb; border-radius: 4px; outline: none; font: 14px Inter, ui-sans-serif, system-ui, sans-serif; }
.pro-login-card input:focus { border-color: var(--kp-blue); box-shadow: 0 0 0 3px rgba(29,46,142,.1); }
.pro-login-card button { display: flex; align-items: center; justify-content: center; gap: 9px; margin-top: 15px; padding: 13px; border: 0; border-radius: 4px; color: #fff; background: var(--kp-blue); font: 850 12px Inter, ui-sans-serif, system-ui, sans-serif; cursor: pointer; }
.pro-login-card button:hover { background: var(--kp-blue-deep); }
.pro-login-help { margin: 17px 0 0; color: var(--kp-muted); font-size: 11px; line-height: 1.5; }

@media (max-width: 980px) {
    .admin-sidebar { transform: translateX(-100%); transition: transform .2s ease; }
    .admin-main { width: 100%; margin-left: 0; }
    .admin-backdrop { position: fixed; inset: 0; z-index: 7; display: none; background: rgba(12,18,49,.46); }
    .admin-menu-open .admin-sidebar { transform: translateX(0); }
    .admin-menu-open .admin-backdrop { display: block; }
    .admin-menu-toggle { width: 38px; height: 38px; display: grid; align-content: center; justify-items: center; gap: 5px; padding: 0; border: 1px solid var(--kp-line); color: var(--kp-blue); background: #fff; cursor: pointer; }
    .admin-menu-toggle > span:not(.visually-hidden) { width: 17px; height: 2px; background: currentColor; }
    .admin-topbar { justify-content: flex-start; gap: 14px; padding: 0 22px; }
    .admin-topbar > a { margin-left: auto; }
    .pro-login { grid-template-columns: 1fr; gap: 35px; padding: 58px 0; }
    .pro-login-intro { max-width: 590px; }
    .pro-login-card { max-width: 480px; }
}
@media (max-width: 700px) {
    .admin-content { width: min(100% - 30px, 1160px); padding: 31px 0 43px; }
    .admin-topbar { min-height: 65px; padding: 0 15px; }
    .admin-topbar > a { display: none; }
    .metric-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .metric-grid article { min-height: 118px; padding: 15px; }
    .metric-grid strong { font-size: 31px; }
    .admin-page-heading { display: block; margin-bottom: 22px; }
    .admin-primary-action { margin-top: 20px; }
    .admin-post-row { grid-template-columns: 58px minmax(0, 1fr); gap: 12px; padding: 13px 14px; }
    .admin-post-image { height: 57px; }
    .admin-post-meta { grid-column: 2; display: flex; justify-content: space-between; justify-items: unset; }
    .admin-post-copy h3 { font-size: 14px; }
    .panel-heading { padding: 20px 15px 17px; }
    .panel-heading h2 { font-size: 20px; }
    .editor-form { grid-template-columns: 1fr; gap: 15px; }
    .editor-panel { padding: 18px; }
    .editor-title-field input { font-size: 24px; }
    .pro-login { width: min(100% - 30px, 1010px); min-height: 0; padding: 43px 0; }
    .pro-login-intro h1 { font-size: clamp(43px, 14vw, 62px); }
    .pro-login-card { padding: 24px 20px; }
}