:root { color-scheme: light; font-family: system-ui, sans-serif; color: #152d39; background: #f3f6f7; }
* { box-sizing: border-box; }
body { margin: 0; }
[hidden] { display: none !important; }
header { display: flex; align-items: center; justify-content: space-between; padding: 1.2rem 2rem; background: #163d48; color: #fff; }
header strong { font-size: 1.3rem; letter-spacing: .04em; }
.subtitle { margin-left: 1rem; color: #c6e4e6; }
main { max-width: 1500px; margin: auto; padding: 2rem; }
.card { max-width: 600px; margin: 3rem auto; background: #fff; border: 1px solid #d4e1e5; border-radius: 12px; padding: 2rem; }
h1 { font-size: 1.5rem; margin: .75rem 0; }
p { line-height: 1.7; }
.eyebrow { color: #187377; font-size: .8rem; letter-spacing: .1em; }
.muted { color: #50656e; font-size: .85rem; }
label { display: block; margin-bottom: .5rem; }
input { width: 100%; padding: .75rem; margin-bottom: 1rem; border: 1px solid #78959e; border-radius: 6px; font: inherit; }
button { cursor: pointer; padding: .6rem 1rem; border: 1px solid #829ca4; border-radius: 6px; background: #fff; color: #163d48; font: inherit; }
button:hover:not(:disabled), button[aria-current="page"] { background: #163d48; color: white; }
button:disabled { cursor: default; opacity: .45; }
button:focus-visible, input:focus-visible, .table-wrap:focus-visible { outline: 3px solid #009c9a; outline-offset: 3px; }
.notice { padding: .8rem 1rem; background: #e1eeef; border-left: 3px solid #308789; }
#notice { color: #8a3c0b; }
nav { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.5rem 0; }
.toolbar { display: flex; align-items: center; justify-content: space-between; }
.table-wrap { overflow: auto; border: 1px solid #d4e1e5; border-radius: 8px; background: white; }
table { border-collapse: collapse; width: 100%; font-size: .85rem; }
th, td { text-align: left; padding: .8rem; border-bottom: 1px solid #e4ebed; vertical-align: top; min-width: 100px; max-width: 350px; overflow-wrap: anywhere; }
th { background: #e9f0f2; white-space: nowrap; }
td { font-variant-numeric: tabular-nums; }
.pagination { display: flex; align-items: center; justify-content: flex-end; gap: 1rem; margin-top: 1rem; }
.import-panel { max-width: none; margin: 1rem 0; }
.import-panel summary { cursor: pointer; font-weight: 600; }
.import-panel select { padding: .6rem; margin-bottom: 1rem; font: inherit; }
.import-panel pre { white-space: pre-wrap; overflow-wrap: anywhere; }
#ai-targets { width: 100%; font: inherit; resize: vertical; margin-bottom: 1rem; }
#ai-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
#ai-actions button { overflow-wrap: anywhere; max-width: 100%; }
#assignment-candidates { max-height: 22rem; overflow: auto; margin: 1rem 0; }
#assignment-candidates label { display: flex; gap: .5rem; align-items: baseline; overflow-wrap: anywhere; }
#assignment-candidates input { width: auto; flex-shrink: 0; margin: .5rem 0; }
#assignment-nodes { width: 100%; min-height: 5rem; padding: .75rem; margin-bottom: 1rem; font: inherit; }
@media (max-width: 650px) { main { padding: 1rem; } header { padding: 1rem; } .subtitle { display: none; } .card { margin: 1rem auto; padding: 1rem; } }
