/* Command reference pages (County Control, CashFlow): search, audience filter, grouped cards. */
.shell{width:min(100% - 2*var(--gutter),var(--wrap));margin-inline:auto}
.page-head{padding:3rem 0 1.5rem}
.page-head .lede{font-size:1.05rem;color:var(--ink-2);max-width:44rem;margin:.9rem 0 0}
.page-head .num{font-weight:650;color:var(--ink);font-variant-numeric:tabular-nums}
.tools{position:sticky;top:4rem;z-index:20;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-block:1px solid var(--line);padding:.85rem 0;margin-bottom:2rem}
.tools .shell{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
.tools .search{flex:1 1 18rem;max-width:28rem}
.filters{display:flex;flex-wrap:wrap;gap:.35rem}
.filters button{font:inherit;font-size:.88rem;font-weight:500;padding:.45rem .8rem;border-radius:999px;border:1px solid var(--line-strong);background:var(--bg);color:var(--ink-2);cursor:pointer;transition:background-color .15s,color .15s,border-color .15s}
.filters button:hover{background:var(--surface);color:var(--ink)}
.filters button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.group{margin-bottom:2.5rem}
.group > h2{font-size:1.3rem}
.group > p{color:var(--ink-2);margin:.35rem 0 1rem}
.cmds{display:grid;gap:.75rem;align-items:start}
@media (min-width:48em){.cmds{grid-template-columns:repeat(2,minmax(0,1fr))}}
.cmd{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);padding:1rem 1.15rem}
.cmd .top-line{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .6rem}
.cmd .top-line .aud{margin-left:auto}
.cmd .n{font-family:var(--mono);font-weight:600;font-size:.95rem}
.cmd .aud{font-size:.75rem;font-weight:600;color:var(--ink-3);border:1px solid var(--line);border-radius:999px;padding:.12rem .55rem;white-space:nowrap}
.cmd > p{margin:.35rem 0 0;color:var(--ink-2);font-size:.92rem}
.subs{margin-top:.75rem;border-top:1px solid var(--line);padding-top:.6rem;display:grid;gap:.4rem}
.sub-row{display:grid;grid-template-columns:minmax(0,auto) 1fr;gap:.2rem .75rem;font-size:.86rem;color:var(--ink-3);align-items:baseline}
.sub-row > code{background:none;padding:0;color:var(--ink);font-size:.82rem;white-space:nowrap}
.sub-row .args{margin-left:.35rem;font-size:.78rem}
@media (max-width:30em){.sub-row{grid-template-columns:1fr}}
.none{color:var(--ink-3);text-align:center;padding:2rem 0}

/* CashFlow's reference layout (main.ref): one search box, jump links, sections of .cmd cards. */
main.ref{width:min(100% - 2*var(--gutter),var(--wrap));margin-inline:auto;padding:3rem 0 4rem}
main.ref > .lede{font-size:1.05rem;color:var(--ink-2);max-width:44rem;margin:.9rem 0 1.5rem}
main.ref .search{position:sticky;top:4.75rem;z-index:20;display:flex;align-items:center;gap:.6rem;max-width:32rem;background:var(--bg);border:1px solid var(--line-strong);border-radius:var(--radius-sm);padding:0 .8rem;box-shadow:var(--shadow)}
main.ref .search svg{width:1.05rem;height:1.05rem;color:var(--ink-3);flex:none}
main.ref .search input{border:0;box-shadow:none;padding:.7rem 0;background:none}
main.ref .count{font-size:.88rem;color:var(--ink-3);margin:.75rem 0 1rem}
main.ref .jump{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:2.5rem}
main.ref .jump a{font-size:.85rem;font-weight:500;text-decoration:none;color:var(--ink-2);border:1px solid var(--line);border-radius:999px;padding:.3rem .75rem}
main.ref .jump a:hover{background:var(--surface);color:var(--ink)}
main.ref section{margin-bottom:2.75rem;scroll-margin-top:8rem}
main.ref section > h2{display:flex;align-items:center;gap:.6rem;font-size:1.3rem;margin-bottom:1rem}
main.ref section > h2 svg{width:1.3rem;height:1.3rem;color:var(--accent)}
main.ref section > h2 .n{font-size:.8rem;font-weight:600;color:var(--ink-3);background:var(--surface-2);border-radius:999px;padding:.1rem .55rem}
main.ref .grid{display:grid;gap:.75rem;align-items:start}
@media (min-width:48em){main.ref .grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:72em){main.ref .grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
main.ref .ct{display:flex;flex-wrap:wrap;align-items:baseline;gap:.3rem .5rem}
main.ref .ct code{background:none;padding:0;font-weight:600;font-size:.92rem;color:var(--ink)}
main.ref .ct .args{font-family:var(--mono);font-size:.8rem;color:var(--ink-3)}
main.ref .ct .al{margin-left:auto;font-size:.75rem;color:var(--ink-3)}
main.ref .cmd p{margin:.35rem 0 0;color:var(--ink-2);font-size:.9rem}
