/* Neptune house stylesheet — LaTeX-paper aesthetic after latex.css
   (vincentdoerig/latex-css, MIT). Shared by the login page, the portal,
   and the tool report pages. Light default + dark, with an explicit
   [data-theme] override that beats the media query. */

:root {
  --body-color: hsl(0, 5%, 12%);
  --body-bg: hsl(210, 20%, 98%);
  --paper: hsl(0, 0%, 100%);
  --muted: hsl(0, 0%, 42%);
  --rule: hsl(0, 0%, 82%);
  --accent: hsl(0, 100%, 33%);          /* oxblood */
  --accent-soft: hsl(0, 60%, 45%);
  --field-bg: hsl(0, 0%, 100%);
  --field-border: hsl(210, 8%, 72%);
  --focus: hsl(220, 90%, 52%);
  --ok: hsl(140, 55%, 32%);
  --warn: hsl(35, 90%, 38%);
  --bad: hsl(0, 75%, 42%);
  --shadow: 0 1px 2px hsl(210 20% 50% / .08), 0 4px 16px hsl(210 20% 40% / .06);
  --serif: 'Latin Modern', Georgia, Cambria, 'Times New Roman', Times, serif;
  --mono: 'Latin Modern Mono', ui-monospace, 'SF Mono', 'Cascadia Code', Menlo, monospace;
}
@media (prefers-color-scheme: dark) {
  :root {
    --body-color: hsl(0, 0%, 87%);
    --body-bg: hsl(0, 0%, 14%);
    --paper: hsl(0, 0%, 18%);
    --muted: hsl(0, 0%, 62%);
    --rule: hsl(0, 0%, 32%);
    --accent: hsl(196, 80%, 72%);
    --accent-soft: hsl(196, 60%, 66%);
    --field-bg: hsl(0, 0%, 12%);
    --field-border: hsl(0, 0%, 40%);
    --focus: hsl(215, 63%, 73%);
    --ok: hsl(140, 45%, 62%);
    --warn: hsl(38, 85%, 62%);
    --bad: hsl(0, 75%, 68%);
    --shadow: 0 1px 2px hsl(0 0% 0% / .3), 0 4px 16px hsl(0 0% 0% / .25);
  }
}
:root[data-theme="light"] {
  --body-color: hsl(0, 5%, 12%); --body-bg: hsl(210, 20%, 98%); --paper: hsl(0,0%,100%);
  --muted: hsl(0,0%,42%); --rule: hsl(0,0%,82%); --accent: hsl(0,100%,33%);
  --accent-soft: hsl(0,60%,45%); --field-bg: hsl(0,0%,100%); --field-border: hsl(210,8%,72%);
  --focus: hsl(220,90%,52%); --ok: hsl(140,55%,32%); --warn: hsl(35,90%,38%); --bad: hsl(0,75%,42%);
  --shadow: 0 1px 2px hsl(210 20% 50% / .08), 0 4px 16px hsl(210 20% 40% / .06);
}
:root[data-theme="dark"] {
  --body-color: hsl(0,0%,87%); --body-bg: hsl(0,0%,14%); --paper: hsl(0,0%,18%);
  --muted: hsl(0,0%,62%); --rule: hsl(0,0%,32%); --accent: hsl(196,80%,72%);
  --accent-soft: hsl(196,60%,66%); --field-bg: hsl(0,0%,12%); --field-border: hsl(0,0%,40%);
  --focus: hsl(215,63%,73%); --ok: hsl(140,45%,62%); --warn: hsl(38,85%,62%); --bad: hsl(0,75%,68%);
  --shadow: 0 1px 2px hsl(0 0% 0% / .3), 0 4px 16px hsl(0 0% 0% / .25);
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; min-height: 100vh;
  background: var(--body-bg); color: var(--body-color);
  font-family: var(--serif); font-size: 1.05rem; line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--accent); text-underline-offset: .12em; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
hr { border: 0; border-top: 1.36px solid var(--rule); margin: 1.6rem 0; }
code, kbd, .mono { font-family: var(--mono); font-size: .92em; }

/* theme toggle — fixed top right */
.theme-toggle {
  position: fixed; top: 1rem; right: 1rem; z-index: 50;
  width: 2.4rem; height: 2.4rem; border-radius: 50%;
  display: grid; place-items: center; cursor: pointer;
  background: var(--paper); color: var(--body-color);
  border: 1.36px solid var(--rule); box-shadow: var(--shadow);
  font-size: 1.1rem; line-height: 1; transition: transform .15s ease;
}
.theme-toggle:hover { transform: rotate(-12deg); }

