/* habit.report — one stylesheet. Self-hosted Bungee (wordmark and page titles only) and Public Sans (everything else); SIL OFL, licences and release tags in /fonts/. */
@font-face { font-family: "Bungee"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/Bungee-Regular.woff2") format("woff2"); }
@font-face { font-family: "Public Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/PublicSans-Regular.woff2") format("woff2"); }
@font-face { font-family: "Public Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url("/fonts/PublicSans-Medium.woff2") format("woff2"); }
@font-face { font-family: "Public Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/PublicSans-SemiBold.woff2") format("woff2"); }
@font-face { font-family: "Public Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/PublicSans-Bold.woff2") format("woff2"); }
@font-face { font-family: "Public Sans"; font-style: italic; font-weight: 400; font-display: swap; src: url("/fonts/PublicSans-Italic.woff2") format("woff2"); }

:root { --paper:#faf8f3; --ink:#1b1b1b; --ink2:#5b5955; --rule:#d8d2c6; --link:#0b5e5e; --personal:#b5781c; --professional:#3c5a86;
        --sans:"Public Sans", Arial, Helvetica, sans-serif; --display:"Bungee", Impact, "Arial Black", sans-serif; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: 16px; line-height: 1.45; }
table, td, th, .est, .amt, .edition, .edition-line { font-variant-numeric: tabular-nums; }
main { max-width: 1280px; margin: 0 auto; padding: 0 20px 48px; }
a { color: var(--link); }
h1, h2, h3 { font-weight: 600; line-height: 1.2; }
h1 { font-family: var(--display); font-weight: 400; font-size: clamp(19px, 5.4vw, 30px); line-height: 1.25; letter-spacing: .01em; hyphens: none; overflow-wrap: normal; margin: 22px 0 8px; }
h2 { font-size: 22px; margin: 34px 0 8px; }
h3 { font-size: 18px; margin: 26px 0 6px; }
p { max-width: 70ch; }
code { font-family: var(--sans); font-size: .9em; }
.ne { color: var(--ink2); }
.rec { }
.pending { background: #ffe9a8; padding: 0 4px; }
small, .est, .foot, .refs, .m, .count, .edition, .n, .msg, .crumb, .audience { font-family: var(--sans); }
.est { color: var(--ink2); font-size: 12px; font-style: italic; display: block; margin-top: 2px; }

/* mast */
header.mast { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 6px 16px; padding: 14px 0 8px; }
.wordmark { font-family: var(--display); font-weight: 400; font-size: 22px; letter-spacing: .01em; }
.wordmark a { color: var(--ink); text-decoration: none; }
.wordmark .dot { color: var(--ink); }
.edition { font-size: 13px; color: var(--ink2); font-variant-numeric: tabular-nums; }
.edition a { margin-left: 14px; text-decoration: none; }
.band { height: 6px; margin: 0 0 10px; background: var(--rule); }
.band.personal { background: var(--personal); }
.band.professional { background: var(--professional); }
.band.both { background: linear-gradient(to right, var(--personal) 50%, var(--professional) 50%); }
footer { margin-top: 48px; border-top: 1px solid var(--rule); padding-top: 12px; font-size: 13px; color: var(--ink2); display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 16px; }
footer .wordmark { font-size: 13px; color: var(--ink); }
footer nav a { margin-right: 14px; }

/* home */
.lede { font-size: 19px; margin: 0 0 30px; max-width: 60ch; }
.blocks { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.block { position: relative; border: 1px solid var(--rule); border-top-width: 8px; background: #fff; padding: 22px 24px 20px; min-height: 190px; display: flex; flex-direction: column; }
.block.personal { border-top-color: var(--personal); }
.block.professional { border-top-color: var(--professional); }
.block.products { border-top-color: var(--ink); }
.block.free { border-top-color: var(--link); }
.block:hover { border-color: var(--ink); }
.block h2 { font-family: var(--display); font-weight: 400; font-size: 30px; line-height: 1.1; margin: 0 0 10px; }
.block h2 a { color: var(--ink); text-decoration: none; }
.block h2 a::before { content: ""; position: absolute; inset: 0; }
.block h2 a::after { content: " →"; color: var(--link); }
.block p { margin: 0 0 10px; font-size: 18px; }
.block p.n { margin-top: auto; font-size: 14px; color: var(--ink2); font-variant-numeric: tabular-nums; }
.block p.also { position: relative; z-index: 1; font-size: 14px; margin: 6px 0 0; }
table.index td.free small { display: block; color: var(--ink2); font-size: 12px; }
.promises { margin: 40px 0 0; padding: 24px 0 0; border-top: 1px solid var(--rule); display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 24px; }
.promises p { margin: 0; font-size: 16px; }
.promises p b { display: block; font-weight: 600; font-size: 18px; margin-bottom: 4px; }
.not { margin: 36px 0 0; max-width: 66ch; color: var(--ink2); }
.edition-line { font-family: var(--sans); font-size: 13px; color: var(--ink2); font-variant-numeric: tabular-nums; }

/* views */
.scenario { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 8px 16px; }
.scenario h1 { font-size: clamp(18px, 4.6vw, 24px); margin: 6px 0; }
.scenario .other a { text-decoration: none; font-size: 15px; }
.controls { position: sticky; top: 0; background: var(--paper); border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); margin: 14px 0 0; padding: 10px 0; display: flex; flex-wrap: wrap; gap: 10px 22px; align-items: center; font-family: var(--sans); font-size: 13.5px; z-index: 2; }
.controls label { display: inline-flex; gap: 6px; align-items: center; }
.controls select, .controls input[type=search], .controls input[type=number], .count-ctl input[type=number] { font: inherit; padding: 3px 6px; border: 1px solid var(--rule); background: #fff; color: var(--ink); }
.controls input[type=number], .count-ctl input[type=number] { width: 5.5em; font-variant-numeric: tabular-nums; }
.controls .quick button { font: inherit; font-size: 12px; padding: 2px 7px; border: 1px solid var(--rule); background: #fff; margin-left: 2px; cursor: pointer; color: var(--ink); }
.controls .quick button.on { background: var(--professional); color: #fff; border-color: var(--professional); }
.controls a { text-decoration: none; }
.controls .n, .count-ctl .n { color: var(--ink2); }
.msg { color: #8a2d0b; }
.msg:empty { display: none; }
.seg { display: inline-flex; border: 1px solid var(--rule); }
.seg label { padding: 3px 9px; background: #fff; cursor: pointer; display: inline-flex; gap: 6px; }
.seg label.on { background: var(--professional); color: #fff; }
.seg input { position: absolute; opacity: 0; width: 0; height: 0; }
.controls .sub { margin-left: -10px; }
.controls .sub[hidden] { display: none; }
.summary { display: none; }

table.list, table.ladder { border-collapse: collapse; width: 100%; font-family: var(--sans); font-size: 14px; margin-top: 4px; }
table.list th, table.ladder th { text-align: left; font-weight: 600; color: var(--ink2); font-size: 12px; letter-spacing: .02em; text-transform: uppercase; padding: 10px 10px 8px 0; border-bottom: 1px solid var(--ink); vertical-align: bottom; }
table.list td, table.ladder td { padding: 9px 10px 9px 0; border-bottom: 1px solid var(--rule); vertical-align: top; font-variant-numeric: tabular-nums; }
td small { display: block; color: var(--ink2); font-size: 12.5px; margin-top: 2px; max-width: 40ch; }
td.name { font-weight: 600; }
td[data-h="Checked"] { white-space: nowrap; }
td.name a { color: var(--ink); text-decoration: none; }
td a.amt { color: var(--link); text-decoration: none; border-bottom: 1px solid #9cc; }
tr.group td { background: #eef1f5; color: var(--ink2); font-size: 12px; letter-spacing: .03em; text-transform: uppercase; padding: 6px 0; border-bottom: 0; }
tr.excl td { color: var(--ink2); }
tr.sel td { background: #fff7e0; }
.foot { margin: 14px 0 0; font-size: 13px; color: var(--ink2); max-width: 92ch; }
.lay { margin: 16px 0 8px; padding: 12px 14px; border: 1px solid var(--rule); background: #fff; font-family: var(--sans); font-size: 13.5px; max-width: 92ch; }
.lay b { font-weight: 600; }
.rule { margin: 12px 0 0; padding: 12px 14px; border: 1px solid var(--rule); background: #fff; max-width: 92ch; }
.rule p { margin: 0; }
.closing { font-family: var(--sans); font-size: 14px; color: var(--ink2); }

/* product page */
.crumb { font-size: 13px; color: var(--ink2); margin-top: 6px; }
.crumb a { text-decoration: none; }
.audience { font-size: 13.5px; color: var(--ink2); margin: 0 0 18px; }
.audience a { text-decoration: none; }
.answer { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 10px 0 10px; }
.cell { border: 1px solid var(--rule); background: #fff; padding: 14px 16px; font-family: var(--sans); }
.cell .h { font-size: 12px; letter-spacing: .02em; text-transform: uppercase; color: var(--ink2); margin-bottom: 6px; }
.cell .v { font-size: 22px; font-variant-numeric: tabular-nums; }
.cell .v a { text-decoration: none; border-bottom: 1px solid #9cc; }
.cell .v small, .cell .b small { display: block; font-size: 13px; color: var(--ink2); font-style: normal; margin-top: 4px; }
.cell .v small.est { font-style: italic; font-size: 12px; }
.cell .b { font-size: 13px; color: var(--ink2); margin-top: 6px; }
.count-ctl { font-family: var(--sans); font-size: 13.5px; margin: 0 0 10px; display: flex; gap: 12px 16px; align-items: center; flex-wrap: wrap; }
.count-ctl label { display: inline-flex; gap: 6px; align-items: center; }
sup.ref { font-family: var(--sans); font-size: 11px; }
sup.ref a { text-decoration: none; margin-left: 2px; }
dl { display: grid; grid-template-columns: 14em 1fr; gap: 6px 14px; font-size: 15px; }
dt { color: var(--ink2); font-family: var(--sans); font-size: 13.5px; }
dd { margin: 0; }
dl.glossary { grid-template-columns: 1fr; gap: 0; }
dl.glossary dt { font-weight: 600; font-size: 17px; color: var(--ink); margin-top: 22px; }
dl.glossary dd p { margin: 4px 0; }
dl.glossary .eg { font-family: var(--sans); font-size: 13px; color: var(--ink2); }
dl.changes { grid-template-columns: 10em 1fr; }
ul.gaps { padding-left: 20px; }
ul.gaps li { margin: 4px 0; }
ul.refs { padding-left: 20px; }
.refs { font-size: 14px; }
ol.ev { padding-left: 24px; font-family: var(--sans); font-size: 14px; }
ol.ev li { margin: 10px 0; }
ol.ev .t { font-weight: 600; }
ol.ev .m { color: var(--ink2); }
ol.ev a { text-decoration: none; word-break: break-all; }
ol.ev q { color: #333; }
.doc h2, .doc h3 { font-size: 20px; }
.doc ul { padding-left: 22px; }
table.reg td small { max-width: 48ch; }

@media (max-width: 719px) {
  main { padding: 0 16px 40px; }

  .blocks, .promises, .answer { grid-template-columns: 1fr; }
  dl { grid-template-columns: 1fr; gap: 2px 0; }
  dd { margin-bottom: 8px; }
  .controls { gap: 8px 14px; font-size: 13px; }
  .controls .summary { display: block; width: 100%; color: var(--ink2); }
  .controls.closed > *:not(.summary):not(.toggle) { display: none; }
  .controls .toggle { display: inline-block; font: inherit; border: 1px solid var(--rule); background: #fff; padding: 2px 8px; cursor: pointer; }
  table.list, table.list tbody, table.list tr, table.list td { display: block; width: 100%; }
  table.list thead { display: none; }
  table.list tr { border-bottom: 2px solid var(--rule); padding: 10px 0; }
  table.list td { border: 0; padding: 3px 0; }
  table.list td.name { font-size: 16px; }
  table.list td::before { content: attr(data-h); display: block; font-size: 11px; letter-spacing: .03em; text-transform: uppercase; color: var(--ink2); }
  table.list td.name::before { content: none; }
  table.list tr.group td { padding: 6px 0; }
  td small { max-width: none; }
  table.ladder { display: block; overflow-x: auto; font-size: 13px; }
  .cell .v { font-size: 19px; }
}
@media (min-width: 720px) { .controls .toggle { display: none; } }

.sub{font-family:"Public Sans",system-ui,sans-serif;font-weight:700;font-size:30px;line-height:1.15;margin:6px 0 10px;letter-spacing:-.01em}
@media (max-width:600px){.sub{font-size:24px}}
.kicker{font-family:"Public Sans",system-ui,sans-serif;font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted,#6b6b66);margin:0 0 10px}