/* LandlordByHand — theme "Keystone Ledger".
   A landlord's deadline is a ledger entry and a door key at once, so the site
   is dressed as a well-kept property ledger: cool stone paper, deep pine ink,
   spruce-green primary, a copper stamp accent for prices and the checked-date
   mark. Headlines are a tight grotesque sans (not a serif broadsheet), dates
   and deadlines set in tabular figures inside ruled ledger tables.
   Verdict classes keep ONE color each: dated spruce / justcause copper-dark /
   unverified slate / needstenure slate / nodate slate. */
:root{
  --ink:#1E2B23; --ink-soft:#4E5F55; --paper:#EFF1EC; --alt:#E2E8DE;
  --card:#FFFFFF; --line:#C3CFC0; --spruce:#166145; --spruce-deep:#0C3826;
  --dark:#10231A; --dark2:#173528; --dark-text:#E9F0E7; --dark-small:#BCCDB8;
  --copper:#8A5514; --copper-lt:#E8B96A;
  --dated:#14532D; --dated-bg:#DDEBD8; --justcause:#7A4410; --justcause-bg:#F6E3C2;
  --route:#3E4A44; --route-bg:#E3E7E1;
  --sans:-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:"SF Mono","Cascadia Mono",Consolas,"Liberation Mono",monospace;
}
*{box-sizing:border-box}
html{font-size:18.5px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.62;-webkit-text-size-adjust:100%}
.wrap{max-width:1060px;margin:0 auto;padding:0 20px}
h1{font-size:2.05rem;line-height:1.18;margin:0 0 .5em;color:var(--ink);font-weight:800;letter-spacing:-.015em}
h2{font-size:1.5rem;line-height:1.26;margin:0 0 .5em;color:var(--ink);font-weight:800;letter-spacing:-.01em}
h3{font-size:1.13rem;line-height:1.35;margin:1.05em 0 .35em;color:var(--ink);font-weight:700}
p{margin:0 0 .9em;color:var(--ink)}
li{color:var(--ink)}
ul,ol{margin:.2em 0 1em;padding-left:1.25em}
small{color:var(--ink-soft);font-size:.82rem}
label{color:var(--ink)}
legend{color:var(--ink)}
button{color:var(--ink);font-family:var(--sans)}
a{color:var(--spruce);text-underline-offset:2px}
button{cursor:pointer}
.eyebrow{font-size:.77rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--copper);margin:0 0 .55em}
.stamp{display:inline-block;border:1.5px solid var(--copper);color:var(--copper);border-radius:3px;padding:.12em .6em;font-size:.76rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:transparent}
.datefig{font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:700}
section{padding:46px 0}
section.plain{background:var(--paper)}
section.plain h1,section.plain h2,section.plain h3{color:var(--ink)}
section.plain p,section.plain li{color:var(--ink)}
section.plain label,section.plain legend{color:var(--ink)}
section.plain small{color:var(--ink-soft)}
section.plain button{color:#FFFFFF}
section.plain a{color:var(--spruce)}
section.alt{background:var(--alt)}
section.alt h1,section.alt h2,section.alt h3{color:var(--ink)}
section.alt p,section.alt li{color:var(--ink)}
section.alt label,section.alt legend{color:var(--ink)}
section.alt small{color:var(--ink-soft)}
section.alt button{color:#FFFFFF}
section.alt a{color:var(--spruce)}
section.dark{background:linear-gradient(165deg,var(--dark2) 0%,var(--dark) 72%)}
section.dark h1,section.dark h2,section.dark h3{color:var(--paper)}
section.dark p,section.dark li{color:var(--dark-text)}
section.dark label,section.dark legend{color:var(--paper)}
section.dark small{color:var(--dark-small)}
section.dark button{color:var(--ink)}
section.dark a{color:var(--copper-lt)}
section.dark .eyebrow{color:var(--copper-lt)}
section.dark .stamp{border-color:var(--copper-lt);color:var(--copper-lt)}
section.hero{background:var(--paper);border-top:10px solid var(--spruce);padding:50px 0 44px}
section.hero h1,section.hero h2,section.hero h3{color:var(--ink)}
section.hero p,section.hero li{color:var(--ink)}
section.hero label,section.hero legend{color:var(--ink)}
section.hero small{color:var(--ink-soft)}
section.hero button{color:#FFFFFF}
section.hero a{color:var(--spruce)}
section.hero .lead{font-size:1.2rem;line-height:1.48;color:var(--ink-soft);max-width:44em}
/* light components inside dark/hero sections: scoped rules beat section rules on specificity */
section.dark .card h3,section.dark .band h3,section.dark .lock-panel h3,section.dark .result h3,section.dark .notice h3{color:var(--ink)}
section.dark .card p,section.dark .band p,section.dark .lock-panel p,section.dark .result p,section.dark .notice p{color:var(--ink)}
section.dark .card li,section.dark .band li,section.dark .lock-panel li,section.dark .result li,section.dark .notice li{color:var(--ink)}
section.dark .card small,section.dark .band small,section.dark .lock-panel small,section.dark .result small,section.dark .notice small{color:var(--ink-soft)}
section.dark .card a,section.dark .band a,section.dark .lock-panel a,section.dark .result a,section.dark .notice a{color:var(--spruce)}
section.hero .card h3,section.hero .band h3,section.hero .lock-panel h3,section.hero .result h3,section.hero .notice h3{color:var(--ink)}
section.hero .card p,section.hero .band p,section.hero .lock-panel p,section.hero .result p,section.hero .notice p{color:var(--ink)}
section.hero .card li,section.hero .band li,section.hero .lock-panel li,section.hero .result li,section.hero .notice li{color:var(--ink)}
section.hero .card small,section.hero .band small,section.hero .lock-panel small,section.hero .result small,section.hero .notice small{color:var(--ink-soft)}
section.plain .card h3,section.plain .band h3,section.plain .lock-panel h3,section.plain .result h3,section.plain .notice h3{color:var(--ink)}
section.alt .card h3,section.alt .band h3,section.alt .lock-panel h3,section.alt .result h3,section.alt .notice h3{color:var(--ink)}
/* header / footer — ONE lockup, identical everywhere; footer carries it on a light plate */
header.site{background:var(--paper);border-bottom:1px solid var(--line);padding:12px 0}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 22px}
.brand{font-size:1.34rem;font-weight:800;letter-spacing:-.01em;text-decoration:none;display:inline-flex;align-items:center;gap:.5em}
.brand .mark{flex:none}
.brand .b1{color:var(--ink)} .brand .b2{color:var(--spruce)}
nav.main{display:flex;flex-wrap:wrap;gap:4px 20px}
nav.main a{color:var(--ink);text-decoration:none;font-weight:600;font-size:.94rem}
nav.main a:hover{color:var(--spruce);text-decoration:underline}
footer.site{background:linear-gradient(165deg,var(--dark2) 0%,var(--dark) 72%);padding:38px 0 30px}
footer.site .plate{display:inline-block;background:var(--paper);border-radius:8px;padding:10px 14px;margin-bottom:14px}
footer.site p{color:var(--dark-text);font-size:.92rem}
footer.site small{color:var(--dark-small)}
footer.site a{color:var(--copper-lt)}
footer.site .flinks{display:flex;flex-wrap:wrap;gap:4px 20px;margin:10px 0 14px}
footer.site .flinks a{font-weight:600;text-decoration:none}
footer.site .flinks a:hover{text-decoration:underline}
footer.site h1,footer.site h2,footer.site h3{color:var(--paper)}
footer.site li{color:var(--dark-text)}
footer.site label,footer.site legend{color:var(--paper)}
footer.site button{color:var(--ink)}
/* buttons */
.btn{display:inline-block;background:var(--spruce);color:#FFFFFF;border:none;border-radius:6px;padding:.72em 1.35em;font-size:1rem;font-weight:700;text-decoration:none;font-family:var(--sans)}
.btn:hover{background:var(--spruce-deep)}
.btn.ghost{background:transparent;color:var(--spruce);border:2px solid var(--spruce)}
.btn.ghost:hover{background:var(--spruce);color:#FFFFFF}
section.dark .btn{color:#FFFFFF}
/* button labels — FULL-CASCADE GUARD: scoped rules sit strictly above every
   link rule that can reach a button, in every flavor and light component. */
section.hero a.btn,section.hero button.btn,
section.dark a.btn,section.dark button.btn,
section.alt a.btn,section.alt button.btn,
section.plain a.btn,section.plain button.btn,
section .band .btn,section .card .btn,section .result .btn,
section .lock-panel .btn,section .notice .btn,
footer.site .btn{color:#FFFFFF}
section.dark .band .btn,section.dark .card .btn,section.dark .result .btn,section.dark .lock-panel .btn,section.dark .notice .btn,
section.hero .band .btn,section.hero .card .btn,section.hero .result .btn,section.hero .lock-panel .btn,section.hero .notice .btn{color:#FFFFFF}
section a.btn.ghost,section button.btn.ghost,
section .band .btn.ghost,section .card .btn.ghost,section .result .btn.ghost,
section .lock-panel .btn.ghost,section .notice .btn.ghost{color:var(--spruce)}
section.dark a.btn.ghost,section.dark button.btn.ghost,
section.dark .band .btn.ghost,section.dark .card .btn.ghost,
section.dark .result .btn.ghost,section.dark .lock-panel .btn.ghost,section.dark .notice .btn.ghost{color:#FFFFFF}
/* the kit band — named, priced, one button; placement is role-governed (see build.py) */
.band{background:var(--card);border:1px solid var(--line);border-top:6px solid var(--spruce);border-radius:10px;padding:26px 28px;margin:26px 0;box-shadow:0 2px 10px rgba(30,43,35,.07)}
.band h3{font-size:1.32rem;margin:.1em 0 .35em;color:var(--ink)}
.band p{color:var(--ink)}
.band .price{font-size:1.45rem;font-weight:800;color:var(--spruce)}
.band li{color:var(--ink)}
.band small{color:var(--ink-soft)}
/* cards, tables, faq, notices */
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:22px 24px;margin:0 0 18px}
.card h3{margin-top:.2em;color:var(--ink)}
.card p,.card li{color:var(--ink)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:10px;margin:0 0 18px;background:var(--card)}
table{border-collapse:collapse;width:100%;font-size:.92rem}
th,td{padding:.55em .8em;text-align:left;border-bottom:1px solid var(--line);color:var(--ink)}
th{background:var(--alt);color:var(--ink);font-weight:800}
.notice{background:var(--card);border-left:6px solid var(--copper);border-radius:6px;padding:16px 20px;margin:0 0 18px}
.notice p{color:var(--ink)}
.notice h3{color:var(--ink)}
.faq{border-top:1px solid var(--line);padding:14px 0}
.faq h3{margin-top:0}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}
.step{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:20px}
.step .num{font-size:1.55rem;color:var(--spruce);font-weight:800}
.step h3{margin-top:.15em}
.lock-panel{border:1.5px dashed var(--copper);border-radius:10px;padding:18px 22px;background:var(--card);margin:0 0 16px}
.lock-panel h3{color:var(--ink);margin-top:.1em}
.lock-panel p,.lock-panel li{color:var(--ink)}
.lock-panel .incl{font-weight:700;color:var(--spruce)}
/* checker + letter-builder tools */
form.tool{background:var(--card);border:1px solid var(--line);border-top:6px solid var(--spruce);border-radius:10px;padding:26px 28px;color:var(--ink)}
form.tool fieldset{border:1px solid var(--line);border-radius:8px;margin:0 0 18px;padding:16px 18px}
form.tool legend{font-weight:800;color:var(--ink);padding:0 .4em}
form.tool label{display:block;font-weight:600;color:var(--ink);margin:.65em 0 .25em;font-size:.95rem}
form.tool label.radio,form.tool .checks label{font-weight:500}
form.tool .help,form.tool small{color:var(--ink-soft);font-size:.83rem;display:block;margin-top:.2em}
form.tool input,form.tool select,form.tool textarea{width:100%;padding:.55em .7em;font-size:1rem;border:1.5px solid var(--line);border-radius:6px;background:#FFF;color:var(--ink);font-family:var(--sans)}
form.tool input:focus,form.tool select:focus,form.tool textarea:focus{outline:2px solid var(--copper);outline-offset:1px}
form.tool .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
form.tool button{color:#FFFFFF}
section.hero form.tool label,section.hero form.tool legend{color:var(--ink)}
section.hero form.tool small{color:var(--ink-soft)}
section.dark form.tool label,section.dark form.tool legend{color:var(--ink)}
section.dark form.tool small{color:var(--ink-soft)}
section.plain form.tool label,section.alt form.tool label{color:var(--ink)}
/* injected verdict panel */
.result{margin-top:24px;border:1px solid var(--line);border-radius:10px;background:var(--card);padding:24px 26px;color:var(--ink)}
.result h3{font-size:1.34rem;margin:.35em 0 .4em;color:var(--ink)}
.result p,.result li{color:var(--ink)}
.result small{color:var(--ink-soft)}
.chip{display:inline-block;border-radius:999px;padding:.18em .8em;font-size:.78rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.chip.dated{background:var(--dated-bg);color:var(--dated)}
.chip.justcause{background:var(--justcause-bg);color:var(--justcause)}
.chip.unverified,.chip.needstenure,.chip.nodate{background:var(--route-bg);color:var(--route)}
.result .mathbox{background:var(--alt);border-radius:8px;padding:14px 18px;margin:12px 0}
.result .mathbox p{margin:.25em 0}
/* kit page */
.kitdoc h2{border-top:3px solid var(--spruce);padding-top:.6em;margin-top:1.4em}
.letterbox{background:#FFF;border:1.5px solid var(--line);border-radius:8px;padding:22px 26px;margin:14px 0;font-size:.95rem;white-space:pre-wrap}
.letterbox p{color:var(--ink)}
.checklist{list-style:none;padding-left:0}
.checklist li{padding:.45em 0 .45em 1.7em;position:relative;border-bottom:1px solid var(--line)}
.checklist li:before{content:"\2610";position:absolute;left:.2em;color:var(--spruce);font-weight:800}
@media(max-width:760px){
  html{font-size:17.5px}
  header.site .wrap{flex-direction:column;align-items:stretch;gap:6px}
  nav.main{display:flex;width:100%;gap:2px 16px;padding-top:4px;border-top:1px solid var(--line)}
  nav.main a{padding:6px 0}
  section{padding:34px 0}
  section.hero{padding:38px 0 34px}
  h1{font-size:1.74rem}
  form.tool .row{grid-template-columns:1fr}
  .band,form.tool,.result{padding:20px 18px}
}
@media print{
  header.site,footer.site,nav.main,.band .btn{display:none}
  body{background:#FFF}
}