/* centered single-column pages (login) */
.center-wrap { min-height: 100vh; display: grid; place-items: center; padding: 2rem 1.25rem; }
.column { width: 100%; max-width: 26rem; }

/* portal shell */
.shell { max-width: 60rem; margin: 0 auto; padding: 3.2rem 1.5rem 4rem; }
.preamble { font-family: var(--mono); font-size: .78rem; color: var(--muted); letter-spacing: .02em; text-align: center; }
h1.title { font-family: var(--serif); font-weight: 600; font-size: 2.7rem; line-height: 1.1; text-align: center; margin: .2rem 0 0; }
.subtitle { text-align: center; font-style: italic; color: var(--muted); margin: .35rem 0 0; }
.meta-line { text-align: center; color: var(--muted); font-size: .9rem; margin-top: .5rem; }

/* card grid */
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 1.1rem; margin-top: 2.2rem; }
.card {
  display: flex; flex-direction: column; gap: .5rem;
  background: var(--paper); border: 1.36px solid var(--rule); border-radius: 6px;
  padding: 1.15rem 1.2rem; text-decoration: none; color: inherit;
  box-shadow: var(--shadow); transition: transform .12s ease, border-color .12s ease;
}
a.card:hover { transform: translateY(-2px); border-color: var(--accent); }
.card .ico { font-size: 1.5rem; }
.card h3 { margin: 0; font-size: 1.2rem; font-weight: 600; }
.card p { margin: 0; color: var(--muted); font-size: .92rem; line-height: 1.5; }
.card.disabled { opacity: .6; cursor: default; }
.badge { align-self: flex-start; margin-top: .2rem; font-family: var(--mono); font-size: .68rem;
  letter-spacing: .04em; text-transform: uppercase; padding: .12rem .5rem; border-radius: 999px; border: 1px solid; }
.badge.live { color: var(--ok); border-color: var(--ok); }
.badge.soon { color: var(--muted); border-color: var(--muted); }
.badge.warnb { color: var(--warn); border-color: var(--warn); }

/* report/tool pages */
.report { max-width: 60rem; margin: 0 auto; padding: 3rem 1.5rem 4rem; }
.report .back { font-family: var(--mono); font-size: .85rem; }
.stat-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(11rem,1fr)); gap: .9rem; margin: 1.6rem 0; }
.stat { background: var(--paper); border: 1.36px solid var(--rule); border-radius: 6px; padding: .9rem 1rem; box-shadow: var(--shadow); }
.stat .k { font-family: var(--mono); font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.stat .v { font-size: 1.5rem; font-weight: 600; margin-top: .2rem; }
.status-ok { color: var(--ok); } .status-warn { color: var(--warn); } .status-bad { color: var(--bad); }
table { width: 100%; border-collapse: collapse; margin: 1.2rem 0; font-size: .92rem; }
th, td { text-align: left; padding: .45rem .6rem; border-bottom: 1px solid var(--rule); }
th { font-variant: small-caps; letter-spacing: .03em; color: var(--muted); font-weight: 600; }
pre.log { background: var(--paper); border: 1.36px solid var(--rule); border-radius: 6px; padding: 1rem;
  overflow-x: auto; font-family: var(--mono); font-size: .8rem; line-height: 1.5; max-height: 70vh; }
.gen { font-family: var(--mono); font-size: .75rem; color: var(--muted); }

/* forms (login) */
.field { margin-bottom: 1.15rem; }
label { display: block; font-variant: small-caps; letter-spacing: .04em; font-size: .9rem; color: var(--muted); margin-bottom: .3rem; }
input[type=text], input[type=password] {
  width: 100%; font-family: var(--serif); font-size: 1.05rem; color: var(--body-color);
  background: var(--field-bg); border: 1.36px solid var(--field-border); border-radius: 3px; padding: .6rem .7rem;
}
input:focus { outline: 2px solid var(--focus); outline-offset: 1px; border-color: var(--focus); }
button.primary { width: 100%; margin-top: .4rem; cursor: pointer; font-family: var(--serif); font-size: 1.1rem;
  color: var(--body-bg); background: var(--accent); border: none; border-radius: 3px; padding: .65rem 1rem; transition: filter .15s ease; }
button.primary:hover { filter: brightness(1.08); }
.error { color: var(--accent); text-align: center; font-style: italic; margin: 0 0 1.2rem; }
.footer-note { margin-top: 1.6rem; text-align: center; font-family: var(--mono); font-size: .72rem; color: var(--muted); letter-spacing: .03em; }
.topbar { display: flex; justify-content: flex-end; gap: 1rem; align-items: center; font-family: var(--mono); font-size: .8rem; }
.topbar a { color: var(--muted); text-decoration: none; }
.topbar a:hover { color: var(--accent); }
