/* The portal's whole stylesheet.

   Same visual language as the public pages in site/index.html: cream ground,
   near-black green text, Georgia for headings, system sans for body. No build
   step, no CDN, no webfont — the Content-Security-Policy in app.py allows this
   origin and nothing else, so anything imported from outside would simply fail
   to load.

   The one rule here that carries meaning rather than taste is .coverage: the
   band that says what was checked is boxed and full width at the top of the
   report, so it cannot be skimmed past on the way to the findings. */

*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  background: #f7f5ef;
  color: #17211b;
  line-height: 1.6;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI",
               Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

.wrap { max-width: 52rem; margin: 0 auto; padding: 0 1.5rem; }

a { color: #17211b; text-decoration-color: #9ca99f; text-underline-offset: 3px; }
a:hover { text-decoration-color: #17211b; }

h1, h2, h3 { font-family: Georgia, "Times New Roman", serif; font-weight: 500; }
h1 { font-size: 1.9rem; letter-spacing: -.02em; margin: 1.6rem 0 .8rem; }
h2 { font-size: 1.4rem; letter-spacing: -.015em; margin: 2rem 0 .7rem; }
h3 { font-size: 1.05rem; margin: 1.4rem 0 .4rem; }
p { margin: 0 0 1rem; max-width: 44rem; }
ul { margin: 0 0 1rem; padding-left: 1.15rem; max-width: 44rem; }
li { margin-bottom: .4rem; }
.quiet { color: #55605a; }
.small { font-size: .87rem; }

nav { border-bottom: 1px solid #ddd8cc; background: #f7f5ef; }
nav .wrap { display: flex; align-items: baseline; gap: 1.5rem;
            padding: 1rem 1.5rem; }
nav .brand { font-weight: 700; font-size: 1.05rem; text-decoration: none; }
nav a:not(.brand) { font-size: .9rem; color: #55605a; text-decoration: none; }
nav a:not(.brand):hover { color: #17211b; }
nav .spacer { flex: 1; }
nav form { margin: 0; }

main { padding-bottom: 3rem; }

footer { border-top: 1px solid #ddd8cc; margin-top: 3rem;
         padding: 1.5rem 0 2.5rem; font-size: .85rem; color: #55605a; }

/* Forms */

form.stacked { max-width: 34rem; margin: 1.5rem 0; }
label { display: block; font-weight: 650; font-size: .92rem; margin: 1.1rem 0 .3rem; }
input[type=password], input[type=text], input[type=file] {
  width: 100%; padding: .55rem .6rem; font: inherit; font-size: .95rem;
  border: 1px solid #ddd8cc; border-radius: 6px; background: #fffdf7;
  color: #17211b;
}
.hint { font-size: .82rem; color: #55605a; margin: .3rem 0 0; }
button {
  font: inherit; font-size: .95rem; font-weight: 650; cursor: pointer;
  padding: .55rem 1.1rem; border-radius: 6px; border: 1px solid #17211b;
  background: #17211b; color: #f7f5ef; margin-top: 1.4rem;
}
button:hover { background: #263429; }
button.linkish {
  background: none; border: 0; color: #55605a; padding: 0; margin: 0;
  font-size: .9rem; font-weight: 400; text-decoration: underline;
  text-decoration-color: #9ca99f;
}
button.linkish:hover { color: #17211b; }

.error {
  border: 1px solid #a8624f; border-left-width: 4px; border-radius: 6px;
  background: #fdf3ef; padding: .7rem .9rem; margin: 1.2rem 0; max-width: 44rem;
}

/* Run list and run page */

table { border-collapse: collapse; width: 100%; margin: 1rem 0 2rem;
        font-size: .92rem; }
th, td { text-align: left; padding: .45rem .6rem; border-bottom: 1px solid #e6e1d5;
         vertical-align: top; }
th { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em;
     color: #55605a; font-weight: 700; }
td.num, th.num { text-align: right; }
.table-scroll { overflow-x: auto; }

.badge {
  display: inline-block; padding: .12rem .5rem; border-radius: 999px;
  font-size: .72rem; font-weight: 700; letter-spacing: .07em;
  text-transform: uppercase; border: 1px solid #9ca99f; color: #3a4640;
}
.badge.running { border-color: #3f6b4a; color: #3f6b4a; }
.badge.done { border-color: #3f6b4a; color: #3f6b4a; background: #eef4ee; }
.badge.failed { border-color: #a8624f; color: #a8624f; background: #fdf3ef; }
.badge.parked { border-color: #8a6a3a; color: #8a6a3a; }

.events { list-style: none; padding: 0; margin: 1rem 0; font-size: .92rem;
          border-top: 1px solid #e6e1d5; }
.events li { border-bottom: 1px solid #e6e1d5; padding: .4rem 0; margin: 0;
             display: flex; gap: .8rem; }
.events .stage { color: #55605a; font-size: .8rem; min-width: 7rem;
                 text-transform: uppercase; letter-spacing: .05em; }

/* The report */

.coverage {
  border: 2px solid #17211b; border-radius: 10px; background: #fffdf7;
  padding: 1.2rem 1.4rem; margin: 1.5rem 0 2rem;
}
.coverage h2 { margin-top: 0; }
.coverage ul { margin-bottom: 1rem; }
.coverage .caveat {
  border-left: 3px solid #17211b; padding: .2rem 0 .2rem 1rem; margin: 1rem 0 0;
  font-weight: 650;
}
.coverage .note { border-left: 3px solid #9ca99f; padding: .2rem 0 .2rem 1rem;
                  margin: .8rem 0 0; color: #3a4640; }

.finding {
  border: 1px solid #ddd8cc; border-radius: 8px; background: #fffdf7;
  padding: 1rem 1.2rem; margin: 1rem 0;
}
.finding h3 { margin-top: 0; }
.finding .passage {
  border-left: 3px solid #9ca99f; padding: .2rem 0 .2rem 1rem; margin: .8rem 0;
  color: #3a4640;
}
.finding .facts { list-style: none; padding: 0; margin: .8rem 0 0;
                  font-size: .9rem; }
.finding .facts li { margin-bottom: .25rem; }
.finding .facts .key { color: #55605a; }
.source { margin: .5rem 0; font-size: .93rem; }
.source .where { color: #55605a; font-size: .82rem; display: block; }

pre { background: #fffdf7; border: 1px solid #ddd8cc; border-radius: 6px;
      padding: .8rem; overflow-x: auto; font-size: .85rem; line-height: 1.45; }
code { font-size: .9em; }
