/* The board on the site, the Notes slice: the pinboard (#notes) and a client's meeting write-ups, in TODAY'S HQ LOOK (moved, not
   redesigned): the old page's Notes (a large title, a search field, Open · Done, one card per topic, rows with a two-line title, its
   rest and a line of facts) on board.css's tokens and type ramp. Every rule under .bd and prefixed nt-, so no other slice is touched. */
.bd .nt-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin:4px 0 14px;min-width:0}
.bd .nt-title{font-family:var(--serif);font-weight:400;font-size:var(--t-title);line-height:1.05;letter-spacing:-.01em;flex:1 1 auto}
.bd .nt-acts{display:flex;gap:8px;flex-wrap:wrap}
.bd .nt-tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:0 0 16px;min-width:0}
.bd .nt-q{flex:1 1 260px;min-width:0;min-height:44px;padding:8px 14px;border:1px solid var(--line-2);border-radius:99px;background:var(--surface);color:var(--label);font-size:var(--t-body)}
.bd .nt-q::placeholder{color:var(--label-3)}
.bd .nt-q:focus-visible{border-color:var(--line-4);outline:2px solid var(--accent);outline-offset:1px}
.bd .nt-skq{display:block;height:44px;flex:1 1 260px;border-radius:99px}
.bd .nt-seg{display:flex;gap:4px;flex:none}
.bd .nt-segb{min-height:44px;padding:0 14px;border-radius:99px;font-size:var(--t-sub);font-weight:500;color:var(--label-2);white-space:nowrap;transition:background-color .15s ease-out,color .15s ease-out}
.bd .nt-segb:hover{color:var(--label)}
.bd .nt-segb.on{background:var(--raise);color:var(--label)}
.bd .nt-cols{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:start;min-width:0}
.bd .nt-top{height:6px}

/* a note's row: the title on up to two lines, its rest on up to two, then its facts; the whole row opens the note */
.bd .nt-row{cursor:pointer;align-items:center}
@media (hover:hover){.bd .nt-row:hover{background:var(--surface-2)}}
.bd .nt-row:active{background:var(--raise)}
.bd .nt-clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bd .nt-meta{font-size:var(--t-meta);line-height:1.45;color:var(--label-3);overflow-wrap:anywhere}
.bd .nt-chev{flex:none;width:16px;height:16px;color:var(--label-3)}
.bd .nt-empty{padding:14px var(--pad) 12px;color:var(--label-2);font-size:var(--t-sub);line-height:1.5}
.bd .nt-foot{padding:8px var(--pad) 10px;font-size:var(--t-meta);line-height:1.5;color:var(--label-3)}
.bd .nt-pad{padding:0 var(--pad) 18px}
.bd .row-sub.nt-ready{color:var(--accent)}

/* a client's page: the write-ups' header carries its one button */
.bd .nt-wh{align-items:center;justify-content:space-between}
.bd .nt-wh .btn{margin-left:auto}

/* the sheets */
.bd .nt-left{justify-self:start;min-height:44px;padding:0 12px;font-size:var(--t-body);color:var(--label-2);border-radius:99px}
.bd .nt-left:hover{color:var(--label)}
.bd .nt-form{display:grid;gap:22px}
.bd .nt-area{min-height:140px}
.bd .nt-area[aria-invalid="true"],.bd .nt-in[aria-invalid="true"]{border-color:var(--late)}
.bd .nt-f{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;padding:6px 16px}
.bd .f-group .nt-f + .nt-f::before{content:"";position:absolute;top:0;left:16px;right:16px;height:1px;background:var(--sep)}
.bd .nt-f label{flex:0 0 72px;font-size:var(--t-body);color:var(--label)}
.bd .nt-in{flex:1 1 auto;min-width:0;width:100%;min-height:44px;padding:8px 12px;border:1px solid var(--line-2);border-radius:12px;background:var(--surface);color:var(--label);font-size:var(--t-body)}
.bd .nt-in::placeholder{color:var(--label-3)}
.bd .nt-in:focus-visible{border-color:var(--line-4);outline:2px solid var(--accent);outline-offset:1px}
.bd .nt-picks{display:flex;flex-wrap:wrap;gap:8px}
.bd .nt-act{min-height:52px;cursor:pointer}
.bd .nt-act .row-title{color:var(--link)}
@media (hover:hover){.bd .nt-act:hover{background:var(--raise)}}
.bd .nt-act:disabled .row-title{color:var(--label-3)}
.bd .nt-apart{margin-top:6px;padding-top:18px;border-top:1px solid var(--sep)}
.bd .nt-apart .btn{justify-self:start}
.bd .nt-danger{color:var(--late);border-color:var(--late-line)}
.bd .nt-danger:hover{border-color:var(--late)}
.bd .nt-prose{color:var(--label)}
.bd .nt-working{display:grid;gap:2px;background:var(--surface-2);border:1px solid var(--line);border-radius:16px;overflow:hidden}

/* a line to keep or untick: a real checkbox under a drawn box, so the keyboard and a screen reader get the native control */
.bd .nt-pick{cursor:pointer;align-items:flex-start;min-height:52px}
.bd .nt-pick input{position:absolute;opacity:0;width:44px;height:44px;left:6px;top:4px;margin:0;cursor:pointer}
.bd .nt-box{flex:none;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin-top:1px;border-radius:99px;border:1.5px solid var(--line-4);color:transparent;transition:background-color .15s ease-out,border-color .15s ease-out}
.bd .nt-box svg{width:14px;height:14px}
.bd .nt-pick input:checked + .nt-box{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.bd .nt-pick input:focus-visible + .nt-box{outline:2px solid var(--accent);outline-offset:3px}
.bd .nt-pick input:not(:checked) ~ .row-main .row-title{color:var(--label-2);text-decoration:line-through;text-decoration-color:var(--line-4)}

/* the board's navigation with a fifth link or more: it wraps under the brand on a phone rather than pushing the page sideways */
@media (max-width:560px){ .bd .bd-top{flex-wrap:wrap} .bd .bd-nav{flex-wrap:wrap;justify-content:flex-start;margin-left:-10px} }

@media (min-width:1024px){
  .bd .nt-cols.two{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
  .bd .nt-cols .col{gap:20px}
  .bd .nt-tools{margin-bottom:22px}
  .bd .nt-row{padding-block:12px}
}
@media (pointer:coarse){ .bd .nt-wh .btn{min-height:44px} }
@media (prefers-reduced-motion:reduce){ .bd .nt-segb,.bd .nt-box{transition:none} }