.site-header nav { align-items: center; }
nav form { margin: 0; }
.text-button { border: 0; padding: 0; background: transparent; color: var(--muted); font: inherit; cursor: pointer; }
.login { padding: 65px 0 85px; max-width: 620px; }
.login h1 { font-size: clamp(70px, 10vw, 124px); margin: 0 0 30px; }
.muted { color: var(--muted); font-size: 14px; }
.login form { max-width: 360px; margin-top: 32px; }
.login label { display: block; margin-bottom: 9px; color: var(--muted); font-size: 12px; }
.login input { width: 100%; border: 1px solid var(--line); border-radius: 2px; background: var(--background); color: var(--text); padding: 13px; font: inherit; }
.primary { margin-top: 19px; display: flex; align-items: center; gap: 23px; border: 1px solid var(--accent); border-radius: 2px; background: var(--accent); color: var(--background); padding: 12px 18px; font: inherit; font-size: 12px; cursor: pointer; }
.error { color: #a04436; font-size: 12px; }
.journal-intro { padding: 50px 0 40px; }
.journal-intro h1 { font-size: clamp(52px, 8vw, 88px); letter-spacing: -.045em; margin: 0; }
.collection { display: grid; grid-template-columns: 1fr 2fr; gap: 45px; border-top: 1px solid var(--line); padding: 35px 0 50px; }
.collection h2 { margin: 0 0 15px; font-size: 37px; }
.collection p { font-size: 12px; }
.empty { color: var(--muted); }
.entry-link { display: flex; align-items: baseline; gap: 17px; border-bottom: 1px solid var(--line); padding: 17px 0; text-decoration: none; font-size: 14px; overflow-wrap: anywhere; }
.entry-link time { font-size: 10px; color: var(--muted); white-space: nowrap; }
.entry-link > span:last-child { margin-left: auto; color: var(--accent); }
.reading { max-width: 720px; padding: 40px 0 70px; margin: auto; }
.back-link { font-size: 12px; color: var(--muted); text-decoration: none; }
.reading h1 { font-size: clamp(40px, 7vw, 66px); line-height: 1.15; letter-spacing: -.04em; margin: 30px 0; overflow-wrap: anywhere; }
.date { color: var(--muted); font-size: 11px; margin-top: 30px; }
.markdown { font-size: 15px; line-height: 2; overflow-wrap: anywhere; }
.markdown h1, .markdown h2, .markdown h3, .markdown h4, .markdown h5, .markdown h6 { font-family: var(--heading-font); line-height: 1.3; letter-spacing: -.025em; }
.markdown h1 { font-size: 35px; }
.markdown h2 { font-size: 30px; }
.markdown pre { padding: 17px; background: color-mix(in srgb, var(--accent) 7%, var(--background)); overflow: auto; }
.markdown code { font-family: ui-monospace, Consolas, monospace; font-size: 13px; }
.markdown blockquote { margin-left: 0; padding-left: 20px; border-left: 2px solid var(--accent); color: var(--muted); }
.markdown table { display: block; max-width: 100%; overflow: auto; border-collapse: collapse; }
.markdown th, .markdown td { border: 1px solid var(--line); padding: 7px 12px; }
@media (max-width: 640px) {
  .login { padding: 45px 0 65px; }
  .collection { grid-template-columns: 1fr; gap: 15px; padding: 30px 0; }
  .entry-link { flex-wrap: wrap; gap: 4px 15px; }
  .entry-link time { flex-basis: 100%; }
  .reading { padding: 30px 0 50px; }
}