:root { --bg: #f4f5f6; --surface: #fff; --ink: #121416; --muted: #66707a; --line: #dce0e4; --accent: #ff4c20; --green: #16794a; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: Arial, Helvetica, sans-serif; font-size: 15px; line-height: 1.45; }
a { color: inherit; }
button, input, textarea, select { font: inherit; letter-spacing: 0; }
.admin-header { position: sticky; z-index: 20; top: 0; min-height: 62px; display: flex; align-items: center; gap: 30px; padding: 0 24px; background: #101214; color: #fff; }
.admin-brand { color: #fff; font-size: 17px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.admin-header nav { display: flex; align-self: stretch; overflow-x: auto; }
.admin-header nav a { display: flex; align-items: center; padding: 0 13px; color: #c7ccd1; font-size: 13px; text-decoration: none; white-space: nowrap; }
.admin-header nav a:hover { background: #24272a; color: #fff; }
.admin-actions { margin-left: auto; display: flex; align-items: center; gap: 16px; white-space: nowrap; }
.admin-actions a, .admin-actions button { color: #bfc5cb; background: none; border: 0; font-size: 13px; cursor: pointer; }
.admin-actions form { margin: 0; }
.admin-main { width: min(1440px, calc(100% - 48px)); margin: 0 auto; padding: 46px 0 90px; }
.admin-title { min-height: 78px; display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 32px; }
.admin-title p { margin: 0 0 4px; color: var(--muted); font-size: 12px; text-transform: uppercase; }
.admin-title h1 { margin: 0; font-size: 34px; line-height: 1.15; }
.admin-title > a:not(.admin-button) { color: var(--muted); }
.admin-button { display: inline-flex; min-height: 42px; align-items: center; justify-content: center; padding: 0 18px; border: 1px solid #151719; border-radius: 4px; background: #151719; color: #fff; font-size: 14px; font-weight: 700; text-decoration: none; cursor: pointer; }
.admin-button:hover { background: #303438; }
.flash { margin-bottom: 24px; padding: 12px 16px; border-left: 4px solid var(--green); background: #eaf7f0; }
.metrics { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--line); background: var(--surface); }
.metrics a { min-height: 135px; display: flex; flex-direction: column; justify-content: space-between; padding: 24px; border-right: 1px solid var(--line); text-decoration: none; }
.metrics a:last-child { border-right: 0; }
.metrics strong { font-size: 42px; line-height: 1; }
.metrics span { color: var(--muted); }
.admin-section { margin-top: 46px; }
.admin-section h2 { font-size: 20px; }
.quick-links { display: flex; flex-wrap: wrap; border-top: 1px solid var(--line); }
.quick-links a { padding: 17px 28px 17px 0; margin-right: 28px; }
.admin-table-wrap { overflow-x: auto; border: 1px solid var(--line); background: var(--surface); }
.admin-table { width: 100%; border-collapse: collapse; }
.admin-table th, .admin-table td { padding: 15px 16px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.admin-table th { color: var(--muted); background: #f9fafb; font-size: 12px; text-transform: uppercase; }
.admin-table td:nth-child(1) { white-space: nowrap; }
.admin-table tbody tr:last-child td { border-bottom: 0; }
.admin-table strong, .applications-table td:nth-child(2) a { display: block; }
.status { display: inline-block; padding: 4px 8px; border-radius: 3px; font-size: 12px; }
.status.published { background: #e4f5eb; color: var(--green); }
.status.draft { background: #eee; color: var(--muted); }
.row-actions { display: flex; justify-content: flex-end; gap: 14px; white-space: nowrap; }
.row-actions form { margin: 0; }
.row-actions button { padding: 0; color: #a32e20; border: 0; background: none; text-decoration: underline; cursor: pointer; }
.editor-form, .settings-form fieldset { max-width: 900px; }
.editor-form { display: grid; gap: 23px; padding: 30px; border: 1px solid var(--line); background: var(--surface); }
.editor-form label:not(.check-field), .settings-grid label { display: grid; gap: 8px; color: var(--muted); font-size: 13px; }
.editor-form input:not([type="checkbox"]), .editor-form textarea, .settings-form input, .settings-form textarea, .filters input, .filters select, .applications-table select { width: 100%; padding: 11px 12px; color: var(--ink); border: 1px solid #cbd0d5; border-radius: 3px; background: #fff; font-size: 15px; }
.editor-form textarea, .settings-form textarea { resize: vertical; }
.editor-form > .admin-button { width: max-content; margin-top: 12px; }
.check-field { display: flex; gap: 9px; align-items: center; }
.check-field input { width: 18px; height: 18px; accent-color: var(--accent); }
.upload-trigger { width: max-content; padding: 5px 9px; border: 1px solid var(--line); border-radius: 3px; background: #f6f7f8; color: var(--ink); font-size: 12px; cursor: pointer; }
.settings-form fieldset { margin: 0 0 28px; padding: 25px 28px 30px; border: 1px solid var(--line); background: var(--surface); }
.settings-form legend { padding: 0 8px; font-size: 18px; font-weight: 700; text-transform: uppercase; }
.settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.filters { display: grid; grid-template-columns: minmax(260px, 1fr) 180px auto; gap: 12px; margin-bottom: 22px; }
.applications-table { min-width: 940px; }
.applications-table td:nth-child(2) { min-width: 190px; }
.applications-table td:nth-child(3) { min-width: 280px; }
.login-page { min-height: 100svh; display: grid; place-items: center; padding: 24px; background: #101214; }
.login-panel { width: min(430px, 100%); padding: 38px; border-radius: 6px; background: #fff; }
.login-brand { color: var(--accent); font-weight: 700; }
.login-panel h1 { margin: 0 0 28px; font-size: 30px; }
.login-panel form { display: grid; gap: 18px; margin-bottom: 22px; }
.login-panel label { display: grid; gap: 7px; color: var(--muted); font-size: 13px; }
.login-panel input { padding: 12px; border: 1px solid var(--line); border-radius: 3px; }
.login-error { padding: 10px; background: #feecea; color: #9a2017; }
@media (max-width: 1000px) { .admin-header { flex-wrap: wrap; gap: 8px 22px; padding: 10px 18px; } .admin-header nav { order: 3; width: 100%; height: 42px; } .admin-actions { margin-left: auto; } .metrics { grid-template-columns: repeat(2, 1fr); } .metrics a { border-bottom: 1px solid var(--line); } }
@media (max-width: 680px) { .admin-main { width: calc(100% - 28px); padding-top: 28px; } .admin-actions a { display: none; } .admin-title { align-items: stretch; flex-direction: column; } .metrics { grid-template-columns: 1fr 1fr; } .settings-grid { grid-template-columns: 1fr; } .settings-form fieldset { padding: 20px 16px; } .editor-form { padding: 20px 16px; } .filters { grid-template-columns: 1fr; } }