:root {
    --bg:#f5f7fb;
    --panel:#fff;
    --text:#1c2940;
    --muted:#58677e;
    --accent:#315bd7;
    --danger:#b32c3d;
    --ok:#176747;
    --line:#dce3ee;
    --radius:14px
}
* {
    box-sizing:border-box
}
body {
    margin:0;
    font:15px/1.55 system-ui,"Segoe UI",sans-serif;
    background:var(--bg);
    color:var(--text)
}
a {
    color:var(--accent);
    text-underline-offset:3px
}
button,input,select,textarea {
    font:inherit
}
button,a,input,select,textarea,summary {
    touch-action:manipulation
}
:focus-visible {
    outline:3px solid #789cf0;
    outline-offset:3px
}
.layout {
    display:grid;
    grid-template-columns:220px minmax(0,1fr);
    min-height:100vh
}
.sidebar {
    background:var(--panel);
    padding:30px 18px;
    border-right:1px solid var(--line)
}
.brand {
    font-weight:750;
    font-size:18px;
    margin-bottom:28px
}
.brand small {
    display:block;
    font-weight:400;
    font-size:12px;
    color:var(--muted);
    margin-top:4px
}
.sidebar nav {
    display:flex;
    flex-direction:column;
    gap:6px
}
.sidebar nav a {
    color:var(--muted);
    text-decoration:none;
    padding:11px 14px;
    border-radius:9px
}
.sidebar nav a.active,.sidebar nav a:hover {
    background:#eef2ff;
    color:var(--accent)
}
.userbox {
    margin-top:36px;
    font-size:13px;
    color:var(--muted);
    display:flex;
    flex-direction:column;
    gap:10px
}
.userbox button {
    padding:7px 12px
}
.main {
    padding:34px clamp(18px,3vw,48px);
    min-width:0;
    max-width:1700px;
    width:100%
}
h1 {
    margin:0 0 10px;
    font-size:28px;
    letter-spacing:-.6px;
    line-height:1.25
}
h2 {
    margin:28px 0 14px;
    font-size:19px
}
p {
    margin:0 0 18px
}
.page-intro {
    color:var(--muted);
    margin-bottom:24px
}
.cards {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px
}
.cards article,.panel {
    background:var(--panel);
    padding:22px;
    border-radius:var(--radius);
    border:1px solid var(--line)
}
.cards .n {
    font-size:32px;
    font-weight:700;
    line-height:1.3;
    margin-bottom:6px
}
.table-wrap {
    overflow:auto;
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:var(--panel)
}
.table {
    width:100%;
    border-collapse:collapse;
    background:var(--panel)
}
.table th,.table td {
    padding:14px 16px;
    border-bottom:1px solid var(--line);
    text-align:left;
    vertical-align:top
}
.table tr:last-child td {
    border-bottom:0
}
.table th {
    background:#f8faff;
    color:var(--muted);
    font-weight:600;
    font-size:12px;
    white-space:nowrap
}
.table tbody tr:hover {
    background:#fafbff
}
.table td {
    overflow-wrap:anywhere
}
.table .publication {
    min-width:220px;
    max-width:480px
}
.table td.date {
    white-space:nowrap
}
.table td.empty {
    padding:40px 24px;
    text-align:center
}
.empty strong {
    display:block;
    color:var(--text);
    margin-bottom:7px
}
.muted,small {
    color:var(--muted)
}
.btn,button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    background:var(--accent);
    color:#fff;
    border:1px solid transparent;
    padding:10px 16px;
    border-radius:9px;
    cursor:pointer;
    text-decoration:none;
    font:inherit;
    font-weight:550;
    line-height:1.35;
    min-height:42px
}
.btn:hover,button:hover {
    filter:brightness(.95)
}
.btn.ghost,button.ghost {
    background:#fff;
    border-color:var(--line);
    color:var(--text)
}
button.danger {
    background:#fff;
    border-color:#e4b7bd;
    color:var(--danger)
}
button:disabled {
    opacity:.45;
    cursor:not-allowed
}
.toolbar,.actions {
    display:flex;
    gap:10px;
    align-items:center;
    flex-wrap:wrap;
    margin:18px 0
}
.toolbar {
    justify-content:space-between
}
.toolbar h1 {
    margin:0
}
.row-actions {
    min-width:190px
}
.row-actions form {
    display:inline-block;
    margin:4px 2px
}
.row-actions button {
    padding:6px 9px;
    font-size:12px;
    min-height:34px
}
.form {
    max-width:800px;
    display:flex;
    flex-direction:column;
    gap:18px
}
.form>label,.field {
    display:flex;
    flex-direction:column;
    gap:6px;
    font-weight:550
}
.form input:not([type=checkbox]),.form textarea,.form select,.filters input,.filters select,.login-card input {
    width:100%;
    padding:10px 12px;
    border-radius:9px;
    border:1px solid #c8d2e1;
    background:#fff;
    color:var(--text);
    min-height:44px
}
.form textarea {
    min-height:88px;
    resize:vertical
}
.form small,.field small {
    font-weight:400
}
.field-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px
}
.filters {
    padding:20px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:#fff;
    margin-bottom:20px
}
.filter-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px
}
.filter-actions {
    display:flex;
    gap:10px;
    align-items:center;
    margin-top:16px
}
.filters details {
    margin-top:16px
}
.filters details .filter-grid {
    margin-top:14px
}
.check,.cols label {
    display:flex!important;
    flex-direction:row!important;
    gap:9px;
    align-items:center;
    font-weight:400!important
}
input[type=checkbox] {
    width:18px;
    height:18px;
    accent-color:var(--accent);
    flex-shrink:0
}
.st {
    display:inline-block;
    padding:4px 10px;
    border-radius:999px;
    font-size:12px;
    font-weight:600;
    background:#eef1f7;
    white-space:nowrap
}
.st-success,.st-completed {
    background:#e6f5ec;
    color:var(--ok)
}
.st-failed {
    background:#fff0f1;
    color:var(--danger)
}
.st-partial,.st-processing,.st-pending {
    background:#fff3d7;
    color:#795700
}
.login-body {
    min-height:100vh;
    display:grid;
    place-items:center;
    padding:20px
}
.login-card {
    width:min(100%,410px);
    background:var(--panel);
    padding:32px;
    border:1px solid var(--line);
    border-radius:18px;
    display:flex;
    flex-direction:column;
    gap:14px;
    box-shadow:0 15px 60px #223a6610
}
.login-card h1 {
    font-size:24px
}
.login-card p {
    color:var(--muted);
    margin-bottom:6px
}
.alert {
    background:#fff0f1;
    border:1px solid #ebc1c6;
    color:#8e2432;
    padding:13px 16px;
    border-radius:10px;
    margin-bottom:18px
}
.alert-success {
    background:#edf9f1;
    border-color:#bfe2cc;
    color:var(--ok)
}
.export-box,.advanced {
    background:#fff;
    border:1px solid var(--line);
    padding:16px 20px;
    border-radius:var(--radius);
    margin:16px 0
}
summary {
    cursor:pointer;
    font-weight:600
}
.cols {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:18px 0
}
.pager {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
    margin-top:20px
}
.pager a {
    padding:8px 12px;
    border:1px solid var(--line);
    background:#fff;
    border-radius:8px;
    text-decoration:none;
    color:var(--text)
}
.pager a.active {
    background:var(--accent);
    color:#fff;
    border-color:var(--accent)
}
.skip-link {
    position:absolute;
    left:16px;
    top:-100px;
    background:#fff;
    padding:12px;
    z-index:10
}
.skip-link:focus {
    top:12px
}
.hint {
    font-size:13px;
    color:var(--muted)
}
.advanced .field-grid {
    margin-top:16px
}
.content-preview {
    margin-top:8px;
    font-size:13px;
    color:var(--muted)
}
.content-preview summary {
    font-weight:400
}
.content-preview p {
    white-space:pre-wrap;
    max-width:600px;
    margin:8px 0
}
.sr-only {
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0
}
@media(max-width:1100px) {
    .cards,.filter-grid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .cols {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .layout {
        grid-template-columns:190px minmax(0,1fr)
    }
}
@media(max-width:700px) {
    .layout {
        grid-template-columns:minmax(0,1fr)
    }
    .sidebar {
        padding:16px 18px;
        border-right:0;
        border-bottom:1px solid var(--line)
    }
    .brand {
        margin-bottom:14px
    }
    .brand small {
        display:none
    }
    .sidebar nav {
        flex-direction:row;
        flex-wrap:wrap;
        gap:4px
    }
    .sidebar nav a {
        padding:8px 10px;
        font-size:13px
    }
    .userbox {
        margin-top:14px;
        flex-direction:row;
        align-items:center;
        justify-content:space-between
    }
    .main {
        padding:24px 16px
    }
    .cards {
        gap:10px
    }
    .cards article {
        padding:16px
    }
    .cards .n {
        font-size:25px
    }
    h1 {
        font-size:25px
    }
    .field-grid,.filter-grid,.cols {
        grid-template-columns:minmax(0,1fr)
    }
    .toolbar {
        align-items:flex-start
    }
    .table th,.table td {
        padding:12px
    }
    .filter-actions {
        flex-wrap:wrap
    }
    .actions .btn,.actions button {
        flex:1
    }
    .form {
        gap:16px
    }
}
