* { box-sizing: border-box; }
body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; background: #f6f7f9; color: #1f2330; line-height: 1.5; }
header { background: #1c2c4d; color: #fff; padding: 14px 28px; display: flex; align-items: center; gap: 28px; }
header .brand a { color: #fff; text-decoration: none; font-weight: 600; }
header .brand .muted { color: #a6b0c2; font-weight: 400; }
header nav { display: flex; gap: 18px; flex: 1; }
header nav a { color: #d8dde8; text-decoration: none; font-size: 14px; }
header nav a:hover { color: #fff; }
header .user { display: flex; align-items: center; gap: 12px; font-size: 13px; }
header .user .muted { color: #a6b0c2; }
header form.inline { margin: 0; display: inline; }
button.link { background: none; border: 0; color: #d8dde8; cursor: pointer; padding: 0; font-size: 13px; text-decoration: underline; }
main { max-width: 1100px; margin: 28px auto; padding: 0 28px; }
footer { text-align: center; padding: 30px; color: #888; }
.muted { color: #6b7180; }
.small { font-size: 12px; }
h1 { font-size: 22px; margin-top: 0; }
h2 { font-size: 17px; margin: 24px 0 12px; }
section { background: #fff; padding: 18px 22px; border: 1px solid #e3e6ec; border-radius: 8px; margin-bottom: 18px; }
table { width: 100%; border-collapse: collapse; font-size: 14px; }
table th, table td { padding: 8px 10px; text-align: left; border-bottom: 1px solid #eef0f4; }
table th { font-weight: 500; color: #6b7180; font-size: 12px; text-transform: uppercase; }
table a { color: #2050b8; text-decoration: none; }
.badge { padding: 2px 8px; border-radius: 12px; font-size: 11px; text-transform: uppercase; background: #eee; color: #555; }
.badge.done { background: #d6efd9; color: #1d6f29; }
.badge.failed { background: #f8d7d7; color: #a01818; }
.badge.running { background: #fff4cc; color: #8a6d00; }
.badge.pending { background: #e3e6ec; color: #555; }
form { display: flex; flex-direction: column; gap: 10px; max-width: 420px; }
form label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: #555; }
form input, form select { padding: 9px 10px; font-size: 14px; border: 1px solid #ccd0d8; border-radius: 6px; background: #fff; }
button.primary { background: #1c2c4d; color: #fff; border: 0; padding: 10px 18px; border-radius: 6px; font-size: 14px; cursor: pointer; align-self: start; }
button.primary:hover { background: #28406d; }
.error { background: #f8d7d7; color: #a01818; padding: 10px 14px; border-radius: 6px; margin-bottom: 12px; }
.login-card { max-width: 380px; margin: 60px auto; background: #fff; padding: 28px; border: 1px solid #e3e6ec; border-radius: 10px; }
.upload-card form { flex-direction: row; align-items: end; gap: 12px; max-width: none; }
.run-check form { flex-direction: row; align-items: end; gap: 12px; }
.check-card { border: 1px solid #e3e6ec; border-radius: 8px; padding: 14px 18px; margin-bottom: 12px; background: #fafbfc; }
.check-card header { background: none; color: inherit; padding: 0; display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap; }
.link-button { background: #1c2c4d; color: #fff; padding: 4px 10px; border-radius: 4px; font-size: 12px; text-decoration: none; margin-left: auto; }
.link-button:hover { background: #28406d; }
.check-card h3 { margin: 0 0 4px; font-size: 15px; font-weight: 600; }
.check-card .result { white-space: pre-wrap; word-break: break-word; font-family: ui-monospace, monospace; background: #fff; border: 1px solid #eef0f4; padding: 12px; border-radius: 6px; font-size: 13px; max-height: 600px; overflow: auto; }
.messages { display: flex; flex-direction: column; gap: 10px; }
.msg { padding: 12px 16px; border-radius: 8px; max-width: 80%; }
.msg.user { background: #1c2c4d; color: #fff; align-self: flex-end; }
.msg.assistant { background: #fff; border: 1px solid #e3e6ec; }
.msg .role { font-size: 12px; opacity: 0.8; margin-bottom: 4px; }
.msg .content { white-space: pre-wrap; word-break: break-word; font-size: 14px; }