:root { --bg:#f4f6f8; --card:#fff; --text:#20252b; --muted:#66717d; --line:#dbe1e7; --blue:#1769aa; --blue2:#0f5084; --red:#b42318; --green:#16794b; --amber:#9a6700; font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif; color:var(--text); }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); line-height:1.45; }
a { color:var(--blue); }
.topbar { min-height:60px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:0 4vw; color:#fff; background:#152536; }
.topbar a { color:#fff; text-decoration:none; }
.brand { font-size:1.2rem; font-weight:750; white-space:nowrap; }
nav { display:flex; gap:18px; align-items:center; flex-wrap:wrap; }
.container { width:min(1180px,92vw); margin:32px auto 64px; }
.page-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:22px; }
h1 { margin:.25rem 0 1rem; line-height:1.2; } h2 { margin-top:0; } h3 { margin:.2rem 0 .5rem; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:24px; margin:20px 0; box-shadow:0 1px 2px rgba(0,0,0,.03); }
.narrow { max-width:560px; margin:40px auto; } .empty { text-align:center; padding:48px; }
form label { display:block; font-weight:650; margin:0 0 16px; }
input, select, button, .button { font:inherit; }
input[type=text], input[type=password], input:not([type]), select, input[type=file] { width:100%; padding:10px 12px; margin-top:6px; border:1px solid #aeb8c2; border-radius:6px; background:#fff; }
button, .button { display:inline-block; border:1px solid #9da8b3; background:#fff; color:var(--text); border-radius:6px; padding:9px 14px; cursor:pointer; text-decoration:none; }
button:hover, .button:hover { background:#eef2f5; } button:disabled { opacity:.5; cursor:not-allowed; }
.primary { color:#fff; background:var(--blue); border-color:var(--blue); } .primary:hover { background:var(--blue2); }
.danger { color:#fff; background:var(--red); border-color:var(--red); }
.inline { display:inline; margin:0; } .link-button { padding:0; border:0; color:#fff; background:transparent; }
.flash { padding:12px 16px; margin:12px 0; border-radius:6px; border:1px solid; }
.flash.error { color:#842018; background:#fff0ee; border-color:#f3b8b2; } .flash.success { color:#105c39; background:#eaf8f1; border-color:#a8ddc4; }
.notice { background:#fff8df; border-left:4px solid #d6a400; padding:10px 12px; }
.table-wrap { overflow-x:auto; background:#fff; border:1px solid var(--line); border-radius:9px; }
table { width:100%; border-collapse:collapse; } th, td { text-align:left; padding:12px 14px; border-bottom:1px solid var(--line); vertical-align:top; } th { background:#edf1f4; } tr:last-child td { border-bottom:0; }
.nowrap { white-space:nowrap; } small { display:block; color:var(--muted); }
.status { display:inline-block; padding:3px 8px; border-radius:999px; font-size:.85rem; color:#36414b; background:#e5e9ed; white-space:nowrap; }
.status.succeeded,.status.prepared,.status.submitted,.status.ready_to_submit { color:#075a35; background:#d9f5e7; }
.status.failed { color:#8f2018; background:#fee4e2; } .status.queued,.status[class*="queued_"] { color:#795800; background:#fff1c2; } .status.running,.status[class*="running_"] { color:#075985; background:#dff3ff; }
.status.large { font-size:1rem; padding:6px 12px; }
.summary-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.summary-grid div { display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:8px; padding:16px; }
.summary-grid strong { font-size:1.4rem; } .summary-grid span { color:var(--muted); }
.action-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.action-grid form { border:1px solid var(--line); border-radius:8px; padding:16px; } .action-grid p { color:var(--muted); min-height:44px; }
.action-grid .danger-zone { border-color:#efaaa5; }
.check { font-weight:400; } .check input { margin-right:7px; }
.file-list { list-style:none; padding:0; margin:0; } .file-list li { display:flex; justify-content:space-between; gap:20px; padding:10px 0; border-bottom:1px solid var(--line); } .file-list li:last-child { border:0; } .file-list span { color:var(--muted); font-size:.9rem; }
details { border-top:1px solid var(--line); padding:12px 0; } summary { cursor:pointer; } pre { white-space:pre-wrap; overflow-wrap:anywhere; background:#f5f7f9; border-radius:6px; padding:12px; font-size:.85rem; } .job-error { color:#842018; background:#fff0ee; }
.split { display:flex; align-items:flex-start; gap:20px; } .split > .card { margin:0; min-width:310px; } .split .grow { flex:1; } .actions { min-width:330px; } .reset-form { display:flex; gap:6px; margin-top:8px; } .reset-form input { margin:0; }
.admin-delete { margin-top:32px; padding-top:20px; border-top:1px solid var(--line); }
@media (max-width:800px) { .topbar,.page-heading,.split { align-items:flex-start; flex-direction:column; padding-top:14px; padding-bottom:14px; } .summary-grid,.action-grid { grid-template-columns:1fr 1fr; } nav { gap:12px; } .split > .card { width:100%; min-width:0; } }
@media (max-width:520px) { .summary-grid,.action-grid { grid-template-columns:1fr; } .container { width:94vw; margin-top:20px; } .card { padding:17px; } .file-list li { flex-direction:column; gap:2px; } }