/* /find/ (pages-src/find.ts, site/find.js). Official results are a neutral, document-like layer: the info blue of the
   design tokens (--info, --info-bg), ink on white, no medal metals; the one use of red-to-green is the typical-range bar, where it only shows the direction of the county's scale (owner, 2026-10-15). */
.find{max-width:44rem;margin-inline:auto}
.find .lead{margin-block:.4rem 1.2rem;color:var(--ink2)}
.find-form{display:grid;gap:12px;font-family:var(--sans)}
.find-form label{font:600 15px/1.3 var(--sans);color:var(--ink)}
.find-form select,.find-form input{width:100%;min-height:48px;margin-top:6px;padding:0 12px;font:400 17px var(--sans);color:var(--ink);background:var(--paper-hi);border:1.5px solid var(--ink);border-radius:8px}
.find-form .btn{width:100%}
@media (min-width:900px){.find-form .btn{width:auto}}
.find-form .fine,.find .fine,.find-updated{font:400 14px/1.45 var(--sans);color:var(--ink2)}
.find-out{display:grid;gap:16px;margin-top:20px;font-family:var(--sans)}
.off-msg,.off-count{font:400 16px/1.4 var(--sans);color:var(--ink2)}
.off-list{display:grid;gap:16px}

/* the panel */
.off-panel{display:grid;gap:10px;padding:0 0 16px;background:var(--card);border:1px solid var(--hair);border-left:4px solid var(--info);border-radius:var(--radius,12px);box-shadow:var(--shadow);overflow:hidden}
.off-panel>*:not(.off-head){margin-inline:16px}
.off-head{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;justify-content:space-between;padding:10px 16px;background:var(--info-bg);color:var(--info);font:700 12px/1.3 var(--sans);letter-spacing:.12em;text-transform:uppercase}
.off-from{font-weight:600;letter-spacing:.02em;text-transform:none}
.off-name{font:700 22px/1.2 var(--serif);color:var(--ink)}
.off-addr{margin-top:-6px;font:400 15px/1.4 var(--sans);color:var(--ink2)}
.off-latest{display:grid;gap:2px;padding:10px 12px;background:var(--paper-2);border-radius:8px}
.off-score{font:700 26px/1.15 var(--sans);color:var(--ink)}
.off-date{font:600 15px/1.35 var(--sans);color:var(--ink)}
.off-meta{display:flex;flex-wrap:wrap;gap:4px 14px;margin:-4px 0 0;font:400 14px/1.4 var(--sans);color:var(--ink2)}
.off-phone-n{color:var(--ink);font-weight:600;white-space:nowrap}
.off-closure{padding:10px 12px;border:1px solid var(--hair);border-left:4px solid var(--ink2);border-radius:8px;display:grid;gap:4px}
.off-closure p{margin:0;font:400 15px/1.45 var(--sans);color:var(--ink)}
.off-closure-r{color:var(--ink2)}
.off-viol{font:400 15px/1.4 var(--sans);color:var(--ink2)}
.off-routine{font:400 14px/1.45 var(--sans);color:var(--ink2);margin-top:6px}
.off-risk{display:grid;gap:4px;padding:10px 12px;border:1px solid var(--hair);border-radius:8px}
.off-risk p{font:400 15px/1.45 var(--sans);color:var(--ink)}
.off-stale{font-weight:600}.off-cadence{color:var(--ink2)!important;font-size:14px!important}
.off-risk h4,.off-typical h4,.off-trend h4{margin:0 0 4px;font:700 13px/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)}
.off-typical p,.off-meaning,.off-source,.off-links,.off-data{font:400 15px/1.45 var(--sans);color:var(--ink)}
.off-pos{font-weight:600}
.off-meaning,.off-source,.off-hint{color:var(--ink2)}
.off-links a,.off-data a,.off-none a,.find-link a{font-weight:600;color:var(--water-deep)}

/* the strip: where the middle half and this place sit on the department's scale. Not a ranking: no other place is shown. */
/* The typical-range bar (core rangeBar, owner 2026-10-15): up to five blocks like a test strip, red at the county scale's bad end to green at its good end,
   numbers under each block, the middle half bracketed, this place pinned on its block. Color is the scale's direction only; the words say it too. */
