/* Kernos: shared styles for the legal / 404 pages.
   Loaded after styles.css, which supplies the tokens and font faces. */

.legal-head{border-bottom:1px solid var(--line);background:var(--bg-2)}
.legal-head .nav{height:74px}
.legal-head .back{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--muted);transition:color .2s}
.legal-head .back:hover{color:var(--acc)}

.legal{max-width:820px;margin:0 auto;padding:72px 24px 96px}
.legal h1{font-size:38px;font-weight:800;letter-spacing:-1.2px;margin-bottom:12px}
.legal .updated{font-family:var(--mono);font-size:12.5px;color:var(--dim);margin-bottom:48px}
.legal h2{font-size:21px;font-weight:700;letter-spacing:-.4px;margin:44px 0 14px;padding-top:26px;border-top:1px solid var(--line)}
.legal h2:first-of-type{border-top:0;padding-top:0;margin-top:0}
.legal h3{font-size:16px;font-weight:600;margin:24px 0 8px}
.legal p{color:var(--muted);font-size:15.5px;margin-bottom:16px}
.legal ul{color:var(--muted);font-size:15.5px;margin:0 0 16px 22px}
.legal li{margin-bottom:9px}
.legal a{color:var(--acc)}
.legal a:hover{text-decoration:underline}
.legal strong,.legal b{color:var(--ink);font-weight:600}

.legal .box{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:22px 24px;margin:0 0 20px;
}
.legal .box p:last-child{margin-bottom:0}
.legal .box.todo{border-color:rgba(255,184,107,.35);background:rgba(255,184,107,.05)}
.legal .box.todo b{color:#FFB86B}

.legal dl{margin-bottom:20px}
.legal dt{font-family:var(--mono);font-size:12px;color:var(--dim);text-transform:uppercase;letter-spacing:1px;margin-top:16px}
.legal dd{font-size:15.5px;margin:4px 0 0}

/* --- 404 ----------------------------------------------------------------- */
.nf{min-height:78vh;display:grid;place-items:center;text-align:center;padding:60px 24px}
.nf .code{font-family:var(--mono);font-size:82px;font-weight:500;letter-spacing:-2px;background:linear-gradient(100deg,var(--acc),var(--acc-2));-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1}
.nf h1{font-size:28px;font-weight:800;letter-spacing:-.8px;margin:18px 0 12px}
.nf p{color:var(--muted);font-size:16px;margin-bottom:30px;max-width:440px}
.nf .nf-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

@media(max-width:760px){
  .legal{padding:48px 24px 72px}
  .legal h1{font-size:29px}
  .legal h2{font-size:19px}
  .nf .code{font-size:62px}
}