:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, sans-serif; background: #0b1020; color: #eef2ff; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 280px; }
main { width: min(100% - 2rem, 72rem); margin: 0 auto; padding: 2rem 0 4rem; }
.hero { padding: 1rem 0 1.5rem; }
.eyebrow { color: #8ea7ff; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
h1 { margin: .25rem 0; font-size: clamp(2rem, 8vw, 4rem); }
.lede, .created, #selection-status { color: #aeb9d6; }
.toolbar { position: sticky; top: 0; z-index: 2; display: flex; flex-wrap: wrap; gap: .65rem; align-items: center; padding: .85rem; background: rgba(11,16,32,.96); border: 1px solid #293354; border-radius: 1rem; }
button, .open { min-height: 44px; border: 1px solid #5973d8; border-radius: .75rem; padding: .7rem 1rem; background: #18244a; color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .5; }
.reports { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); gap: 1rem; margin-top: 1.25rem; }
.report { display: grid; grid-template-columns: auto 1fr; gap: .85rem; align-items: start; padding: 1.1rem; border: 1px solid #293354; border-radius: 1rem; background: #111a33; }
.report input { width: 1.4rem; height: 1.4rem; margin-top: .2rem; accent-color: #8ea7ff; }
.report-body { min-width: 0; }
.report h2 { margin: 0 0 .45rem; overflow-wrap: anywhere; font-size: 1.15rem; }
.created { display: block; margin-bottom: 1rem; font-size: .9rem; }
.open { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.empty { padding: 2rem; border: 1px dashed #44527c; border-radius: 1rem; text-align: center; }
@media (max-width: 36rem) { main { width: min(100% - 1rem, 72rem); padding-top: .75rem; } .toolbar button { flex: 1 1 8rem; } #selection-status { flex-basis: 100%; } }