.off-strip{position:relative;margin-block:8px 4px;padding-top:46px;color:var(--ink)}
.off-blocks{display:grid;grid-template-columns:repeat(var(--n,5),minmax(0,1fr));gap:3px 3px}
.off-blk{display:grid;gap:4px;justify-items:center;min-width:0}
.off-blk-c{display:block;width:100%;height:26px;border:1px solid var(--ink);border-radius:4px;background:#9e9e9e}
.off-blk.t0 .off-blk-c{background:#d32f2f}.off-blk.t1 .off-blk-c{background:#f57c00}.off-blk.t2 .off-blk-c{background:#fbc02d}.off-blk.t3 .off-blk-c{background:#9ccc65}.off-blk.t4 .off-blk-c{background:#2e7d32}
.off-ic{display:inline-block;vertical-align:-3px;margin-right:6px;flex:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5;fill:none}
.off-ic.ic4 .bg{fill:#2e7d32;stroke:#2e7d32}.off-ic.ic4 .mk{stroke:#fff;stroke-width:2}
.off-ic.ic3 .bg{stroke:#558b2f;stroke-width:1.6}.off-ic.ic3 .mk{stroke:#558b2f;stroke-width:2}
.off-ic.ic2 .bg{fill:#fbc02d;stroke:#111}.off-ic.ic2 .mk{stroke:#111;stroke-width:2}
.off-ic.ic1 .bg{stroke:#e65100;stroke-width:1.6}.off-ic.ic1 .mk{stroke:#e65100;stroke-width:2}
.off-ic.ic0 .bg{fill:#d32f2f;stroke:#d32f2f;stroke-width:2.4}.off-ic.ic0 .mk{stroke:#fff;stroke-width:2.2}
.off-blk.here .off-blk-c{outline:3px solid var(--ink);outline-offset:1px}
.off-blk-n{font:600 13px/1.2 var(--sans);color:var(--ink);white-space:nowrap}
.off-midline{grid-row:2;height:8px;margin-top:2px;border:2px solid var(--ink);border-top:0;border-radius:0 0 6px 6px}
.off-midtext{grid-row:3;grid-column:1/-1;margin:2px 0 0!important;text-align:center;font:700 13px/1.25 var(--sans)!important;color:var(--ink)}
.off-midtext.at-start{text-align:left}.off-midtext.at-end{text-align:right}
.off-pin{display:block;position:absolute;top:0;transform:translateX(-50%);width:max-content;max-width:min(13rem,100%);text-align:center;font:700 13px/1.25 var(--sans);color:var(--ink)}
.off-pin.at-start{transform:none;left:0!important;text-align:left}
.off-pin.at-end{transform:none;left:auto!important;right:0;text-align:right}
.off-blk{position:relative}
.off-blk.here::before{content:"";position:absolute;top:-12px;left:50%;margin-left:-7px;width:0;height:0;border:7px solid transparent;border-top:9px solid var(--ink);border-bottom:0}
.off-blk-u{font:400 12px/1.2 var(--sans);color:var(--ink2);white-space:nowrap}
.off-fix{margin:6px 0 0!important}.off-fix a{font-weight:600;color:var(--water-deep)}
.off-note{margin:2px 0 0!important;font:400 13px/1.4 var(--sans)!important;color:var(--ink2)}
@media (prefers-reduced-motion:no-preference){.off-blk-c{transition:none}}
.off-mid{color:var(--info);font-weight:600}

.off-trend ol{display:grid;gap:4px;margin:0;padding:0;list-style:none}
.off-trend li{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-top:1px solid var(--hair);font:400 15px/1.3 var(--sans)}
.off-t-score{font-weight:600}

/* every violation, in the department's words (full records, 2026-10-05). Critical first; words and an icon-free chip, never color alone. */
.off-found{display:grid;gap:8px}
.off-found h4,.off-history>summary{margin:0;font:700 13px/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)}
.off-groups{display:grid;gap:10px}
.off-group h5{margin:0 0 4px;font:700 15px/1.3 var(--sans);color:var(--ink)}
.off-g-critical{padding-left:10px;border-left:3px solid var(--ink)}
.off-vlist{display:grid;gap:0;margin:0;padding:0;list-style:none}
.off-v{display:grid;gap:3px;padding:8px 0;border-top:1px solid var(--hair)}
.off-v p{margin:0}
.off-v-title{font:400 15px/1.45 var(--sans);color:var(--ink);overflow-wrap:anywhere}
.off-v-code{display:inline-block;padding:0 6px;border:1px solid var(--hair);border-radius:4px;font:600 12px/1.6 var(--sans);color:var(--ink2);vertical-align:1px}
/* "What the business says it fixed" (owner, 2026-10-14): a CleanCleaver reply, in the brand's water blue with the mark, nothing like the record's neutral
   card, so nobody takes it for the county's words. Its own colors for text and ground (ink #12202B on #E4F4F9 is 14:1; the small line #1F3442 is 11:1;
   the brand blue #075570 on the tint is 7.4:1), so it reads the same in light and dark. */
.biz-says{margin:10px 0 0;padding:10px 12px 12px;background:#E4F4F9;color:#12202B;border:1.5px solid #075570;border-left:8px solid #075570;border-radius:10px;display:grid;gap:4px}
.biz-says p{margin:0}
.biz-says-brand{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font:700 12px/1.2 var(--sans);letter-spacing:.04em;text-transform:uppercase;color:#075570}
.biz-mark{width:26px;height:15px;flex:none;color:#075570}
.biz-says-tag{padding:1px 7px;border:1px solid #075570;border-radius:999px;font-weight:600;letter-spacing:.02em;text-transform:none}
.biz-says-lead{font:600 14px/1.4 var(--sans);color:#12202B}
.biz-says-note{font:400 15px/1.5 var(--sans);color:#12202B;overflow-wrap:anywhere}
.biz-says-date{font:600 13px/1.3 var(--sans);color:#1F3442}
.biz-says-not{font:400 12.5px/1.4 var(--sans);color:#1F3442}
.off-v-detail{font:400 14px/1.45 var(--sans);color:var(--ink2);overflow-wrap:anywhere}
.off-v-notes{display:flex;flex-wrap:wrap;gap:4px 6px}
select{min-height:44px;height:44px}
.off-chip{padding:1px 8px;border-radius:999px;background:var(--paper-2);font:600 12px/1.5 var(--sans);color:var(--ink2)}
.off-chip-cos{background:var(--info-bg);color:var(--info)}
.off-chip-cos::before{content:"\2713\00a0"}
.off-tiers{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0;padding:0;list-style:none;font:400 15px/1.4 var(--sans);color:var(--ink)}
.off-note{font:400 14px/1.45 var(--sans);color:var(--ink2)}
.off-more>summary,.off-h>summary,.off-history>summary{display:list-item;min-height:44px;padding:11px 0;box-sizing:border-box;cursor:pointer;font:600 15px/1.4 var(--sans);color:var(--water-deep)}
.off-history{padding-top:6px;border-top:1px solid var(--hair)}
.off-history>summary{color:var(--ink)}
.off-h{border-top:1px solid var(--hair)}
.off-h>summary{color:var(--ink);font-weight:400}
.off-h-date{font-weight:700;margin-right:12px}.off-h-score{font-weight:700}.off-h-type,.off-h-count{display:block;margin-left:1.1em;color:var(--ink2);font-size:14px;line-height:1.4}
.off-h>.off-groups{padding:0 0 10px 12px}
.off-h-status:empty{display:none}
.off-h-status{font:400 15px/1.4 var(--sans);color:var(--ink2)}
summary:focus-visible{outline:3px solid var(--water-deep);outline-offset:2px;border-radius:4px}

.off-down-line{font:600 17px/1.4 var(--sans);color:var(--ink)}
.off-none{display:grid;gap:8px;padding:16px;border:1px dashed var(--rule);border-radius:16px;font:400 16px/1.45 var(--sans)}
.off-check{display:grid;gap:8px;justify-items:start;padding:12px 16px;background:var(--paper-2);border-radius:10px}
.off-checked{font:400 15px/1.4 var(--sans);color:var(--ink2)}
.off-check .btn[disabled]{opacity:.55;cursor:not-allowed}

/* the support banner (owner, 2026-10-04): the department's work first, our offer second, independence always */
.hd-banner{display:grid;gap:8px;max-width:44rem;margin:8px auto 0;padding:16px 18px;background:var(--info-bg);border-radius:12px;font:400 16px/1.5 var(--sans);color:var(--ink)}
.hd-banner .hd-lead{font:600 17px/1.45 var(--sans)}
.hd-banner a{font-weight:600;color:var(--water-deep)}
.hd-banner .fine{font-size:14px;color:var(--ink2)}
.hd-compact{margin:0;font-size:15px}.hd-compact .hd-lead{font-size:15px}

/* the area page's explainers */
.find-meaning,.find-typical,.find-how,.find-report,.find-states,.find-about,.find-faq{max-width:44rem;margin-inline:auto}
.find-meaning h2,.find-typical h2,.find-how h2,.find-report h2,.find-states h2,.find-about h2,.find-faq h2{font:700 clamp(24px,4vw,30px)/1.2 var(--serif);margin-bottom:10px}
.find-meaning p,.find-typical p,.find-how p,.find-report p,.find-about p{margin-bottom:10px}
.bands{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 10px;padding:0;list-style:none;font:400 15px var(--sans)}
.bands li{padding:6px 10px;border:1.5px solid var(--ink);border-radius:8px;background:var(--paper-hi)}
.typical-list{display:grid;gap:8px;margin:0 0 10px;padding-left:1.1em;font:400 16px/1.45 var(--sans)}
.find-list{display:grid;gap:6px;margin:0;padding-left:1.1em;font:400 17px/1.4 var(--sans)}
.find-areas .fine{display:block;font-size:14px;color:var(--ink2)}
.find-faq details{padding:10px 0;border-top:1px solid var(--hair);font-family:var(--sans)}
.find-faq summary{min-height:44px;display:flex;align-items:center;font:600 17px/1.3 var(--sans);cursor:pointer}
.find-faq details p{font:400 16px/1.5 var(--sans);color:var(--ink2)}
.hd-list{columns:2 16rem;margin:0 0 12px;padding-left:1.1em;font:400 15px/1.45 var(--sans)}
@media (prefers-reduced-motion:no-preference){.off-panel{animation:off-in .2s ease-out both}@keyframes off-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}}
html[data-motion=off] .off-panel{animation:none}

/* The owner's disclaimer: next to the result, quiet but readable (not footer small print). */
.off-disclaimer{display:grid;gap:4px;padding:10px 12px;border-top:1px solid var(--hair);font:400 14px/1.45 var(--sans);color:var(--ink2)}
.off-disclaimer a{color:var(--water-deep);font-weight:600}
.off-tell{padding:0;border:0;background:none;font:600 14px/1.45 var(--sans);color:var(--water-deep);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.off-tell-form{display:grid;gap:8px;margin-top:6px}.off-tell-form textarea{width:100%;padding:8px;font:400 16px var(--sans);border:1.5px solid var(--ink);border-radius:8px}
.off-tell-form .hp{position:absolute;left:-9999px}.off-tell-out{font-weight:600;color:var(--ink)}
.find-disclaimer{max-width:44rem;margin:12px auto 0}

/* "Ask for correction" (owner, 2026-10-05): a real button on each inspection; the form says we fix our copy, the department its record. */
.off-corr{display:grid;gap:8px;justify-items:start}
.off-corr-btn{min-height:44px;padding:8px 14px;border:1.5px solid var(--ink);border-radius:8px;background:var(--paper-hi);font:600 15px/1.2 var(--sans);color:var(--ink);cursor:pointer}
.off-corr-btn:focus-visible{outline:3px solid var(--water-deep);outline-offset:2px}
.off-corr-form,.off-corr-done{display:grid;gap:10px;width:100%;padding:12px;border:1px solid var(--hair);border-radius:8px;background:var(--paper-2);font:400 15px/1.45 var(--sans);color:var(--ink)}
.off-corr-form p{margin:0}
.off-corr-form fieldset{display:grid;gap:2px;margin:0;padding:0;border:0}
.off-corr-form legend{margin-bottom:4px;font-weight:700}
.off-corr-choice{display:flex;align-items:center;gap:8px;min-height:44px}
.off-corr-choice input{width:20px;height:20px;margin:0}
.off-corr-form label:not(.off-corr-choice){display:grid;gap:4px;font-weight:600}
.off-corr-form textarea,.off-corr-form input[type=email]{width:100%;min-height:44px;padding:8px;font:400 16px var(--sans);border:1.5px solid var(--ink);border-radius:8px;box-sizing:border-box}
.off-corr-form .hp{position:absolute;left:-9999px}
.off-corr-out{font-weight:600}.off-corr-out:empty{display:none}
.off-corr-thanks{margin:0;font-weight:700}
.off-corr-disagree{margin:0;color:var(--ink2);font-size:14px}
.off-corr-disagree a{color:var(--water-deep);font-weight:600}
.off-h>.off-corr{padding:0 0 12px 12px}
.off-call{display:inline-flex;align-items:center;min-height:44px;margin-left:6px;padding:0 14px;border:1.5px solid var(--ink);border-radius:999px;font:600 15px/1 var(--sans);color:var(--ink);text-decoration:none;vertical-align:middle}
.off-call:focus-visible{outline:3px solid var(--water-deep);outline-offset:2px}
/* Owner 2026-10-08: our last read date and the department's newest results, on every area and place view. */
.off-held{margin:14px 0 4px}
.off-asof{font:600 16px/1.45 var(--sans);color:var(--ink);margin:0 0 6px}
.off-recent a{font-weight:600}

/* The results and the map (site/find.js, site/find-map.js). In the list view the map is not drawn; in the map view (.lk-mv, find-map.css)
   it fills the inset container and the rows float over it. There is no third layout (state review 2026-10-16). */
.off-results{display:grid;gap:16px}
.off-results>.off-map{display:none}
.off-map{display:grid;gap:8px}
.off-map-canvas{width:100%;height:100%;min-height:220px;border:1px solid var(--hair);border-radius:16px;overflow:hidden;background:var(--paper-2)}
.off-map-bar{display:flex;flex-wrap:wrap;gap:8px}
.off-map-bar .btn{min-height:44px;width:auto}
.off-map-status{margin:0;font:400 14px/1.4 var(--sans);color:var(--ink2)}
.off-map-status:empty{display:none}
.off-onmap{justify-self:start;min-height:40px;padding:0 12px;font:600 14px var(--sans);color:var(--ink);background:none;border:1.5px solid var(--hair);border-radius:8px;cursor:pointer}
.off-onmap:focus-visible{outline:3px solid var(--info);outline-offset:2px}
.off-panel.off-selected{border-left-color:var(--ink);box-shadow:0 0 0 3px var(--ink),var(--shadow)}
.off-name:focus{outline:none}

/* "Use my location" (owner, 2026-10-12): optional; hidden until the script sees the browser can do it. 44 px targets. */
.find-near{display:grid;gap:6px;font-family:var(--sans)}
.find-near[hidden]{display:none}
.find-near-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0}
.find-near .btn{min-height:44px}
.find-near-stop{min-height:44px;padding:0 14px;font:600 15px var(--sans);color:var(--ink);background:none;border:1.5px solid var(--hair);border-radius:8px;cursor:pointer}
.find-near-stop[hidden]{display:none}
.find-near-stop:focus-visible,.off-go a:focus-visible,.find-near-there:focus-visible{outline:3px solid var(--water-deep);outline-offset:2px}
.find-near-why{margin:0}
.find-near-line{margin:0;font:400 15px/1.45 var(--sans);color:var(--ink2)}
.find-near-line:empty{display:none}
.find-near-there{display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:var(--water-deep)}
.find-near-page{margin-top:16px}
/* Each place: how far, and directions in the visitor's own maps app (the destination only). */
.off-dist{margin:0;font:600 15px/1.3 var(--sans);color:var(--ink)}
.off-go{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0}
.off-go-btn{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1.5px solid var(--ink);border-radius:999px;font:600 15px/1 var(--sans);color:var(--ink);text-decoration:none}
.off-go-alt{display:inline-flex;align-items:center;min-height:44px;padding:0 6px;font:600 14px/1 var(--sans);color:var(--water-deep)}
.off-close{margin:0;font:400 14px/1.4 var(--sans);color:var(--ink2)}

/* The first step in full (core fixit.ts, site/find.js; owner, 2026-10-13): the item's guide inline, its first step in full, then a fade with no
   words in it and the ask over it (the newspaper paywall look). Neutral ink and the info blue only: never a grade color. */
.off-fix-box{display:grid;gap:8px;margin-top:4px}
/* "Fix and log it now" (core fixgo.ts, site/find.js, the place page; owner, 2026-10-15: "bold and actionable", maroon): the one solid button
   on a cited line, a link straight to the fix in the app. Full width on a phone (52px tall, 17px bold), a solid button on a desktop
   (never a text link). --fixlog is its own token: not --stop (the critical label), not --ink ("Start your 25 days free"). */
.off-fixwrap{display:grid;gap:8px;margin-top:8px}
.off-fixgo{display:flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 22px;border-radius:10px;background:var(--fixlog);color:var(--fixlog-ink);font:700 17px/1.2 var(--sans);letter-spacing:.01em;text-decoration:none;text-align:center;box-shadow:0 1px 0 rgba(0,0,0,.2),0 8px 16px -10px rgba(77,18,27,.7);transition:background-color .15s,transform 90ms ease-out}
.off-fixgo::before{content:"";flex:none;width:8px;height:14px;margin-top:-4px;border-right:3px solid currentColor;border-bottom:3px solid currentColor;transform:rotate(45deg)}
.off-fixgo:hover{background:var(--fixlog-deep)}
.off-fixgo:active{background:var(--fixlog-press);transform:translateY(1px)}
.off-fixgo:focus-visible{outline:none;box-shadow:0 0 0 3px #fff,0 0 0 6px var(--fixlog)}
@media (min-width:900px){.off-fixgo{justify-self:start;min-width:300px}}
.off-fix{justify-self:start;display:inline-flex;align-items:center;gap:6px;min-height:44px;min-width:44px;padding:0 16px;border:1.5px solid var(--ink);border-radius:999px;background:var(--paper-hi);font:600 15px/1 var(--sans);color:var(--ink);cursor:pointer}
.off-fix::after{content:"";width:7px;height:7px;margin-left:2px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translate(-2px,-2px)}
.off-fix[aria-expanded="true"]::after{transform:rotate(-135deg) translate(-2px,-2px)}
.off-fix:focus-visible,.fx a:focus-visible{outline:3px solid var(--water-deep);outline-offset:2px}
.fx{display:grid;gap:6px;scroll-margin-bottom:84px;padding:14px 14px 16px;background:var(--paper-hi);border:1px solid var(--hair);border-radius:10px}
.fx p{margin:0}
.fx-kicker{font:700 12px/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--info)}
.fx-title{font:700 19px/1.25 var(--serif);color:var(--ink);text-wrap:balance}
.fx-step{display:grid;gap:4px}
.fx-step-h{font:600 15px/1.35 var(--sans);color:var(--ink)}
.fx-lines{display:grid;gap:4px;margin:0;padding-left:20px;font:400 15px/1.5 var(--sans);color:var(--ink)}
.fx-lines .fx-n{list-style:none;margin-left:-20px}
.fx-cite{font:400 13px/1.4 var(--sans);color:var(--ink2)}
.fx-fade{display:grid;gap:10px;height:84px;padding-top:6px;overflow:hidden;-webkit-mask-image:linear-gradient(#000 0%,rgba(0,0,0,.45) 45%,transparent 100%);mask-image:linear-gradient(#000 0%,rgba(0,0,0,.45) 45%,transparent 100%);filter:blur(1.5px)}
.fx-bar{display:block;height:10px;border-radius:5px;background:var(--ink2);opacity:.28}
.fx-bar:nth-child(3n+2){width:92%}.fx-bar:nth-child(3n){width:74%}
.fx-more{font:400 14px/1.45 var(--sans);color:var(--ink2)}
.fx-free a,.fx-other a{display:inline-flex;align-items:center;min-height:44px;font-weight:600;color:var(--water-deep)}
.fx-cover{font:400 15px/1.45 var(--sans);color:var(--ink)}
.fx-cta{display:grid;gap:6px;justify-items:center;margin-top:6px;padding:14px;background:var(--card);border:1px solid var(--hair);border-radius:10px;text-align:center;box-shadow:var(--shadow)}
.fx-cta-over{position:relative;margin-top:-34px}
.fx-claim{width:100%;min-height:52px;padding:10px 16px;white-space:normal;line-height:1.25;overflow-wrap:anywhere;text-wrap:balance}
.fx-trial{font:600 14px/1.35 var(--sans);color:var(--ink)}
.fx-other{font:400 15px/1.4 var(--sans);color:var(--ink2)}
@media (prefers-reduced-motion:no-preference){.fx:not([hidden]){animation:fx-in .18s ease-out}}
@keyframes fx-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.fx-home{display:grid;gap:6px;margin-top:10px;padding-top:12px;border-top:1px solid var(--hair)}
.fx-home p{margin:0}
.fx-home-cta{margin-top:4px}
.off-similar{margin-top:14px;padding:14px;border:1px solid var(--hair);border-radius:10px;background:var(--paper-hi)}
.off-similar h4{margin:0 0 4px}
.off-similar .similar-list{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:12px}
.off-similar .similar-list .btn{width:100%;max-width:420px;min-height:52px;white-space:normal;text-wrap:balance}
.off-similar .similar-list .fine{margin:4px 0 0}

/* ── The search experience (owner, 2026-10-16; site/lookup-bar.js, site/find.js 7; state review 2026-10-16). Airbnb's bar, Google's
   results, the place page's listing look: paper, ink, greys and hairlines; maroon (--fixlog) only for the one main action (Search).
   ONE bar in two sizes (the hero's, and the compact one that stays under the site header once a search has run: the same segments,
   order and labels). TWO presentations on a wide screen: the list (one column at the bar's own width and left edge) or the map
   (find-map.css); ONE on a phone (the map behind the pull-up sheet). Spacing on the design scale (4 8 12 16 20 24 32 40 56); radii
   10 chips, 16 cards, 24 sheets, 999 pills. One breakpoint, 900 px. Every glide is off under Reduce Motion. ── */
.find[data-hero]{max-width:60rem;--lk-g:#5F6B74;--lk-l:#E3E1DA;--lk-r:999px;--lk-t:200ms;padding-top:16px;gap:16px}
[data-hero] h1{margin:8px auto 16px;max-width:none;text-align:center;font:600 clamp(1.75rem,4vw,2.5rem)/1.1 var(--serif);letter-spacing:-.01em;text-wrap:balance;color:var(--ink)}
[data-hero] .kicker{text-align:center}
.lk-svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* The switch under the header ([CleanCleaver] | [Restaurant lookup]): the hero state only. Once results show, the header's own
   Restaurant Lookup pill says where you are (one copy, owner decision 2026-10-16). */
.lk-top{display:grid;justify-items:center;padding:8px 16px}
body:has(.find[data-hero].is-results) .lk-top{display:none}
/* What the page answers (AEO): three short sentences under the bar, quiet; the dated line under them. */
.lk-how{display:grid;gap:4px;max-width:44rem;margin:16px auto 0;text-align:center}
.lk-how p{margin:0;font:400 15px/1.5 var(--sans);color:var(--ink2)}
.lk-checked{margin:8px auto 0!important;text-align:center}
.lk-checked[hidden]{display:none}
.lk-js .find-near-why{display:none}
.find-nojs{max-width:44rem;margin:12px auto 0;font:400 16px/1.5 var(--sans)}
[data-hero] .find-form{gap:12px}
[data-hero] [data-find-remember]{text-align:center}
[data-hero] .find-near{justify-items:center;text-align:center}
.find[data-hero] .find-out:empty{display:none}
.find[data-hero] .lk-how{margin-top:8px}

/* ── The results state (Google's results header). The hero folds once a search has run: the H1 stays, small; the SAME bar goes compact
   and stays under the site header; the results come in one column at the bar's width and left edge. ── */
.find[data-hero].is-results{padding-top:8px;gap:8px}
.find[data-hero].is-results h1{width:100%;max-width:56rem;margin:0 auto;text-align:left;font:600 13px/1.3 var(--sans);letter-spacing:0;color:var(--ink2)}
.find[data-hero].is-results :is(.kicker,.lk-how,[data-find-remember],.find-disclaimer){display:none}
.is-results>form.find-form{position:sticky;top:calc(env(safe-area-inset-top,0px) + var(--mh-c,64px));z-index:30;padding-block:8px;background:var(--paper)}
@media (max-width:899px){.is-results>form.find-form{top:calc(env(safe-area-inset-top,0px) + var(--mh-c,60px))}}
@media (min-width:900px){
  .is-results .lk-bar{padding:4px;box-shadow:0 1px 3px rgba(23,35,46,.1)}
  .is-results .lk-seg{min-height:46px;padding-block:2px}
}
[data-hero] .find-out{width:100%;max-width:56rem;margin-inline:auto}
.off-results-list{display:grid;gap:16px;min-width:0}
/* The results line: how the list is ordered (never a count), and the one List | Map control at its right (the same place in both views). */
.lk-rhead{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;min-height:44px}
.lk-rhead .off-count{margin:0}
.lk-view{display:inline-flex;padding:4px;border:1px solid #C9CDD0;border-radius:999px;background:var(--paper-hi)}
.lk-view[hidden]{display:none}
.lk-view-b{position:relative;min-height:36px;min-width:64px;padding:0 16px;border:0;border-radius:999px;background:none;font:600 15px/1 var(--sans);color:var(--ink);cursor:pointer}
.lk-view-b::after{content:"";position:absolute;inset:-4px 0}
.lk-view-b[aria-pressed=true]{background:var(--ink);color:#fff}
.lk-view-note{margin:0;flex-basis:100%;font:400 14px/1.4 var(--sans);color:var(--ink2)}
.lk-view-note:empty{display:none}
@media (max-width:899px){.lk-view{display:none!important}}
.lk-view-b:focus-visible,.lk-fchip:focus-visible,.lk-none-b:focus-visible,.lk-again:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
/* The filter chips under the results line, only when they would change the list (the kinds are the bar's Kind segment). */
.lk-filters{display:flex;flex-wrap:wrap;gap:8px}
.lk-filters[hidden]{display:none}
.lk-fchip{flex:none;min-height:44px;padding:0 16px;border:1px solid #C9CDD0;border-radius:999px;background:var(--paper-hi);font:500 14.5px/1 var(--sans);color:var(--ink);white-space:nowrap;cursor:pointer;transition:background-color .15s,border-color .15s}
.lk-fchip:hover{border-color:var(--ink)}
.lk-fchip[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
/* ── My places (site/find-mine.js; the list a place page's Save keeps): under the bar in the hero, quiet, the list open; once results show,
   the same control is a chip "My places (3)" that opens the list. A native <details>, so the chip is the disclosure (keyboard, expanded state).
   Rows: name, "City · Last inspected …", the New dot (a word beside it, never color alone), ✕ at 44 px. Nothing glides but the chevron. ── */
.lk-mine{display:grid;width:100%;max-width:56rem;margin:0 auto}
.lk-mine[hidden]{display:none}
.lk-mine-s{display:inline-flex;align-items:center;gap:8px;justify-self:center;width:max-content;max-width:100%;min-height:44px;margin:0;padding:0 12px;border:1px solid transparent;border-radius:999px;list-style:none;font:600 14.5px/1 var(--sans);color:var(--ink2);cursor:pointer;user-select:none;-webkit-user-select:none}
.lk-mine-s::-webkit-details-marker{display:none}
.lk-mine-s::after{content:"";width:7px;height:7px;margin:-3px 0 0 2px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform 150ms var(--ease)}
.lk-mine[open]>.lk-mine-s::after{margin:3px 0 0 2px;transform:rotate(-135deg)}
.lk-mine-s:hover{color:var(--ink)}
.lk-mine-s:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.lk-mine-l{display:grid;width:100%;margin:4px 0 0;padding:0;list-style:none;border:1px solid var(--lk-l,#E3E1DA);border-radius:16px;background:var(--paper-hi);box-shadow:0 1px 2px rgba(23,35,46,.05);overflow:hidden}
.lk-mine-r{display:flex;align-items:center;gap:4px;min-height:56px;padding:0 6px 0 16px}
.lk-mine-r+.lk-mine-r{border-top:1px solid var(--lk-l,#E3E1DA)}
.lk-mine-a{display:flex;flex:1;flex-wrap:wrap;align-items:baseline;gap:2px 10px;min-width:0;min-height:44px;padding:8px 0;border-radius:10px;color:var(--ink);text-decoration:none}
.lk-mine-a:hover .lk-mine-nm{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.lk-mine-a:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.lk-mine-nm{font:600 15.5px/1.3 var(--sans);overflow-wrap:anywhere}
.lk-mine-d{font:400 14px/1.3 var(--sans);color:var(--ink2)}
.lk-mine-dt{white-space:nowrap}
.lk-mine-new{display:inline-flex;align-items:center;gap:5px;font:600 12.5px/1 var(--sans);color:var(--fixlog);white-space:nowrap}
.lk-mine-new i{width:8px;height:8px;border-radius:50%;background:var(--fixlog)}
.lk-mine-x{display:grid;place-items:center;flex:none;width:44px;height:44px;border:0;border-radius:50%;background:transparent;font:400 16px/1 var(--sans);color:var(--lk-g,#5F6B74);cursor:pointer}
.lk-mine-x:hover{background:rgba(23,35,46,.07);color:var(--ink)}
.lk-mine-x:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}
.lk-mine-u{display:flex;flex:1;flex-wrap:wrap;align-items:center;gap:0 4px;min-height:44px;font:400 14.5px/1.3 var(--sans);color:var(--ink2)}
.lk-mine-ub{min-height:44px;padding:0 12px;border:0;border-radius:10px;background:none;font:600 14.5px/1 var(--sans);color:var(--ink);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.lk-mine-ub:hover{background:rgba(23,35,46,.07)}
.lk-mine-ub:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
/* The results state: the chip, at the list's left edge (the same look as a filter chip); open, it is the pressed chip. */
.is-results .lk-mine-s{justify-self:start;padding:0 16px;border-color:#C9CDD0;background:var(--paper-hi);font:500 14.5px/1 var(--sans);color:var(--ink)}
.is-results .lk-mine-s:hover{border-color:var(--ink)}
.is-results .lk-mine[open]>.lk-mine-s{background:var(--ink);border-color:var(--ink);color:#fff}
.is-results .lk-mine-l{margin-top:8px}
@media (prefers-reduced-motion:reduce){.lk-mine-s::after{transition:none}}
html[data-motion=off] .lk-mine-s::after{transition:none}
/* One column of one card shape (no tiles). */
.lk-grid{display:grid;gap:16px;grid-template-columns:minmax(0,1fr)}
.lk-card{position:relative;display:grid;align-content:start;gap:8px;min-width:0;padding:16px;border:1px solid var(--lk-l,#E3E1DA);border-radius:16px;background:var(--paper-hi);box-shadow:0 1px 2px rgba(23,35,46,.05);transition:transform 180ms var(--ease),box-shadow 180ms var(--ease),border-color 180ms}
.lk-card[hidden]{display:none}
.lk-card:not(.lk-card-skel):hover{transform:translateY(-2px);border-color:#D3D1C8;box-shadow:0 2px 4px rgba(23,35,46,.06),0 14px 28px -14px rgba(23,35,46,.35)}
.lk-card:focus-within{box-shadow:0 0 0 2px var(--ink),0 14px 28px -14px rgba(23,35,46,.35)}
.lk-card.off-selected{box-shadow:0 0 0 3px var(--ink)}
.lk-card-n{margin:0;font:700 19px/1.25 var(--serif);color:var(--ink);overflow-wrap:anywhere}
.lk-card-a{color:inherit;text-decoration:none}
.lk-card-a::after{content:"";position:absolute;inset:0;border-radius:16px}
.lk-card-a:focus-visible{outline:none}
.lk-card-a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.lk-card p{margin:0}
.lk-card-k{font:500 15px/1.35 var(--sans);color:var(--ink)}
.lk-card-d{font:400 14.5px/1.35 var(--sans);color:var(--ink2)}
.lk-card-r{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:4px!important}
/* The points chip: the place page's counter cell, small, in ink only (no band colour until the answer carries the place page's relative band). */
.lk-chip{--c:var(--ink);display:inline-flex;align-items:center;min-height:28px;padding:0 8px;border:1.5px solid var(--c);border-radius:8px;box-shadow:inset 0 2px 4px rgba(23,35,46,.12);font:700 15px/1 var(--sans);font-variant-numeric:tabular-nums;color:var(--c);white-space:nowrap}
.lk-crit{display:inline-flex;align-items:center;gap:4px;font:600 14.5px/1.2 var(--sans);color:#A8231B}
.lk-tri{width:16px;height:16px;flex:none}
.lk-tri path{fill:currentColor}.lk-tri .lk-tri-mark{fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round}
.lk-voice{display:inline-flex;align-items:center;min-height:24px;padding:0 8px;border:1px solid #075570;border-radius:999px;font:600 12.5px/1 var(--sans);color:#075570}
.lk-card-cl{font:600 14px/1.4 var(--sans);color:var(--ink)}
.lk-card .off-dist{margin-top:2px}
.lk-card-go{position:relative;z-index:2;margin-top:4px!important}
.lk-card .off-close{font-size:13.5px}
/* Loading: the shape of the answer (skeleton cards); a soft shimmer only when motion is allowed; after 2 s a word, after 8 s a way out. */
.lk-skel{display:grid;gap:12px}
.lk-skel .lk-card{gap:12px;min-height:120px}
.lk-bone{display:block;height:14px;border-radius:7px;background:#EDEBE5}
.lk-bone.w70{width:70%;height:20px}.lk-bone.w45{width:45%}.lk-bone.w55{width:55%}.lk-bone.w30{width:30%;height:28px;border-radius:8px}
@media (prefers-reduced-motion:no-preference){html:not([data-motion=off]) .lk-bone{background:linear-gradient(90deg,#EDEBE5 0%,#F6F5F1 50%,#EDEBE5 100%);background-size:200% 100%;animation:lk-shim 1.2s linear infinite}}
@keyframes lk-shim{from{background-position:100% 0}to{background-position:-100% 0}}
.lk-slow{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin:0;font:400 15px/1.45 var(--sans);color:var(--ink2)}
.lk-slow:empty{display:none}
/* Empty and error states: what happened, then the one thing to do (ours first; the department's own site low and quiet). */
.lk-none-h{font:600 17px/1.4 var(--sans)!important;color:var(--ink)}
.lk-none-tip{display:flex;flex-wrap:wrap;gap:4px 16px;color:var(--ink2)}
.lk-none-b{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;border:0;background:none;font:600 15px/1.2 var(--sans);color:var(--ink);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.lk-none-src{font:400 14px/1.45 var(--sans)!important;color:var(--ink2)}
.lk-fnone{padding:16px;border:1px dashed var(--rule,#C9CDD0);border-radius:16px;font:400 16px/1.45 var(--sans)}
.lk-fnone p{margin:0}
.lk-fnone[hidden]{display:none}
.lk-err{display:grid;gap:12px;justify-items:start;padding:16px;border:1px solid #E7C9C5;border-left:4px solid #A8231B;border-radius:16px;background:var(--paper-hi)}
.lk-err .off-msg{color:var(--ink)}
/* Under the results: the source, whose data it is, and the department's own lookup, small. */
.lk-src{display:grid;gap:8px;margin-top:4px;padding-top:12px;border-top:1px solid var(--hair);font:400 14px/1.45 var(--sans);color:var(--ink2)}
.lk-src p{margin:0}
.lk-src .off-disclaimer{padding:0;border:0}
.lk-src-link a{font-weight:600;color:var(--water-deep)}
/* Map-only pieces stay out of the list view; the closing line shows in both. */
.lk-row-acts{display:none}
.lk-end{margin:0;padding:16px;text-align:center;font:500 14.5px/1.4 var(--sans);color:var(--ink2)}

/* "Use my location" in use: one status line and its one action (Stop) on one row; the county note steps aside meanwhile. */
.lk-js .find-near{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 12px}
.lk-js .find-near[hidden]{display:none}
.lk-js .find-near-line{order:-1}
.find-form:has([data-near-stop]:not([hidden])) [data-find-remember]{display:none}

/* A new answer on its way: the old results stay, dimmed, never a blank flash (skeletons only after 300 ms). */
.find-out.lk-busy>*{opacity:.55;transition:opacity 120ms var(--ease)}
.find-out.lk-busy{pointer-events:none}
@media (prefers-reduced-motion:reduce){.find-out.lk-busy>*{transition:none}}