/* The guide pages (bookkeeping-for-landlords/ and the rest): the home page's
   look, for pages that are mostly words. The tokens, the masthead, the
   buttons and the footer are copied from www/index.html's own styles, which
   stay the source: when a colour moves there, move it here too.
   A stylesheet of its own rather than inline, so every guide shares one copy. */
@font-face{font-family:"IBM Plex Sans";font-weight:400;font-style:normal;font-display:swap;src:url(/fonts/IBMPlexSans-Regular.woff2) format("woff2");}
@font-face{font-family:"IBM Plex Sans";font-weight:500;font-style:normal;font-display:swap;src:url(/fonts/IBMPlexSans-Medium.woff2) format("woff2");}
@font-face{font-family:"IBM Plex Sans";font-weight:600;font-style:normal;font-display:swap;src:url(/fonts/IBMPlexSans-SemiBold.woff2) format("woff2");}
@font-face{font-family:"IBM Plex Serif";font-weight:500;font-style:normal;font-display:swap;src:url(/fonts/IBMPlexSerif-Medium.woff2) format("woff2");}
@font-face{font-family:"IBM Plex Serif";font-weight:600;font-style:normal;font-display:swap;src:url(/fonts/IBMPlexSerif-SemiBold.woff2) format("woff2");}
@font-face{font-family:"IBM Plex Mono";font-weight:400;font-style:normal;font-display:swap;src:url(/fonts/IBMPlexMono-Regular.woff2) format("woff2");}
@font-face{font-family:"IBM Plex Mono";font-weight:500;font-style:normal;font-display:swap;src:url(/fonts/IBMPlexMono-Medium.woff2) format("woff2");}

:root{
  --paper:#f5f7fa; --raised:#ffffff; --sunken:#ebeff5; --ink:#15223b; --ink-soft:#34425e;
  --muted:#5e6a80; --line:#d8dee8; --line-strong:#bfc8d6; --accent:#23579a;
  --accent-strong:#163f73; --accent-soft:#e2eaf5; --accent-ink:#f3f7fc; --rule:#dfe4ec;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#0e1421; --raised:#151d2d; --sunken:#0a0f19; --ink:#e6ebf3; --ink-soft:#c3cbd9;
    --muted:#8f9aae; --line:#253045; --line-strong:#34415a; --accent:#7fa7de;
    --accent-strong:#a9c4ea; --accent-soft:#15233a; --accent-ink:#0a1220; --rule:#1e293c;
  }
}
:root[data-theme="dark"]{
  --paper:#0e1421; --raised:#151d2d; --sunken:#0a0f19; --ink:#e6ebf3; --ink-soft:#c3cbd9;
  --muted:#8f9aae; --line:#253045; --line-strong:#34415a; --accent:#7fa7de;
  --accent-strong:#a9c4ea; --accent-soft:#15233a; --accent-ink:#0a1220; --rule:#1e293c;
}
*{box-sizing:border-box;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;}
.wrap{max-width:1060px;margin:0 auto;padding:0 26px;}
h1,h2,h3{font-family:"IBM Plex Serif",Georgia,serif;text-wrap:balance;}
a{color:var(--accent-strong);}

/* masthead, as on the home page */
.top{display:flex;justify-content:space-between;align-items:center;padding:22px 0;border-bottom:1px solid var(--line);}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;}
.logo{height:28px;width:auto;display:block;flex:none;}
footer .logo{height:20px;}
.logo-dark{display:none;}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .logo-light{display:none;}
  :root:not([data-theme="light"]) .logo-dark{display:block;}
}
:root[data-theme="dark"] .logo-light{display:none;}
:root[data-theme="dark"] .logo-dark{display:block;}
.brand .rule{width:1px;height:20px;background:var(--line-strong);}
.product{font-family:"IBM Plex Serif";font-size:17px;font-weight:500;color:var(--accent-strong);}
.top nav{display:flex;gap:22px;font-size:14px;align-items:center;}
.top nav a{color:var(--ink-soft);text-decoration:none;}
.top nav a:hover{color:var(--accent-strong);}
.top nav a.login{border:1px solid var(--line-strong);border-radius:6px;padding:6px 15px;color:var(--ink);font-weight:500;background:var(--raised);}
@media (max-width:820px){ .top nav{gap:0;} .top nav a:not(.login){display:none;} }

/* the guide itself: one readable column */
.guide{max-width:720px;padding:52px 0 36px;}
.kicker{font-family:"IBM Plex Mono";font-size:11.5px;letter-spacing:0.12em;text-transform:uppercase;color:var(--accent-strong);margin:0 0 16px;}
.guide h1{font-size:clamp(30px,4.6vw,44px);line-height:1.1;letter-spacing:-0.02em;margin:0 0 16px;font-weight:600;}
.guide .sub{font-size:18.5px;color:var(--ink-soft);margin:0 0 30px;}
.guide h2{font-size:24px;margin:38px 0 10px;letter-spacing:-0.01em;font-weight:600;}
.guide p,.guide li{color:var(--ink-soft);}
.guide ul{padding-left:20px;}
.guide li{margin:4px 0;}
.guide table{border-collapse:collapse;width:100%;margin:14px 0 6px;font-size:14.5px;background:var(--raised);border:1px solid var(--line);}
.guide th,.guide td{text-align:left;padding:8px 12px;border-bottom:1px solid var(--rule);}
.guide th{font-weight:600;color:var(--ink);background:var(--sunken);}
.guide td.num,.guide th.num{text-align:right;font-family:"IBM Plex Mono",ui-monospace,monospace;font-variant-numeric:tabular-nums;}
.guide .fine{font-size:13px;color:var(--muted);}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:34px;}
.btn{display:inline-flex;align-items:center;gap:7px;border-radius:7px;padding:12px 20px;font-size:15px;font-weight:500;text-decoration:none;border:1px solid var(--line-strong);background:var(--raised);color:var(--ink);}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);}
.btn.primary:hover{background:var(--accent-strong);border-color:var(--accent-strong);}
.btn:hover{border-color:var(--accent);}

/* footer, as on the home page, with the guides listed */
footer{border-top:1px solid var(--line);padding:32px 0 60px;font-size:13px;color:var(--muted);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;}
footer .brand{gap:9px;margin-bottom:8px;}
footer .brand .rule{height:14px;}
footer .product{font-size:13px;}
.footer-legal{display:flex;gap:18px;flex-wrap:wrap;}
.footer-legal a{font-size:13px;color:inherit;opacity:.85;}
.footer-fine{flex-basis:100%;font-size:11px;line-height:1.5;opacity:.7;max-width:560px;}