/* Berry: stark black and gold, no green (BerryStarkBlackTheme, DECISIONS.md 9 Nov 2026). Tokens below; tools/check-contrast.cjs (AA) and
   tools/green-scan.cjs read them. --green* keep their old names but are neutral greys. */
/*TOKENS:gold*/
/* THE GOLD: the default, Moccona gold (BerryGoldAndBlack). Switch in data/gold.json, never here (lib/gold.js swaps these values). */
:root{--brand-gold:#cfa54a;--brand-gold-hi:#e4c57c;--brand-gold-lite:#ecd49c;--brand-gold-low:#b58930;--brand-gold-shade:#7d5d21;--brand-gold-deep:#7b5a19;--brand-gold-deep-hi:#634713;--brand-gold-bright:#eacd8a;--brand-gold-bright-hi:#f4e3be;--brand-gold-ink:#0b0b0b;
--gold-sheen:linear-gradient(172deg,var(--brand-gold-lite),var(--brand-gold) 30%,var(--brand-gold) 62%,var(--brand-gold-low));
--gold-sheen-text:linear-gradient(var(--brand-gold-lite),var(--brand-gold-hi) 45%,var(--brand-gold));
--gold-rule:linear-gradient(90deg,transparent,var(--brand-gold-shade) 10%,var(--brand-gold) 34%,var(--brand-gold-lite),var(--brand-gold) 66%,var(--brand-gold-shade) 90%,transparent);
--gloss-black:linear-gradient(#1a1a1a,#070707 42%,#000000);--gloss-edge:inset 0 1px 0 rgba(255,255,255,.10),inset 0 -1px 0 rgba(0,0,0,.6);
--gloss-btn:linear-gradient(#2e2e2e,#161616 46%,#050505);--gloss-btn-hi:linear-gradient(#3a3a3a,#1e1e1e 46%,#0a0a0a);--gloss-btn-line:#3a3a3a;--gold-edge:inset 0 1px 0 rgba(255,255,255,.28)}
/*TOKENS:base*/
:root{
--bg:#0a0a0a;--bg2:#0b0b0b;--surface:#111111;--surface2:#1b1b1b;
--ink:#f5f5f5;--muted:#bdbdbd;
--gold:var(--brand-gold);--gold-hi:var(--brand-gold-hi);--on-gold:var(--brand-gold-ink);
--green:#262626;--green-hi:#333333;--on-green:#f5f5f5;
--line:#2a2a2a;--line-ui:#8a8a8a;
--ok:#8fd3a6;--ok-bg:#161616;--warn:#f0d078;--warn-bg:#33290d;--bad:#ff9d96;--bad-bg:#381a18;--info:#a9c0f5;--info-bg:#1a2442;
--emerg:#b3261e;--on-emerg:#fff;--danger:#a8322b;--on-danger:#fff;
/* BerryMeaningColours: six meanings, one each, everywhere (lib/meaning.js). text / bar+border / soft background */
--m-you:#ffb27a;--m-you-line:#f08a4b;--m-you-bg:#3d2414;
--m-them:#a9c4ff;--m-them-line:#6f95e8;--m-them-bg:#18243d;
--m-clock:#ff9d96;--m-clock-line:#e8625a;--m-clock-bg:#3a1817;
--m-money:#f4a6cf;--m-money-line:#d9659f;--m-money-bg:#3a1a2c;
--m-done:#a6dc8c;--m-done-line:#6aa955;--m-done-bg:#161616;
--m-info:#d6b6ff;--m-info-line:#a47ce6;--m-info-bg:#2a1d40;
--shadow:0 1px 2px rgba(0,0,0,.6),0 6px 18px rgba(0,0,0,.45);
--sw-light:#ffffff;--sw-warm:#efe2c8;--sw-dark:#000000;
--hero-tint:#141414;
}
/*TOKENS:light-pref*/
@media (prefers-color-scheme:light){
:root{
--bg:#0b0b0b;--bg2:#101010;--surface:#161616;--surface2:#1f1f1f;
--muted:#c4c4c4;--line:#303030;--line-ui:#949494;
}
}
/*TOKENS:theme-light*/
html[data-theme="light"]{color-scheme:light;
--hero-tint:#f2f2f2;
--bg:#ffffff;--bg2:#f7f7f7;--surface:#ffffff;--surface2:#f1f1f1;
--ink:#161616;--muted:#555555;
--gold:var(--brand-gold-deep);--gold-hi:var(--brand-gold-deep-hi);--on-gold:#ffffff;
--green:#1f1f1f;--green-hi:#333333;--on-green:#ffffff;
--line:#e3e3e3;--line-ui:#767676;
--ok:#1d6b3a;--ok-bg:#f2f2f2;--warn:#7a5600;--warn-bg:#fbf0d0;--bad:#a3261e;--bad-bg:#fbe4e1;--info:#2a4c99;--info-bg:#e5ebfa;
--emerg:#b3261e;--on-emerg:#fff;--danger:#a8322b;--on-danger:#fff;
--m-you:#97440f;--m-you-line:#b8601f;--m-you-bg:#fcefe4;
--m-them:#2a4c99;--m-them-line:#4f72c4;--m-them-bg:#e9eefa;
--m-clock:#a3261e;--m-clock-line:#c9463d;--m-clock-bg:#fbe7e4;
--m-money:#9c2a6b;--m-money-line:#c0508f;--m-money-bg:#fbeaf3;
--m-done:#2d641c;--m-done-line:#4b8a37;--m-done-bg:#f2f2f2;
--m-info:#6339a8;--m-info-line:#8059c6;--m-info-bg:#f1eafb;
--shadow:0 1px 2px rgba(0,0,0,.06),0 6px 20px rgba(0,0,0,.07);
}
/*TOKENS:theme-warm*/
html[data-theme="warm"]{color-scheme:light;
--hero-tint:#ece4d4;
--bg:#f7f1e6;--bg2:#f0e7d7;--surface:#fcf8f1;--surface2:#efe5d3;
--ink:#2a241c;--muted:#5c5244;
--gold:var(--brand-gold-deep);--gold-hi:var(--brand-gold-deep-hi);--on-gold:#ffffff;
--green:#3b342b;--green-hi:#4d4438;--on-green:#ffffff;
--line:#e3d7c2;--line-ui:#7f725d;
--ok:#1d6b3a;--ok-bg:#efe8dc;--warn:#6f4f00;--warn-bg:#fbf0d0;--bad:#a3261e;--bad-bg:#fbe4e1;--info:#2a4c99;--info-bg:#e5ebfa;
--emerg:#b3261e;--on-emerg:#fff;--danger:#a8322b;--on-danger:#fff;
--m-you:#8f400d;--m-you-line:#b8601f;--m-you-bg:#fcefe4;
--m-them:#2a4c99;--m-them-line:#4f72c4;--m-them-bg:#e9eefa;
--m-clock:#a3261e;--m-clock-line:#c9463d;--m-clock-bg:#fbe7e4;
--m-money:#8f2662;--m-money-line:#c0508f;--m-money-bg:#fbeaf3;
--m-done:#2a5d1a;--m-done-line:#4b8a37;--m-done-bg:#efe8dc;
--m-info:#6339a8;--m-info-line:#8059c6;--m-info-bg:#f1eafb;
--shadow:0 1px 2px rgba(42,36,28,.07),0 6px 20px rgba(42,36,28,.08);
}
/*TOKENS:contrast-boost*/
html[data-contrast="high"]{
--hero-tint:#141414;
--bg:#000;--bg2:#050505;--surface:#0d0d0d;--surface2:#171717;
--ink:#fff;--muted:#e6e6e6;--gold:var(--brand-gold-bright);--gold-hi:var(--brand-gold-bright-hi);
--line:#6a6a6a;--line-ui:#bdbdbd;
--ok:#a8e6bc;--warn:#f7dc8e;--bad:#ffb4ae;--info:#c0d1fa;
--m-you:#ffc79e;--m-you-line:#ff9a5c;--m-them:#c2d5ff;--m-them-line:#8fb0f5;--m-clock:#ffb8b2;--m-clock-line:#f47a72;
--m-money:#ffc2e1;--m-money-line:#ef8cc0;--m-done:#bfe8aa;--m-done-line:#84c46e;--m-info:#e2caff;--m-info-line:#b997f0;
}
/*END TOKENS*/

:root{
--r:12px;--r-sm:10px;
--s1:4px;--s2:8px;--s3:16px;--s4:24px;--s5:32px;--s6:48px;--s7:64px; /* 8-pt grid */
--t-1:.8rem;--t0:1rem;--t1:1.25rem;--t2:1.5625rem;--t3:1.953rem;--t4:2.441rem;--t5:3.052rem; /* type scale, ratio 1.25 */
--dur:160ms; /* every transition is <= 200 ms */
--side-w:232px;--bar-h:68px;
--serif:"Berry Serif","Lora fb",Georgia,"Times New Roman",serif;--sans:Figtree,"Figtree fb",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
color-scheme:dark;
}
@media (max-width:1099px){:root{--side-w:76px}}
html[data-side="full"]{--side-w:232px}
html[data-side="icons"]{--side-w:76px}
html[data-side="hidden"]{--side-w:0px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;font-size:106.25%}
html[data-size="s"]{font-size:100%}
html[data-size="l"]{font-size:118.75%}
html[data-size="xl"]{font-size:131.25%}
body{margin:0;font:400 var(--t0)/1.6 var(--sans);color:var(--ink);background:var(--bg)}
h1,h2,h3{font-family:var(--serif);line-height:1.2;margin:0 0 var(--s2);color:var(--ink)}
h1{font-size:clamp(var(--t3),5vw,var(--t5))}h2{font-size:var(--t2);margin-top:var(--s5)}h3{font-size:var(--t1)}
a{color:var(--gold-hi);text-underline-offset:3px}a:hover{color:#fff}
:focus-visible{outline:3px solid var(--gold-hi);outline-offset:2px;border-radius:4px}
/* BerryAccessibilityPass, 5 Nov 2026: error links must leave their fields below the sticky header. */
input,select,textarea{scroll-margin-top:6rem}
/* BerryAccessibilityPass, 5 Nov 2026: MapLibre removes outlines; keep keyboard focus inside its white controls. */
.maplibregl-ctrl-group button:focus-visible{outline:3px solid #111;outline-offset:-3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:var(--gold);color:var(--on-gold);padding:var(--s3);z-index:100;font-weight:700}
.skip:focus{left:0}
.wrap{max-width:1160px;margin:0 auto;padding:0 var(--s4)}
.narrow{max-width:720px}
.block{padding-top:var(--s4);padding-bottom:var(--s4)}
.muted{color:var(--muted)}.small{font-size:var(--t-1)}.fine{font-size:var(--t-1);color:var(--muted);padding-bottom:var(--s4)}
.lead{font-size:var(--t1);color:var(--muted)}
main p,main li{max-width:68ch} /* 45-75 characters per line */
main .card p,main .card li,main .form p,main .facts p,main .chips li,main .ws-tile p,main table p,main .ws-banner p{max-width:none}

/* ---- sidebar (BerryNavSidebar): ONE menu at every width. Desktop: a column in three states set on <html data-side>: hidden, icons, full.
   Without script it stays full. Phone: the same menu is a drawer that grows up from a button at the bottom-left (see the phone block). */
.side{position:fixed;z-index:50;left:0;top:0;bottom:0;width:var(--side-w);display:flex;flex-direction:column;background:var(--bg2);border-right:1px solid var(--line);transition:width var(--dur)}
.page{margin-left:var(--side-w);min-height:100vh;transition:margin var(--dur)}
.side-bar{display:flex;align-items:center;gap:var(--s2);padding:var(--s2);min-height:64px}
.keys{display:none}
.drawer{flex:1;min-height:0;display:flex;flex-direction:column;gap:var(--s2);padding:0 var(--s2) var(--s3);overflow-y:auto;overflow-x:hidden}
.drawer .logo{padding:var(--s1) var(--s2) var(--s2);min-height:48px}
.menu{display:flex;flex-direction:column;gap:var(--s3);flex:1}
.grp{display:flex;flex-direction:column;gap:var(--s1)}
.grp-h{margin:0;padding:0 var(--s3);font:600 .75rem var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);max-width:none}
/* BerryWorkspaceFocus: the staff menu keeps five daily places on top; the rest are in "More (n)" */
.grp-more>summary{list-style:none;cursor:pointer;color:var(--muted)}.grp-more>summary::-webkit-details-marker{display:none}.grp-more[open]>summary{color:var(--ink)}.grp-more>.grp{margin-top:var(--s2)}
.side-foot{display:flex;flex-direction:column;gap:var(--s1);border-top:1px solid var(--line);padding-top:var(--s2)}
.si{display:flex;align-items:center;gap:var(--s3);min-height:48px;padding:0 var(--s3);border-radius:var(--r-sm);color:var(--ink);text-decoration:none;font-weight:500;border:1px solid transparent;transition:background var(--dur),border-color var(--dur)}
.si:hover{background:var(--surface2);color:var(--ink)}
.si .ic{flex:0 0 24px;color:var(--gold)}
.si[aria-current]{background:var(--surface2);border-color:var(--gold);color:var(--gold-hi);font-weight:700}
.si-safety .ic{color:var(--bad)}
.si-safety{background:var(--bad-bg);border-color:var(--bad);color:var(--bad);font-weight:700}
.si-safety:hover{background:#4a2320;color:var(--bad)}
.si[aria-expanded="true"]{border-color:var(--gold-hi)}
.sl{white-space:nowrap}
.scrim{display:none}
/* the menu button: it sits INSIDE the sidebar and its picture and words say what it is doing (three pictures, three labels) */
.side-toggle{display:inline-flex;align-items:center;gap:var(--s2);min-height:48px;min-width:48px;padding:0 var(--s3);border:1px solid var(--line-ui);border-radius:var(--r-sm);background:var(--surface);color:var(--gold);font:600 var(--t0) var(--sans);white-space:nowrap;cursor:pointer}
.side-toggle:hover{background:var(--surface2)}
.side-toggle .tl{color:var(--ink)}
.ic-s-hidden,.ic-s-icons,.tl-hidden,.tl-icons{display:none}
html[data-side="hidden"] .ic-s-hidden,html[data-side="hidden"] .tl-hidden,html[data-side="icons"] .ic-s-icons,html[data-side="icons"] .tl-icons{display:inline-block}
html[data-side="hidden"] .ic-s-full,html[data-side="hidden"] .tl-full,html[data-side="icons"] .ic-s-full,html[data-side="icons"] .tl-full{display:none}
html:not(.js) .side-toggle{display:none}
.logo-top{display:flex}
@media (min-width:701px){
html:not([data-side]) .logo-top,html[data-side="full"] .logo-top{display:none}
html[data-side="icons"] .sl,html[data-side="icons"] .tl,html[data-side="hidden"] .tl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
html[data-side="icons"] .drawer .logo,html[data-side="icons"] .grp-h{display:none}
html[data-side="icons"] .grp+.grp{border-top:1px solid var(--line);padding-top:var(--s2)}
html[data-side="icons"] .si{justify-content:center;padding:0}
html[data-side="icons"] .side-bar{justify-content:center}
html[data-side="icons"] .side-toggle{padding:0}
html[data-side="hidden"] .side{border:0;background:none}
html[data-side="hidden"] .drawer{display:none}
html[data-side="hidden"] .side-bar{position:absolute;left:var(--s2);top:var(--s2);padding:0;min-height:0}
html[data-side="hidden"] .side-toggle{padding:0;background:var(--bg2)}
html[data-side="hidden"] .hdr-in{padding-left:calc(var(--s2) + 48px + var(--s3))}
html[data-side="full"] .hdr-safety{display:none}
html[data-side="full"] .hdr{display:none}
/* right-handed: the button and the sidebar swap sides */
html[data-hand="right"] .side{left:auto;right:0;border-right:0;border-left:1px solid var(--line)}
html[data-hand="right"] .page{margin-left:0;margin-right:var(--side-w)}
html[data-hand="right"][data-side="hidden"] .side{border:0}
html[data-hand="right"][data-side="hidden"] .side-bar{left:auto;right:var(--s2)}
html[data-hand="right"][data-side="hidden"] .hdr-in{padding-left:var(--s4);padding-right:calc(var(--s2) + 48px + var(--s3))}
html[data-hand="right"] .sheet{left:auto;right:calc(var(--side-w) + var(--s3))}
}

/* ---- top bar */
.hdr{background:var(--bg);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
.hdr-in{display:flex;align-items:center;gap:var(--s3);min-height:64px;padding:var(--s2) var(--s4)}
.hdr-in .btn-sm{margin-left:auto}
.hdr-in .hdr-ws+.hdr-acct{margin-left:0} /* BerryViewerSignIn: staff see Workspace beside My account; the pair sits right */
.hdr-site .hdr-short{display:none}
@media (max-width:700px){.hdr-site .hdr-long{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.hdr-site .hdr-short{display:inline}.hdr-in .btn-sm.hdr-site,.hdr-in .btn-sm.hdr-ws{white-space:nowrap}}
@media (max-width:440px){.hdr-in:has(.hdr-site),.hdr-in:has(.hdr-ws){flex-wrap:wrap;row-gap:var(--s1)}} /* a 390 px phone: the row may wrap, never overflow */
/* ---- BerryPhonePolish (5 Nov): see DECISIONS.md */
@media (max-width:700px){
.hdr.hdr-staff{transition:transform var(--dur,.2s) ease}
.hdr.hdr-staff.hdr-away{transform:translateY(-100%)}
.hdr.hdr-staff .hdr-in{flex-wrap:nowrap;min-height:56px;gap:var(--s2);padding-block:var(--s1)}
.hdr.hdr-staff .hdr-in .hdr-site{margin-left:auto;width:44px;min-width:44px;height:44px;padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:999px}
.hdr.hdr-staff .hdr-site .hdr-short{display:inline-flex}.hdr.hdr-staff .hdr-site .ic{width:22px;height:22px}
.hdr.hdr-staff .hdr-in .hdr-safety{width:44px;min-width:44px;height:44px;padding:0;margin-left:0;justify-content:center}
.hdr.hdr-staff .hdr-safety span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
}
@media (prefers-reduced-motion:reduce){.hdr.hdr-staff{transition:none}}
html[data-motion="reduce"] .hdr.hdr-staff{transition:none}
.wl-h{font-size:var(--t1);margin:var(--s4) 0 var(--s1)}
.wl-list .wl-row{display:flex;gap:var(--s3);align-items:flex-start}
.wl-th{flex:0 0 72px;width:72px;height:54px;object-fit:cover;border-radius:var(--r-sm);background:var(--surface2)}
.wl-none{display:block;border:1px dashed var(--line-ui)}
.wl-t{display:flex;flex-direction:column;gap:2px;min-width:0;overflow-wrap:anywhere}
.wl-a>a{display:inline-block;min-height:44px;padding-top:10px}
.wl-p{font-weight:600}.wl-m{font-size:var(--t-1)}
.wl-fold>summary,.ln-box .fold>summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-weight:600}
/* BerryAgentHistory (5 Nov 2026): My history and the read-only past-listing page; every link and control is at least 44 px tall */
.ah-link a,.ah-person a,.ah-doc,.ah-when a{display:inline-flex;align-items:center;min-height:44px}
.ah-chips{margin:var(--s2) 0}
.ah-pick{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:flex-end;margin:0 0 var(--s3)}.ah-pick .field{flex:1 1 220px;margin:0}
.ah-sub{font-weight:400}
.ah-top{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:flex-start;margin:var(--s3) 0}
.ah-photo{display:block;width:100%;max-width:480px;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r-sm);background:var(--surface2)}
.ah-facts{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:4px var(--s3);margin:0;flex:1 1 260px;min-width:0}
.ah-facts dt{color:var(--muted);font-weight:600}.ah-facts dd{margin:0;overflow-wrap:anywhere}
.ah-note{display:flex;flex-direction:column;gap:2px;padding:var(--s2) 0;border-bottom:1px solid var(--line)}
.ah-when{font-size:var(--t-1);color:var(--muted)}.ah-text{white-space:pre-wrap;overflow-wrap:anywhere}
.le-box{margin:var(--s4) 0}.le-fold>summary.le-open{list-style:none;width:auto}.le-fold>summary.le-open::-webkit-details-marker{display:none}.le-fold[open]>summary.le-open{margin-bottom:var(--s2)}
.le-two{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr));gap:0 var(--s3)}
.ln-box.ln-none{border:1px solid var(--line);border-radius:var(--r);background:var(--bg2);padding:var(--s2) var(--s3);margin:var(--s3) 0}
.ln-one{margin:0;min-height:44px;display:flex;align-items:center;flex-wrap:wrap}
.ln-box .ln-list{display:block}.ln-box .ln-list li{margin:var(--s1) 0} /* the learn page's .ln-list cards are not for this box */
.ln-box .ln-list a{display:inline-flex;height:auto;min-height:44px;align-items:center;background:none;border:0;padding:0 var(--s2);color:var(--gold-hi);text-decoration:underline}
.ln-quiet{margin:var(--s2) 0 0}
.mp-set{border:0;padding:0;margin:0 0 var(--s3)}.mp-h{font-weight:600;margin:var(--s3) 0 0}.mp-set .mp-row{display:flex}
.pr-setup{margin-top:var(--s3)}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font:700 var(--t1) var(--serif)}
.logo:hover{color:var(--gold-hi)}
.logo small{display:block;font:400 .75rem var(--sans);color:var(--muted);letter-spacing:.1em;text-transform:uppercase;line-height:1.1}
.logo-mark{display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;border-radius:50%;background:var(--gold);color:var(--on-gold);font:700 1.2rem var(--serif)}
.btn-sm{display:inline-flex;align-items:center;min-height:44px;padding:0 var(--s4);border-radius:999px;background:var(--gold);color:var(--on-gold);font-weight:700;text-decoration:none}
.btn-sm:hover{background:var(--gold-hi);color:var(--on-gold)}

/* ---- breadcrumbs */
.crumbs{margin:0 0 var(--s3)}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0 var(--s2);font-size:var(--t-1)}
.crumbs li{display:inline-flex;align-items:center;min-height:32px;color:var(--muted)}
.crumbs li+li::before{content:"/";margin-right:var(--s2);color:var(--muted)}
.crumbs a{color:var(--gold-hi)}
.crumbs [aria-current]{color:var(--ink)}
.crumb{color:var(--muted);margin:0 0 var(--s3)}

/* ---- hero */
.hero{background:linear-gradient(180deg,var(--bg2),var(--bg));padding:var(--s6) 0 var(--s5);border-bottom:1px solid var(--line)}
.hero h1{max-width:16em}
.search{display:flex;gap:10px;margin:var(--s3) 0;flex-wrap:wrap}
.search input{flex:1 1 260px;font:inherit;padding:14px 16px;border:2px solid var(--line-ui);border-radius:var(--r);background:var(--surface2);color:var(--ink);min-height:52px}
::placeholder{color:var(--muted);opacity:1}
.cta-row{display:flex;gap:10px;flex-wrap:wrap}

/* ---- buttons */
.btn,.btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);font:600 var(--t0) var(--sans);min-height:48px;padding:0 22px;border-radius:999px;border:2px solid var(--green-hi);background:var(--green);color:var(--on-green);text-decoration:none;cursor:pointer;transition:background var(--dur),border-color var(--dur),transform var(--dur)}
.btn:hover{background:var(--green-hi);color:var(--on-green)}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn-alt{background:var(--gold);border-color:var(--gold);color:var(--on-gold)}.btn-alt:hover{background:var(--gold-hi);border-color:var(--gold-hi);color:var(--on-gold)}
.btn-ghost{background:transparent;color:var(--gold-hi);border-color:var(--gold)}.btn-ghost:hover{background:var(--surface2);color:#fff}
.btn-ghost.small{min-height:44px;padding:0 16px;font-size:var(--t0)}
.btn-danger{background:var(--danger);border-color:var(--danger);color:var(--on-danger)}.btn-danger:hover{background:#8a2822;color:var(--on-danger)}
.btn-emerg{background:var(--emerg);border-color:var(--emerg);color:var(--on-emerg);font-size:var(--t1);min-height:56px;width:100%}.btn-emerg:hover{background:#951e17;color:var(--on-emerg)}
.inline{display:inline-block;margin:0 8px 8px 0}

/* ---- chips and the location chip */
.chips{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center}
.chip{display:inline-flex;gap:6px;align-items:center;padding:10px 16px;border:1px solid var(--line-ui);border-radius:999px;background:var(--surface);text-decoration:none;color:var(--ink);min-height:44px;transition:border-color var(--dur),background var(--dur)}
a.chip:hover{border-color:var(--gold);color:var(--ink)}
.chip.on{background:var(--gold);color:var(--on-gold);border-color:var(--gold);font-weight:600}
.loc{display:inline-flex;align-items:center;gap:4px;padding:2px 10px 2px 6px;border-radius:999px;background:var(--surface2);border:1px solid var(--line-ui);color:var(--ink);font-size:var(--t-1);font-weight:600}
.loc .ic{width:16px;height:16px;color:var(--gold)}
.idtag{display:inline-block;font:600 var(--t-1) ui-monospace,Consolas,monospace;padding:1px 8px;border-radius:6px;background:var(--surface2);border:1px dashed var(--line-ui);color:var(--muted)}

/* ---- grid + cards: price > address > facts > agent */
.grid{display:grid;gap:var(--s4);grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
.grid.one{grid-template-columns:1fr}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow);transition:border-color var(--dur),transform var(--dur)}
.card:hover{border-color:var(--gold);transform:translateY(-2px)}
/* one frame for every photo: 3:2, rounded, thin border, blurred placeholder until the picture arrives */
.card-pic,.pic,.gallery li,.ws-photos li .frame{position:relative;display:grid;place-items:center;aspect-ratio:3/2;overflow:hidden;background:radial-gradient(120% 120% at 30% 20%,#262626,#121212);color:#f5f5f5;font:700 var(--t1) var(--serif);text-decoration:none}
.card-pic{border-bottom:1px solid var(--line)}
.pic{border-radius:var(--r);border:1px solid var(--line-ui);margin-bottom:var(--s3);align-content:center;gap:6px;text-align:center}
.pic small{font:400 var(--t-1) var(--sans);color:var(--muted)}
.card-pic img,.gallery img{position:absolute;inset:0}
/* BerryBuyLightAgain, 31 Oct 2026: noscript supplies the photo when scripting is off; keep one reserved frame. BerrySliceFixesPublic (5 Nov): only photos below the first row are deferred like this. */
html:not(.js) img[data-photo-src]{display:none}
.card-pic img,.gallery img,.ws-photos img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity var(--dur),filter var(--dur)}
html.js .card-pic img:not(.is-loaded),html.js .gallery img:not(.is-loaded),html.js .ws-photos img:not(.is-loaded){opacity:0;filter:blur(14px)}
.card-body{display:flex;flex-direction:column;gap:var(--s1);padding:var(--s3)}
/* the page text reads address, place, facts, price; the price is shown first (flex order) so the card ranks price > address > facts > agent */
.card .price{order:-1;margin:0;font:700 var(--t2)/1.2 var(--serif);color:var(--gold-hi)}
.card .price .muted{font:400 var(--t0) var(--sans)}
.card .price{font-family:var(--sans);min-height:2.4em}
.facts .fact-price{grid-column:1/-1;background:none;border:0;padding:0}
.facts .fact-price dd{font:700 var(--t3)/1.2 var(--sans);color:var(--gold-hi)}
.card h3{margin:0;font:600 var(--t1)/1.3 var(--sans)}.card h3 a{color:var(--ink);text-decoration:none}.card h3 a:hover{text-decoration:underline;color:var(--ink)}
.where{margin:0;color:var(--muted);display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2)}
.factline{margin:0;color:var(--ink);font-weight:500}
.card .listed{margin:var(--s1) 0 0}.card .agent{margin:var(--s2) 0 0;display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4)}.card .agent .agent-mini{color:var(--ink,inherit);font-weight:600}
.card .save,.link-save{font-size:var(--t0);display:inline-block;padding:10px 0;min-height:44px}
.row-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.card form{margin-top:var(--s1)}

/* ---- bands, layouts */
.band{background:var(--bg2);border-block:1px solid var(--line);padding:var(--s5) 0;margin-top:var(--s4)}
.band.slim{background:transparent;border:0;padding:var(--s4) 0}
.two{display:grid;gap:var(--s5)}
@media(min-width:860px){.two{grid-template-columns:1.4fr 1fr}.band .two{grid-template-columns:1fr 1fr}}
.facts{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));margin:var(--s3) 0}
.facts div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 14px}
.facts dt{font-size:var(--t-1);color:var(--muted)}.facts dd{margin:0;font-weight:600}
.plain{list-style:none;padding:0}.plain li{padding:6px 0}
.cols{columns:2 240px}
.steps li{margin:6px 0}

/* ---- forms */
.form,.filters{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:var(--s4)}
.filters{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));align-items:end;margin-bottom:var(--s3)}
.field{display:block;font-weight:600;font-size:var(--t0);margin:0 0 12px}
.filters .field{margin:0}
.field input,.field select,.field textarea,.vis select{display:block;width:100%;margin-top:4px;font:inherit;font-weight:400;padding:11px 12px;min-height:48px;border:2px solid var(--line-ui);border-radius:var(--r-sm);background:var(--surface2);color:var(--ink)}
.field input:focus,.field select:focus,.field textarea:focus,.search input:focus{border-color:var(--gold-hi)}
select{color-scheme:dark}
input[type=checkbox],input[type=radio]{accent-color:var(--gold)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.notice{background:var(--warn-bg);border:1px solid var(--warn);color:var(--warn);border-radius:var(--r);padding:12px 16px}
.empty{padding:30px 0;color:var(--muted)}
.srch{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;margin-bottom:12px}
.srch label{margin-right:14px;display:inline-block;padding:6px 0}

/* ---- coming */
.coming{list-style:none;padding:0;display:grid;gap:14px}
.coming li{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px}
.coming h2{margin:6px 0 4px;font-size:var(--t1)}.coming p{margin:0}
.badge{display:inline-block;background:var(--gold);color:var(--on-gold);font-weight:700;font-size:var(--t-1);letter-spacing:.05em;text-transform:uppercase;padding:3px 10px;border-radius:999px}

/* ---- map */
.mapfig{margin:0}.map{width:100%;height:auto;border:1px solid var(--line-ui);border-radius:14px;background:#141414}
.sea{fill:#141414}.pin{fill:var(--gold);stroke:#0b0b0b;stroke-width:3}
.pin-n{fill:#0b0b0b;font:700 14px system-ui,sans-serif}.pin-l{fill:var(--ink);font:600 15px system-ui,sans-serif;paint-order:stroke;stroke:#141414;stroke-width:4px}
a:focus-visible .pin{stroke:#fff}
.mgrid{fill:none;stroke:#2a2a2a;stroke-width:1}.mnote{fill:#b0b0b0;font:500 13px system-ui,sans-serif}

/* ---- footer (BerryFooter, 29 Oct): brand + contact block, four headed groups, one legal row, a quiet bottom bar.
   Phone: the groups are <details> that app.js closes; summaries and every link are 44 px. Map pages: no visible footer. */
.foot{background:var(--bg2);border-top:1px solid var(--line);color:var(--ink);margin-top:var(--s6);padding-top:var(--s6)}
.foot a{color:var(--ink);text-decoration:none}
.foot a:hover{color:var(--gold-hi);text-decoration:underline;text-underline-offset:3px}
.foot ul{list-style:none;margin:0;padding:0}
.foot .ic{width:18px;height:18px;flex:none;color:var(--gold)}
.foot-in{display:grid;gap:var(--s5);grid-template-columns:minmax(260px,1.15fr) 3fr;padding-bottom:var(--s5)}
.foot-logo{display:inline-flex;align-items:center;gap:10px;min-height:44px;font:700 var(--t1) var(--serif);color:var(--ink)}
.foot-logo small{display:block;font:600 .75rem var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.foot-promise{margin:var(--s2) 0 var(--s3);color:var(--muted);max-width:34ch}
.foot-contact li{display:flex;align-items:center;gap:10px;min-height:44px}
.foot-contact a{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--gold-hi);font-weight:600}
.foot-contact .foot-addr,.foot-contact .foot-hours{align-items:flex-start;padding:11px 0;line-height:1.4;color:var(--ink)}
.foot-contact .foot-hours{color:var(--muted)}
.foot-contact li>*,.foot-contact a>span{min-width:0;overflow-wrap:anywhere}/* BerryBrowserSuitesFix: at 200% text on a 320 px phone the agency e-mail address pushed the page 95 px sideways (tests/public-fixes-browser.cjs) */
.foot-groups{display:grid;gap:var(--s4);grid-template-columns:repeat(4,minmax(0,1fr))}
.foot-g summary{list-style:none;display:flex;align-items:center;justify-content:space-between;min-height:44px;cursor:default}
.foot-g summary::-webkit-details-marker{display:none}
.foot-g h2{margin:0;font:700 var(--t-1) var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.foot-chev{display:none}
.foot-g a{display:flex;align-items:center;min-height:44px}
.foot-base{padding-bottom:var(--s4)}
.foot-base::before{content:"";display:block;border-top:1px solid var(--line);margin-bottom:var(--s2)}
.foot-legal{display:flex;flex-wrap:wrap;align-items:center;gap:0;font-size:var(--t-1);color:var(--ink)}
.foot-legal li{display:inline-flex;align-items:center;white-space:nowrap;min-height:44px}
.foot-legal li+li::before{content:"·";color:var(--muted);padding:0 10px}
.foot-legal a{display:inline-flex;align-items:center;min-height:44px;color:var(--gold-hi);text-decoration:underline;text-underline-offset:3px}
.foot-bar{display:flex;flex-wrap:wrap;align-items:center;gap:0 var(--s3);margin:0;font-size:var(--t-1);color:var(--muted)}
.foot-bar a{display:inline-flex;align-items:center;min-height:44px;color:var(--gold-hi);text-decoration:underline;text-underline-offset:3px}
.foot-src{flex:1 1 30ch;padding:var(--s1) 0}
.foot-staff{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s1) var(--s4);padding-bottom:var(--s2);font-size:var(--t-1)}
.foot-staff a,.foot-out{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--gold-hi);font:inherit;font-weight:600}
.foot-out{background:none;border:0;padding:0;cursor:pointer}
.foot-out:hover{text-decoration:underline;text-underline-offset:3px}
.foot-staff form{margin:0}
.foot-lic{margin-inline-start:auto}
.foot.foot-ws{margin-top:var(--s5);padding-top:var(--s2)}
.foot-ws.foot-map{display:none}
.foot-map.sr{top:0;left:0;margin:0;padding:0;border:0} /* hidden for the eye: .foot's margin and padding would still hang it below the map and add scroll */
/* with no footer the map is the end of the page: where the header is hidden (full sidebar, desktop) the map takes its 76 px too, so no empty band is left */
@media (min-width:701px){html[data-side="full"] .map-page .mapapp:not(.embed){height:100vh;height:100dvh}}
@media (max-width:1099px){.foot-in{grid-template-columns:1fr}}
@media (max-width:700px){
.foot{padding-top:var(--s5)}
.foot-in{gap:var(--s3);padding-bottom:var(--s3)}
.foot-groups{grid-template-columns:1fr;gap:0;border-top:1px solid var(--line)}
.foot-g{border-bottom:1px solid var(--line)}
.foot-g summary{cursor:pointer;min-height:52px}
.foot-g h2{font-size:var(--t0);letter-spacing:.04em;text-transform:none;color:var(--ink)}
.foot-chev{display:block;transition:transform var(--dur)}
.foot-g[open] .foot-chev{transform:rotate(180deg)}
.foot-g ul{padding:0 0 var(--s2) var(--s2)}
.foot-legal li{white-space:normal}
.foot-legal li:first-child{flex-basis:100%}
.foot-legal li:nth-child(2)::before{content:none}
.foot-legal li+li::before{padding:0 8px}
.foot-bar{gap:0 var(--s2)}
}
/* ---- BerryBlindSiteFixes (5 Nov 2026), from the blind critique (kin-research/blind-critique-site-5-nov/VERDICTS.md). Tokens only. ---- */
/* item 13: the licence row's dots. Each item carries its own dot in front; the list is pulled 1.4em left and that strip is clipped, so the dot
   of whichever item starts a row (on any screen, at any text size) is cut off. A dot never starts a line or wraps on its own.
   (.foot ul.foot-legal: ".foot ul{margin:0}" above would otherwise win and leave the row indented by the clipped strip) */
.foot ul.foot-legal{margin-inline-start:-1.4em;clip-path:inset(-8px -8px -8px 1.4em)}
.foot-legal li:nth-child(n)::before{content:"·";display:inline-block;flex:none;width:1.4em;padding:0;text-align:center;color:var(--muted)}
/* item 13: fine print clears whatever is fixed at the bottom: the listing's enquiry bar (in rem, so it grows with the text size setting, as the
   bar does) and the assistant's button when it is switched on */
body:has(.ba) .foot-base{padding-bottom:calc(var(--s4) + 72px + env(safe-area-inset-bottom))}
/* item 10: the four quick picks under the home search, and the overseas link */
.hero-picks ul{list-style:none;margin:var(--s2) 0 0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s2)}
.hero-picks .chip{min-height:44px;font-weight:600}
.hero-ov{margin:var(--s2) 0 0}.hero-ov a{display:inline-flex;align-items:center;min-height:44px;color:var(--gold-hi);text-decoration:underline;text-underline-offset:3px}
/* BerryBrowserSuitesFix: the picks and the overseas link share one line when they fit, and on a phone the four picks are one tighter row, so the newest home's photo and price (and on a laptop the first-visit card) stay on the first screen (tests/first-screen-browser.cjs) */
.hero-picks{display:inline-block;vertical-align:middle;max-width:100%}.hero-picks+.hero-ov{display:inline-block;vertical-align:middle;margin:var(--s2) 0 0 var(--s3)}
@media (max-width:480px){.hero-picks ul{gap:var(--s1)}.hero-picks .chip{padding:8px 12px;font-size:.95rem}.hero-picks+.hero-ov{margin-left:0}}
.ov-entry-list li a{display:inline-flex;align-items:center;min-height:44px}
/* item 2: "+N without a published price" beside the budget choices, the note above the results, and the toggle */
.bud-np{margin:var(--s2) 0 var(--s1)}
.np-note{margin:var(--s2) 0 var(--s3);padding:var(--s2) var(--s3);border:1px solid var(--line-ui);border-radius:var(--r-sm);background:var(--surface)}
.np-note .chip,.np-toggle .chip{margin-top:var(--s1)}
.np-note a:not(.chip){display:inline-flex;align-items:center;min-height:44px;color:var(--gold-hi)}
/* item 8: the overseas investment pointer on rural and large land (data/oio-note.json) */
.oio-note{margin:var(--s3) 0;padding:var(--s2) var(--s3);border-left:3px solid var(--gold);background:var(--surface);border-radius:var(--r-sm)}
.oio-note a{display:inline-flex;align-items:center;min-height:44px;color:var(--gold-hi);text-decoration:underline;text-underline-offset:3px}
/* item 1: the map card's "Ask for the price guide" */
#panel .price+.row a{display:inline-flex;align-items:center;min-height:44px}

/* ---- gallery */
.gallery{margin-bottom:var(--s3)}
.gallery ul{list-style:none;margin:0;padding:0;display:flex;gap:var(--s2);overflow-x:auto;scroll-snap-type:x mandatory;border-radius:var(--r)}
.gallery li{flex:0 0 100%;scroll-snap-align:center;border-radius:var(--r);border:1px solid var(--line-ui)}
/* BerryListingMosaic (2 Nov 2026, Will): on wider screens the listing opens with one big photo and two stacked beside it; the third says how many more */
@media (min-width:760px){
.wrap > .pic{aspect-ratio:auto;height:clamp(150px,14vw,230px)} /* BerryCorePathTests B2: a listing with no photos yet showed a 3:2 grey block 730 px tall, which pushed the price, open homes and map below the first view; photos get the mosaic's height, the placeholder a short band */
.gallery ul{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);grid-template-rows:1fr 1fr;height:clamp(340px,36vw,620px);overflow:hidden;scroll-snap-type:none}
.gallery li{aspect-ratio:auto;min-height:0}
.gallery li:first-child{grid-row:1/3}
.gallery li:nth-child(n+4){display:none}
.gallery ul:has(> li:only-child){grid-template-columns:1fr}
.gallery ul:has(> li:nth-child(2):last-child) li:nth-child(2){grid-row:1/3}
.gallery li[data-more]::after{content:attr(data-more);position:absolute;inset:0;display:grid;place-items:center;background:rgb(10 10 10/.55);color:#fff;font:700 clamp(1.1rem,1.8vw,1.7rem) var(--serif);letter-spacing:.02em;pointer-events:none}
.gallery .swipe-hint{display:none}
}
/* BerryBuyerFixes (8 Nov 2026, blind buyer review: "the gallery dominates the first desktop screen"): a compact summary beside the lead photo
   on a computer (the photos a little shorter, so the price, facts and next step and the address below are on the first screen), straight
   under the photos on a phone */
.lsum{margin:0 0 var(--s3);padding:var(--s3);border:1px solid var(--line-ui);border-radius:var(--r);background:var(--surface)}
.lsum p{margin:0 0 var(--s1)}
.lsum-price{font:700 var(--t2)/1.2 var(--sans);color:var(--gold-hi)}
/* BerryPublicFixes1: one block, address, price, facts, agents; two gold buttons, the rest small and grouped */
.lsum h1{font-size:var(--t2);margin:0 0 2px}.lsum .lsum-sub{font:italic 600 var(--t0) var(--serif);color:var(--ink)}
.lsum-facts{list-style:none;margin:var(--s1) 0;padding:0;display:flex;flex-wrap:wrap;gap:4px var(--s3)}
.lsum-where .loc{margin-right:4px}
.lsum-agents{list-style:none;margin:var(--s2) 0;padding:0;display:grid;gap:var(--s2)}.lsum-agents li{display:flex;align-items:center;gap:var(--s2)}.lsum-agents .agent-ph{flex:none;border-radius:50%;object-fit:cover;width:56px;height:56px;border:2px solid var(--gold);font-size:1.1rem}.lsa-who small{display:block;color:var(--muted)}.lsa-call{display:flex;align-items:center;min-height:44px;font-weight:600;flex-wrap:wrap;column-gap:6px}
.lsum-go{display:grid;gap:var(--s2);margin:var(--s2) 0!important}.lsum-go .btn{width:100%}
.lsum-more{display:flex;flex-wrap:wrap;gap:var(--s1)}.lsum-more form{margin:0}.lsum-more .btn-ghost{width:auto;min-height:44px;padding:0 14px;font-size:var(--t-1)}
.btn-send{width:100%}
.lsum-oh h2{font-size:var(--t0);margin:var(--s3) 0 0}@media (min-width:1000px){
.lead-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,320px);gap:var(--s3);align-items:start;margin-bottom:var(--s3)}
.lead-row .gallery{margin-bottom:0;min-width:0}
.lead-row .gallery ul{height:clamp(300px,30vw,500px)}
.lead-row .lsum{margin:0}
}
/* The enquiry box sits beside the details as a slim column, not half the page */
@media(min-width:860px){.two.listing{grid-template-columns:minmax(0,1fr) minmax(300px,380px)}.two.listing>aside{position:sticky;top:var(--s4);align-self:start}.two.listing>aside .form{padding:var(--s3)}.two.listing>aside .form h2{font-size:1.25rem;margin:0 0 2px}.two.listing>aside .when legend{font-size:.9rem}.two.listing>aside .chips{gap:6px}.two.listing>aside .chip{min-height:36px;padding:4px 10px;font-size:.85rem}.two.listing>aside .field{font-size:.9rem;margin-top:var(--s2)}.two.listing>aside .field input{min-height:40px;padding-block:6px}.two.listing>aside textarea{min-height:72px;height:72px}.two.listing>aside .btn{margin-top:var(--s2)}}
.desc p{max-width:65ch}

/* ---- skeleton loader (use on any block that fills in later) */
.skel{display:block;min-height:1em;border-radius:6px;background:linear-gradient(90deg,var(--surface) 25%,var(--surface2) 50%,var(--surface) 75%);background-size:200% 100%;animation:skel 1.4s linear infinite}
@keyframes skel{to{background-position:-200% 0}}
html.js .card-pic:has(img:not(.is-loaded)),html.js .gallery li:has(img:not(.is-loaded)){animation:skel 1.4s linear infinite;background-image:linear-gradient(90deg,#161616 25%,#222222 50%,#161616 75%);background-size:200% 100%}

/* ---- workspace (staff only) */
.ws-top{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:6px;margin-bottom:var(--s3)}
.ws-who{margin:0}
.ws-nav{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:flex-start}
.ws-grp{display:flex;flex-wrap:wrap;align-items:center;gap:0 2px;padding:4px 10px 4px 0;border-right:1px solid var(--line,rgba(255,255,255,.14))}
.ws-grp:last-child{border-right:0}
.ws-grp-h{flex-basis:100%;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted,#9a9a9a);padding:0 12px 2px;font-weight:600}
.ws-nav a{padding:10px 12px;min-height:44px;display:inline-flex;align-items:center;text-decoration:none;color:var(--ink);font-weight:500;border-radius:8px}
.ws-nav a:hover{background:var(--surface2)}
.ws-nav a[aria-current]{background:var(--gold);color:var(--on-gold);font-weight:700}
.ws-tiles{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin:12px 0 20px}
.ws-tile{display:flex;flex-direction:column;gap:2px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;text-decoration:none;color:var(--ink);min-height:44px;transition:border-color var(--dur)}
.ws-tile:hover{border-color:var(--gold);color:var(--ink)}
.ws-n{font:700 var(--t3) var(--sans);color:var(--gold-hi)}
.ws-zero .ws-n{font:600 var(--t1) var(--sans);color:var(--muted)}
.ws-actions .ws-irrev{border-color:var(--line-ui)}
.ws-actions form:has(.ws-irrev){margin-inline-start:var(--s4)}.ws-actions form:has(.ws-irrev)~form:has(.ws-irrev){margin-inline-start:0}
.ws-actions .ws-withdraw{border-color:var(--bad);color:var(--bad)}
.ws-sec{margin-top:var(--s2)}
.ws-st{display:inline-block;font-size:var(--t-1);font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:2px 10px;border-radius:999px;border:1px solid var(--line-ui);background:var(--surface2);color:var(--ink);vertical-align:middle}
.ws-st-published,.ws-st-replied{background:var(--ok-bg);border-color:var(--ok);color:var(--ok)}
.ws-st-draft,.ws-st-new{background:var(--warn-bg);border-color:var(--warn);color:var(--warn)}
.ws-st-withdrawn,.ws-st-closed{background:var(--surface2);border-color:var(--line-ui);color:var(--muted)}
.ws-st-sold{background:var(--info-bg);border-color:var(--info);color:var(--info)}
.ws-st-bad{background:var(--bad-bg);border-color:var(--bad);color:var(--bad)}
.ws-list li{padding:10px 0;border-bottom:1px solid var(--line)}
.ws-actions{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}
.ws-actions form{margin:0}
.ws-grid{display:grid;gap:0 16px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.ws-photos{list-style:none;padding:0;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.ws-photos li{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.ws-photos img{display:block;width:100%;height:140px;object-fit:cover}
.ws-pc{padding:8px 10px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ws-pc form{display:flex;gap:6px;flex-wrap:wrap;margin:0}
.ws-pc .btn-ghost.small{padding:0 12px}
.ws-drag{cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;min-height:44px}
.ws-drag[hidden],form[data-photo-queue] button[hidden]{display:none}
.ws-photos li.ws-lift{position:relative;z-index:5;pointer-events:none;opacity:.92;box-shadow:0 10px 30px rgba(0,0,0,.45)}
.ws-pq{margin:10px 0}
.ws-pq[hidden]{display:none}
.ws-pq-bar{display:block;width:100%;height:12px;accent-color:var(--gold)}
.ws-pq-bar[hidden]{display:none}
.ws-pq-fails li{padding:6px 0;border-bottom:1px solid var(--line)}
#ws-photos{scroll-margin-top:90px}
/* BerryReWalkRemaining N6: on a phone, two photos a row and the buttons in a tight block, so 25 photos are not 9,000 px of scrolling */
@media (max-width:600px){.ws-photos{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.ws-photos img{height:96px}.ws-pc{padding:6px;gap:4px}.ws-pc form{display:grid;grid-template-columns:1fr 1fr;gap:4px;width:100%}.ws-pc .btn-ghost.small{padding:0 4px;width:100%}.ws-pc form button[formaction]{grid-column:1/-1}.ws-drag{flex:1}}
.ws-preview-pics{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:6px}.ws-preview-pics img{display:block;width:120px;height:80px;object-fit:cover;border-radius:var(--r-sm)}
#save-listing{scroll-margin:40vh 0} /* BerryReWalkRemaining B17: the answer lands mid-screen, clear of the header and the phone's bottom bar */
.ws-sale-when{border:0;padding:0;margin:0;min-width:0}
.field input[type=date],.field input[type=time]{min-width:0;max-width:100%}
.ws-oh{display:flex;flex-wrap:wrap;gap:0 14px;align-items:end}
.ws-oh .field{flex:1 1 140px}
.ws-agents{border:1px solid var(--line);border-radius:var(--r);padding:10px 14px;margin:0 0 14px}
.ws-agents label{display:inline-block;margin-right:16px;padding:8px 0}
/* BerryAgentPhoneWalk, 4 Nov 2026: disclosures and agent choices need a full finger target. */
@media(max-width:600px){
  .ws summary{min-height:44px;align-content:center}
  .ws-agents label{min-height:44px}
  .ws .inline label input:not([type=hidden]){display:block;width:100%;min-height:44px;font:inherit}
  .ws input[type=file]::file-selector-button{display:block;min-height:44px;margin-bottom:8px;max-width:100%}
}
.ws-portals{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.ws-portal{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.ws-checks li{padding:3px 0}
.ws-ck{display:inline-block;min-width:4.6em;font-size:var(--t-1);font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.ws-ck.ok{color:var(--ok)}.ws-ck.bad{color:var(--bad)}.ws-ck.sug{color:var(--warn)}
.ws-hist li{padding:5px 0;border-bottom:1px solid var(--line)}
.ws-quote{margin:12px 0;padding:12px 16px;background:var(--surface);border-left:4px solid var(--gold);border-radius:6px}
.ws-reply{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:8px 14px;margin:8px 0}
.ws-reply p{margin:4px 0}
.ws-scroll{overflow-x:auto}
/* BerryPhoneLayouts, 4 Nov 2026: a listing keeps all three portal checks together. */
.ws-handoff-cards{display:grid;gap:20px;margin:24px 0}
.ws-handoff-card{border:1px solid var(--line-ui);border-radius:8px;padding:20px;background:var(--surface);min-width:0;overflow-wrap:anywhere}
.ws-handoff-card h2{margin:0;font-size:var(--t2)}
.ws-portal-statuses{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:16px 0}
.ws-portal-status{min-width:0;border-top:1px solid var(--line-ui);padding-top:12px}
.ws-portal-status dt{font-weight:600}
.ws-portal-status dd{margin:6px 0 0}
.ws-portal-status dd p{margin:6px 0}
.ws-owner-now{border-left:4px solid var(--line-ui);padding-left:16px;margin:24px 0}
.ws-owner-detail{border-top:1px solid var(--line-ui);padding:16px 0}
.ws-owner-detail>summary{cursor:pointer;font-weight:600;min-height:44px;align-content:center}
@media(max-width:600px){
  .ws-handoff-card{padding:16px}
  .ws-portal-statuses{grid-template-columns:minmax(0,1fr);gap:12px}
  .ws-portal-status{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
  .ws-portal-status dd{margin:0}
  .ws-owner-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .ws-owner-table,.ws-owner-table tbody,.ws-owner-table tr{display:block}
  .ws-owner-table tr{border:1px solid var(--line-ui);margin:12px 0;padding:12px;overflow-wrap:anywhere}
  .ws-owner-table th[scope=row]{display:block;border:0;padding:4px 0 10px}
  .ws-owner-table td{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;border:0;padding:6px 0}
  .ws-owner-table td:before{content:attr(data-label);font-weight:600}
  .ws-owner-table td>*{min-width:0;max-width:100%}
  .ws-owner-table select{width:100%;min-width:0}
}
.ws-table{border-collapse:collapse;width:100%;background:var(--surface);font-size:var(--t0)}
.ws-table th,.ws-table td{border:1px solid var(--line-ui);padding:8px 10px;text-align:left;vertical-align:top}
.ws-table thead th{background:var(--surface2)}
/* BerryDuplicates (5 Nov 2026): /workspace/duplicates, each group's listings side by side (lib/duplicates.js) */
.dup-group{border-top:1px solid var(--line);padding-top:var(--s2)}
.dup-cards{list-style:none;padding:0;margin:8px 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),400px));gap:12px}
.dup-card{background:var(--surface);border:1px solid var(--line-ui);border-radius:var(--r);padding:12px 14px;min-width:0}
.dup-addr{font-size:1.05rem;margin:0 0 4px;overflow-wrap:anywhere}
.dup-ref{margin:0 0 8px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.dup-facts{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 12px;margin:0;font-size:.95rem}
.dup-facts dt{color:var(--muted)}
.dup-facts dd{margin:0;overflow-wrap:anywhere}
.dup-keep{margin:12px 0 0}
.dup-both{margin:8px 0 0}
.dup-done li{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:8px 0}
.dup-done li p{margin:0;flex:1 1 300px}
.dup-plan li{margin:8px 0}
.ws-err ul{margin:6px 0 0}
.ws-err{background:var(--bad-bg);border-color:var(--bad);color:var(--bad)}

/* wizard, view-as, free-account additions */
.ws-banner{background:var(--warn-bg);border-bottom:3px solid var(--warn);color:var(--warn);padding:10px 16px;display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;justify-content:center;position:sticky;top:0;z-index:40}
.ws-banner p{margin:0}.ws-banner form{margin:0}
.ws-viewas{outline:3px dashed var(--warn);outline-offset:-3px}
.ws-banner button[data-keep]{min-height:44px}
button[disabled],input[disabled],select[disabled],textarea[disabled]{opacity:.55;cursor:not-allowed}
.field-row{display:flex;gap:10px;align-items:flex-end}.field-row .field{flex:1 1 auto}
.vis{flex:0 0 auto;margin:0 0 12px;font-weight:600}.vis select{min-height:48px;padding:0 10px}
.ws-check{background:var(--surface);border:1px solid var(--line);border-left:5px solid var(--warn);border-radius:var(--r);padding:6px 16px 10px;margin:14px 0}
.ws-check h2{margin:8px 0 4px;font-size:var(--t1)}
.ws-steps ol{list-style:none;padding:0;margin:0 0 6px;display:flex;flex-wrap:wrap;gap:6px}
.ws-steps a{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 12px;border:1px solid var(--line-ui);border-radius:999px;background:var(--surface);text-decoration:none;color:var(--ink);font-size:var(--t0)}
.ws-steps a[aria-current]{background:var(--gold);color:var(--on-gold);border-color:var(--gold);font-weight:700}
.ws-step{border-top:1px solid var(--line);margin-top:10px;padding-top:4px}
.ws-stepnav{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}
.ws-docs li{padding:8px 0;border-bottom:1px solid var(--line)}
.ws-docs form.inline{display:inline-block;margin:0 4px}
.ws-archived{margin-top:var(--s3)}
.tag{display:inline-block;font-size:var(--t-1);font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:2px 8px;border-radius:999px;background:var(--warn-bg);border:1px solid var(--warn);color:var(--warn);margin-left:6px;vertical-align:middle}
.features{columns:2;column-gap:28px;padding-left:20px}
@media (max-width:600px){.field-row{flex-direction:column;align-items:stretch}.features{columns:1}.vis select{width:100%}}

/* buyer-needs finder */
.finder .trow,.tap .trow{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;margin:var(--s2) 0}
.tlabel{font-weight:600;min-width:7.5rem;color:var(--muted)}
.chip-x{margin-left:4px;color:inherit;text-decoration:none;font-size:var(--t1);line-height:1;padding:0 6px;min-width:32px;min-height:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%}
.chip-x:hover{background:rgba(0,0,0,.2);color:inherit}
.understood{margin:10px 0;padding:10px 14px;background:var(--bg2);border:1px solid var(--line);border-radius:var(--r)}
.understood p{margin:6px 0}
.editneeds{margin:14px 0;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);padding:6px 14px}
.editneeds summary{cursor:pointer;font-weight:600;min-height:44px;display:flex;align-items:center}
.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:10px 0}
.checks{border:1px solid var(--line);border-radius:var(--r);padding:8px 14px;margin:12px 0}
.checks legend{font-weight:600;padding:0 6px}
.check{display:inline-flex;align-items:center;gap:8px;margin:4px 16px 4px 0;min-height:44px}
.check input{width:22px;height:22px}
.why{list-style:none;margin:6px 0;padding:0;font-size:var(--t-1)}
.why li{display:inline-block;margin:2px 6px 2px 0;padding:2px 10px;border-radius:999px;background:var(--warn-bg);color:var(--warn);border:1px solid var(--warn)}
.why li.short{background:var(--bad-bg);color:var(--bad);border-color:var(--bad)}
.has{color:var(--ok);margin:2px 0}
.nearmiss{margin-top:var(--s5)}
.alertrow{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.steps{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;padding:0;margin:10px 0}
.steps li{color:var(--muted)}
.steps li[aria-current]{color:var(--ink)}
.wiz-nav{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}
.wiz-nav .back{order:1}.wiz-nav .skip{order:2;position:static;background:transparent;color:var(--gold-hi);padding:0 12px;font-weight:400}.wiz-nav .next{order:3}
.needsbox{border:1px solid var(--line);border-radius:var(--r);padding:8px 12px;margin:10px 0}
.needsbox legend{font-weight:600;padding:0 6px}
.ws-needs{margin:14px 0;padding:10px 14px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
.ws-needs ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}

/* ---- Safety and Settings sheets: never modal, the page behind stays usable */
.sheet{display:none;position:fixed;z-index:60;left:calc(var(--side-w) + var(--s3));bottom:var(--s3);width:min(380px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto;background:var(--surface2);border:2px solid var(--line-ui);border-radius:16px;box-shadow:var(--shadow);padding:var(--s3) var(--s4) var(--s4)}
.sheet.open,.sheet:target{display:block}
.sheet-safety{border-color:var(--bad)}
.sheet-head{display:flex;align-items:center;justify-content:space-between}
.sheet-head h2{margin:0;font-size:var(--t2)}
.sheet-x{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;color:var(--ink)}
.sheet-x:hover{background:var(--surface)}
.sheet-lead{font-weight:600;font-size:var(--t1);margin:var(--s2) 0}
.sheet .btn,.sheet .btn-ghost{width:100%}
.sheet p{margin:var(--s2) 0}
.sheet-num{font-weight:400;color:var(--muted)}
.kin-line{border-top:1px solid var(--line-ui);padding-top:var(--s3);margin-top:var(--s3);color:var(--gold-hi);font-weight:600}
.loc-link{width:100%;font:inherit;padding:10px;border-radius:var(--r-sm);border:2px solid var(--line-ui);background:var(--surface);color:var(--ink)}
.set-form fieldset{border:0;padding:0;margin:var(--s3) 0}
.set-form legend{font-weight:600;margin-bottom:var(--s2);padding:0}
/* BerrySupportDoor: the website's problem door sits under its own rule, apart from the settings and from the agency's contact line */
.set-support{border-top:1px solid var(--line-ui);margin-top:var(--s3);padding-top:var(--s2)}
.set-support h3{margin:var(--s2) 0 0;font-size:var(--t1)}
.support-door{text-align:left;line-height:1.25;padding:8px 18px}.support-door .ic{width:20px;height:20px;flex:none;color:var(--gold)}
.set-agency{border-left:3px solid var(--gold);padding-left:var(--s2);color:var(--muted)}.set-agency a{white-space:nowrap}
@media print{.foot-staff .foot-support{display:none}}
.seg{display:flex;gap:var(--s2)}
.seg label{flex:1}
.seg input{position:absolute;opacity:0;width:1px;height:1px}
.seg span{display:flex;align-items:center;justify-content:center;min-height:48px;border:2px solid var(--line-ui);border-radius:var(--r-sm);background:var(--surface);font-weight:600;cursor:pointer;transition:background var(--dur),border-color var(--dur)}
.seg input:checked+span{background:var(--gold);border-color:var(--gold);color:var(--on-gold)}
.seg input:focus-visible+span{outline:3px solid var(--gold-hi);outline-offset:2px}

/* ---- phones: the sidebar becomes a bottom bar with the same items */
@media (max-width:700px){
/* BerryNavSidebar phone: the bar holds the menu button (bottom-left) and 2-3 key actions; the drawer grows UP from it, most used item nearest the thumb */
html,html[data-side]{--side-w:0px}
.side{top:auto;left:0;right:0;width:auto;flex-direction:column-reverse;background:none;border:0;pointer-events:none;transition:none}
.side-bar{position:relative;z-index:2;pointer-events:auto;height:var(--bar-h);padding:var(--s1) var(--s2) calc(var(--s1) + env(safe-area-inset-bottom));gap:var(--s1);background:var(--bg2);border-top:1px solid var(--line-ui)}
.side-toggle{flex:0 0 auto;flex-direction:column;justify-content:center;gap:2px;min-width:76px;height:56px;padding:0 var(--s2);font-size:.78rem;line-height:1.1}
.keys{display:flex;flex:1;min-width:0;gap:var(--s1)}
/* BerryLayoutScan (5 Nov 2026): a.key, not .key: the bar's key rules also styled the area pages' Key facts list (ul.facts.key), whose nowrap source links pushed /regions pages 721 px sideways at 600 px */
a.key{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:56px;padding:0 2px;border-radius:var(--r-sm);color:var(--ink);font-size:.78rem;line-height:1.1;text-decoration:none;white-space:nowrap}
a.key .ic{color:var(--gold)}
a.key:hover{background:var(--surface2);color:var(--ink)}
a.key[aria-current]{background:var(--surface2);color:var(--gold-hi);font-weight:700}
.drawer{display:none;flex:none;position:relative;z-index:2;pointer-events:auto;align-self:flex-start;width:min(320px,86vw);max-height:calc(100dvh - var(--bar-h) - 80px);margin:0 0 var(--s2) var(--s2);padding:var(--s2) var(--s2) var(--s3);background:var(--surface2);border:2px solid var(--line-ui);border-radius:16px;box-shadow:var(--shadow)}
html[data-side="full"] .drawer,html[data-side="icons"] .drawer{display:flex}
html[data-side="icons"] .drawer{width:68px;padding-inline:var(--s1)}
.drawer .logo{order:0}
.side-foot{order:1}
.menu{order:2;flex:none;flex-direction:column-reverse}
.grp{display:contents}
.grp-h{display:none}
.side-foot{border-top:0;border-bottom:1px solid var(--line);padding:0 0 var(--s2);margin-bottom:var(--s1)}
html[data-side="full"] .scrim,html[data-side="icons"] .scrim{display:block;position:fixed;inset:0;z-index:1;pointer-events:auto;background:rgba(0,0,0,.55)}
html[data-side="icons"] .sl,html[data-side="icons"] .drawer .logo{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
html[data-side="icons"] .si{justify-content:center;padding:0}
html[data-side="full"] .logo-top{visibility:hidden}
html[data-hand="right"] .side-bar{flex-direction:row-reverse}
html[data-hand="right"] .drawer{align-self:flex-end;margin:0 var(--s2) var(--s2) 0}
.page{margin-left:0;padding-bottom:calc(var(--bar-h) + var(--s3))}
/* BerryLayoutScan (5 Nov 2026): a field reached by Tab or a tap is scrolled clear of the bottom bar (and of the enquiry bar above it on a
   listing), never under it; warm-calls.css did this for its own page only */
html{scroll-padding-bottom:calc(var(--bar-h) + 12px)}
html:has(body.has-bar){scroll-padding-bottom:calc(var(--bar-h) + 5rem)}
/* BerryOddPolish: the staff page links were ten links in five rows above the content; now one row you swipe sideways */
.ws-nav{flex-wrap:nowrap;overflow-x:auto;width:100%;position:relative;scroll-snap-type:x proximity;scrollbar-width:none}
.ws-nav::-webkit-scrollbar{display:none}
.ws-nav a{flex:none;white-space:nowrap;scroll-snap-align:start}
.ws-top,.ws-who,.ws-nav{display:none}
.ws .plain li{padding:0}.ws .plain li>a:first-child{display:inline-flex;align-items:center;min-height:44px}
.sheet{left:var(--s2);right:var(--s2);width:auto;bottom:calc(var(--bar-h) + var(--s2));max-height:calc(100vh - var(--bar-h) - 24px)}
.btn,.btn-ghost{width:100%}
.hdr-in{padding:var(--s2) var(--s3)}
.hdr-in .btn,.hdr-in .btn-sm{width:auto}
.wrap{padding:0 var(--s3)}
.cta-row .btn,.cta-row .btn-ghost,.search .btn{width:100%}
.cta-row.cta-chips .btn-ghost{width:auto;flex:1 1 40%}
.inline .btn,.inline .btn-ghost{width:auto}
}

/* ---- Learn Berry (staff how-to videos) */
.ln-cta{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:var(--r);padding:12px 16px}
.ln-cta>a{font-weight:700}
.ln-progress{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s4);background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:var(--s3) var(--s4);margin:var(--s3) 0}
.ln-progress p{margin:0}
.ln-bar{flex:1 1 160px;height:12px;border-radius:999px;background:var(--surface2);border:1px solid var(--line-ui);overflow:hidden;-webkit-appearance:none;appearance:none;accent-color:var(--gold)}
.ln-bar::-webkit-progress-bar{background:var(--surface2)}.ln-bar::-webkit-progress-value{background:var(--gold)}.ln-bar::-moz-progress-bar{background:var(--gold)}
.ln-news{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:var(--s3) var(--s4);margin:var(--s4) 0}
.ln-news h2{margin-top:0}.ln-news li{margin:0 0 12px}
.ln-group{margin:var(--s5) 0}
.ln-list{list-style:none;padding:0;display:grid;gap:var(--s3);grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
main .ln-list li{max-width:none}
.ln-list a{display:flex;flex-direction:column;gap:6px;height:100%;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);padding-bottom:var(--s3);transition:border-color var(--dur)}
.ln-list a:hover{border-color:var(--gold);color:var(--ink)}
.ln-list img,.ln-noimg{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-bottom:1px solid var(--line);background:var(--surface2)}
.ln-noimg{display:grid;place-items:center;color:var(--muted)}
.ln-list .ln-t,.ln-list .small{padding:0 var(--s3)}
.ln-t{display:flex;gap:8px;align-items:flex-start}
.ln-tick{flex:0 0 24px;width:24px;height:24px;border-radius:50%;border:2px solid var(--line-ui);display:grid;place-items:center;font-weight:700;font-size:14px}
.ln-tick.on{background:var(--gold);border-color:var(--gold);color:var(--on-gold)}
.ln-role{display:inline-block;font-weight:700;font-size:var(--t-1);padding:3px 10px;border-radius:999px;border:1px solid var(--gold);color:var(--gold-hi)}
.ln-lesson{display:grid;gap:var(--s4);grid-template-columns:minmax(0,3fr) minmax(260px,2fr);align-items:start}
.ln-video{margin:0}.ln-video video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#000;border-radius:var(--r);border:1px solid var(--line-ui)}
.ln-video figcaption{margin-top:6px}
.ln-steps{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:var(--s3) var(--s4)}
.ln-steps h2{margin-top:0}.ln-steps ol{padding-left:1.3em}.ln-steps li{margin-bottom:8px}
.ln-actions{margin:var(--s3) 0 var(--s2)}
.ln-transcript{margin:var(--s4) 0}.ln-transcript li{margin-bottom:6px}
.ln-pn{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s2);margin:var(--s5) 0}
@media (max-width:900px){.ln-lesson{grid-template-columns:1fr}}

/* ---- check and approve, cutover board (lib/prefill.js). A mark is always a glyph plus words, never colour alone. */
.pf-mark{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:var(--t-1);padding:2px 10px;border-radius:999px;border:1px solid var(--line-ui);white-space:nowrap}
.pf-ok{color:var(--ok);background:var(--ok-bg);border-color:var(--ok)}.pf-info{color:var(--info);background:var(--info-bg);border-color:var(--info)}
.pf-warn{color:var(--warn);background:var(--warn-bg);border-color:var(--warn)}.pf-bad{color:var(--bad);background:var(--bad-bg);border-color:var(--bad)}
.pf-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pf-legend{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.pf-bit{display:inline-flex;gap:4px;font-weight:700;font-size:var(--t-1);margin-right:10px}.pf-bits{margin:6px 0}
.pf-list{display:grid;gap:10px}.pf-item{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:center;border:1px solid var(--line-ui);border-radius:var(--r);background:var(--surface);padding:12px 16px}
.pf-item-main{flex:1 1 280px}.pf-item-act{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.pf-one{margin:0}
.pf-need{border:1px solid var(--gold);border-radius:var(--r);padding:4px 16px 12px;background:var(--surface)}
.pf-card{border:1px solid var(--gold);border-radius:var(--r);padding:4px 16px 12px;background:var(--surface)}
.pf-row{border-top:1px solid var(--line);padding:14px 0}.pf-row input,.pf-row textarea,.pf-row select{width:100%;max-width:640px}
.pf-head{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:6px}.pf-label{font-weight:700}
.pf-opts{border:1px solid var(--line-ui);border-radius:var(--r-sm);margin:8px 0;padding:8px 12px}.pf-opt{display:flex;gap:8px;align-items:flex-start;min-height:44px;padding:4px 0}.pf-opt input{width:auto;margin-top:6px}
.pf-check{display:flex;gap:8px;align-items:center;min-height:44px}.pf-check input{width:auto}
.pf-thumb,.pf-face{border-radius:var(--r-sm);object-fit:cover;display:block;margin:6px 0}
.pf-ro{margin:4px 0}.pf-src summary{cursor:pointer;min-height:44px;display:flex;align-items:center}.pf-srctable{margin:6px 0}
.pf-save{position:sticky;bottom:0;background:var(--bg);border-top:1px solid var(--line-ui);padding:12px 0;display:flex;gap:10px;flex-wrap:wrap}
.pf-ready{border:2px solid var(--ok);background:var(--ok-bg);color:var(--ok);border-radius:var(--r);padding:4px 16px 12px}
.pf-notready{border:2px solid var(--warn);background:var(--warn-bg);color:var(--warn);border-radius:var(--r);padding:4px 16px 12px}
.pf-board th[scope=row]{min-width:220px}.pf-cap{text-align:left;font-weight:700;padding:6px 0}.pf-tick{display:flex;gap:8px;align-items:end;flex-wrap:wrap}.pf-tick input{min-width:180px}
.pf-inline{display:inline}
@media (max-width:640px){.pf-item-act .btn,.pf-item-act .btn-ghost{width:100%;text-align:center}}

/* ---- motion: respect the system setting and the in-page switch */
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
html[data-motion="reduce"] *,html[data-motion="reduce"] *::before,html[data-motion="reduce"] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
@media print{.side,.sheet,.hdr{display:none}.page{margin:0}body{background:#fff;color:#000}}
/* Proof log print sheet: its own light stylesheet, public/proof-print.css, inlined by the print page. */
/* ---- place guides (/areas/<place>): facts with sources, at-a-glance panel, 3D view + tour */
.place h1 small{font-size:var(--t0);font-weight:400}
.place-toc{display:flex;flex-wrap:wrap;gap:var(--s2);margin:var(--s3) 0}
.place-toc a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid var(--line-ui);border-radius:999px;color:var(--ink);text-decoration:none;background:var(--surface)}
.place-toc a:hover{border-color:var(--gold)}
.place h2{scroll-margin-top:80px}
.ig,.v3d,.pg-sec{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:var(--s4);margin:var(--s4) 0;min-width:0}
.ig h2,.v3d h2,.pg-sec h2{margin-top:0}
.ig-tiles{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--s3)}
.ig-tiles li{background:var(--surface2);border-radius:var(--r-sm);padding:var(--s3);display:flex;flex-direction:column;gap:2px;min-width:0}
.ig-tiles strong{font:700 var(--t2) var(--serif);color:var(--gold-hi);overflow-wrap:anywhere}
.ig-tiles span{color:var(--ink)}
.ig-tiles small{color:var(--muted)}
.ig-haz h3{font-size:var(--t1);margin:var(--s4) 0 var(--s2)}
.ig-haz ul{list-style:none;padding:0;margin:0;display:grid;gap:var(--s2)}
.ig-haz li{display:flex;gap:var(--s2);align-items:flex-start}
.hz-i{flex:0 0 24px;height:24px;border-radius:50%;background:var(--bad-bg);color:var(--bad);font-weight:800;display:inline-flex;align-items:center;justify-content:center}
.ig-charts{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--s4);margin-top:var(--s4)}
.ig-charts figure{margin:0;min-width:0}
.ig-charts figcaption{color:var(--ink);font-weight:600;margin-bottom:var(--s2)}
.ig-charts svg{width:100%;height:auto;display:block}
.ig-charts .mk-temp{fill:var(--gold)}
.ig-charts .mk-rain{fill:var(--info)}
.ig-charts .mk-temp:hover,.ig-charts .mk-rain:hover{fill:var(--gold-hi)}
.ig-charts .gl{stroke:var(--line);stroke-width:1}
.ig-charts .ax{fill:var(--muted);font:12px var(--sans)}
.ig-charts details,.ig-charts .src{grid-column:1/-1}
.ig-charts summary{min-height:44px;display:flex;align-items:center;cursor:pointer;color:var(--gold-hi)}
table.mini{border-collapse:collapse;width:100%;max-width:420px}
table.mini th,table.mini td{text-align:left;padding:4px 8px;border-bottom:1px solid var(--line)}
.terrain{width:100%;display:block;border-radius:var(--r-sm);background:var(--bg2);touch-action:pan-y;cursor:grab}
.v3d-ctl{display:flex;flex-wrap:wrap;gap:var(--s2);margin:var(--s3) 0}
.v3d-ctl .btn-sm{background:var(--surface2);color:var(--ink);border:1px solid var(--line-ui);font-weight:600}
.v3d-ctl .btn-sm:hover{border-color:var(--gold);color:var(--ink);background:var(--surface2)}
.tour-cap{min-height:3em;font-size:var(--t1);color:var(--ink)}
.tour-list{padding-left:1.4em;display:grid;gap:var(--s2)}
.tour-list li.on{color:var(--gold-hi)}
ul.facts{padding-left:1.2em;margin:0;display:grid;gap:var(--s3)}
ul.facts li{line-height:1.5}
.place .src{display:block;font-size:var(--t-1);color:var(--muted)}
.place .src a{color:var(--gold-hi)}
.badge-unsure{display:inline-block;font-size:var(--t-1);padding:1px 8px;border-radius:999px;background:var(--warn-bg);color:var(--warn)}

/* ---- BerryConversion (28 Oct 2026): call buttons, the listing's enquiry bar, viewing chips, the appraisal card, the filter sheet's button,
   open-home badges, sold cards, the photo viewer, and the 44 px tap pass. Colours are the existing tokens only. */
.btn-call{background:var(--gold);border-color:var(--gold);color:var(--on-gold)}.btn-call:hover{background:var(--gold-hi);border-color:var(--gold-hi);color:var(--on-gold)}
.call-n{font-weight:400;white-space:nowrap}.btn-call,.lsum-call{flex-wrap:wrap;column-gap:6px;row-gap:0;padding-block:6px;text-align:center}
.agent-call,.agent-acts{display:flex;flex-wrap:wrap;gap:var(--s2);margin:var(--s3) 0 var(--s1)}
.enq-bar{display:none}
@media (max-width:859px){
.enq-bar{position:fixed;left:0;right:0;bottom:0;z-index:55;display:grid;grid-template-columns:auto 1fr 1fr;gap:var(--s2);padding:var(--s2) var(--s2) calc(var(--s2) + env(safe-area-inset-bottom));background:var(--bg2);border-top:1px solid var(--line-ui)}
.enq-bar a{display:flex;align-items:center;justify-content:center;min-height:48px;padding:0 14px;border-radius:999px;font-weight:700;text-decoration:none;text-align:center;line-height:1.15}
.eb-call,.eb-ask,.eb-view{background:var(--green);color:var(--on-green);border:2px solid var(--gold)}.eb-call:hover,.eb-ask:hover,.eb-view:hover{background:var(--green-hi);color:var(--on-green)}
.form-in-view .enq-bar,.price-in-view .enq-bar{visibility:hidden}
.has-bar .foot{padding-bottom:calc(6rem + env(safe-area-inset-bottom))} /* BerryBlindSiteFixes: was 88px; rem grows with the text size, as the bar does */
}
@media (max-width:700px){.enq-bar{bottom:calc(var(--bar-h) + env(safe-area-inset-bottom));padding-bottom:var(--s2)}}
@media (max-width:700px){.has-bar .hdr{position:static}}
/* BerryListingCompleteness (31 Oct 2026), buyer critique issue 8: on a phone a long price ("Enquiries Over $1,400,000 Plus GST (if any)") or a
   long address ran under the menu bar on the first screen. A listing's phone page starts closer to the top, and "See all N photos full screen"
   sits on the photo's corner instead of a row of its own, so the price is on the first screen of all 32 homes at 390 x 844. */
@media (max-width:700px){
.has-bar main>.block:first-child{padding-top:var(--s2)}
.has-bar .crumbs{margin-bottom:var(--s1)}
.has-bar .gallery{position:relative;container-type:inline-size}
.has-bar .gallery .pv-open{position:absolute;right:var(--s2);top:calc(100cqw / 1.5 - 44px - var(--s2));margin:0;min-height:44px;width:auto;max-width:calc(100% - 2 * var(--s2));padding-inline:14px;background:rgba(20,20,20,.86);color:#f5f5f5;border-color:rgba(244,239,228,.55)}
}
fieldset.when{border:0;padding:0;margin:0 0 12px}
fieldset.when legend{font-weight:600;padding:0;margin-bottom:6px}
.chip.chk{cursor:pointer;min-height:44px}
.chip.chk input{accent-color:var(--gold);width:20px;height:20px;margin:0}
.chip.chk:has(input:checked){border-color:var(--gold);background:var(--surface2)}
.chip.chk:focus-within{outline:3px solid var(--gold-hi);outline-offset:2px}
.quick-apr{border-color:var(--gold)}
.quick-apr h2{margin-top:0}
.apr-strip{margin-top:var(--s5)}
@media(min-width:860px){.quick-apr{display:grid;grid-template-columns:1fr 1fr auto;gap:0 var(--s3);align-items:end}.quick-apr h2,.quick-apr>p{grid-column:1/-1}.quick-apr .btn{margin-bottom:12px}}
.apr-fl{margin:0}.apr-fl>div{padding:10px 0;border-bottom:1px solid var(--line)}.apr-fl dt{font-weight:700}.apr-fl dd{margin:2px 0 0}
.apr-entry-form{border-color:var(--gold)}.apr-entry-form h2{margin-top:0}
@media(min-width:860px){.apr-entry-form{display:grid;grid-template-columns:1fr auto;gap:0 var(--s3);align-items:end}.apr-entry-form h2,.apr-entry-form>p{grid-column:1/-1}.apr-entry-form .btn{margin-bottom:12px}}
.sheet-go{position:sticky;bottom:var(--s2);z-index:5;display:flex;justify-content:center;margin-top:var(--s3)}
.sheet-go .btn{box-shadow:var(--shadow);min-width:14rem}
@media (max-width:700px){.sheet-go{bottom:calc(var(--bar-h) + var(--s2))}}
.oh-badge{align-self:flex-start;margin:0;font-size:var(--t-1);font-weight:700;padding:2px 10px;border-radius:999px;background:var(--ok-bg);color:var(--ok);border:1px solid var(--ok)}
.si{position:relative}
.nb{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;margin-left:auto;border-radius:999px;background:var(--gold);color:var(--on-gold);font-size:.75rem;font-weight:700}
.oh-list li{padding:6px 0}
.town-facts{display:flex;flex-wrap:wrap;gap:var(--s2);margin:var(--s3) 0}
.town-facts a{display:inline-flex;gap:6px;align-items:center;min-height:44px;padding:0 14px;border:1px solid var(--line-ui);border-radius:999px;background:var(--surface);color:var(--ink);text-decoration:none}
.agent-head{display:flex;gap:var(--s3);align-items:center}.agent-head h1{margin:0}.agent-pic{border-radius:50%;object-fit:cover}
.agent-row li{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3);padding:6px 0}
.sold-facts{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);margin:var(--s1) 0}.sold-facts dt{font-size:var(--t-1);color:var(--muted)}.sold-facts dd{margin:0;font-weight:700}
.next-steps{display:block;list-style:decimal;padding-left:1.4em}.next-steps li{color:var(--ink);margin:var(--s2) 0}
.email-me{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:flex-end;flex:1 1 320px}.email-me .field{flex:1 1 220px;margin:0}.email-me p{flex-basis:100%;margin:0}
.js .gallery li{cursor:zoom-in}
.pv-open{margin-top:var(--s2)}
/* 44 px pass: crumbs, footer links and chip crosses were 32 px tall */
.crumbs li{min-height:44px}.crumbs a{display:inline-flex;align-items:center;min-height:44px}
.chip-x{min-width:44px;min-height:44px;margin:-10px -12px -10px 0}
.logo-top{min-height:44px}.crumbs a{min-width:44px;justify-content:center}
.ws-h2{font-size:var(--t1);margin:var(--s3) 0 var(--s2)}
.where a,.facts dd a,.listing ul.plain a,.card .small a,.card .agent a,.card h3 a,.link-save{display:inline-flex;align-items:center;min-height:44px}
/* ---- BerryCollapsibleQoL (29 Oct 2026, Will on his phone) ---- */
/* (1) one spacing token: every page's first block gets the same room below the header */
:root{--page-top:var(--s5)}
main>.block:first-child,main>.wrap:first-child,main>div:first-child>.block:first-child{padding-top:var(--page-top)}
main>.block:first-child>h1:first-child,main>.wrap:first-child>h1:first-child{margin-top:0}
/* (3) header Safety: on a phone Safety sits in the header, one tap away on every page; the side menu keeps it on bigger screens */
.hdr-safety{display:inline-flex;margin-left:var(--s2);align-items:center;gap:6px;min-height:44px;min-width:44px;padding:0 var(--s3);border-radius:999px;border:1px solid var(--bad);background:var(--bad-bg);color:var(--bad);font-weight:700;text-decoration:none}
.hdr-safety .ic{color:var(--bad);width:20px;height:20px;flex:0 0 20px}
.hdr-safety:hover{color:var(--bad);background:var(--bad-bg)}
@media (max-width:700px){
.hdr-in{gap:var(--s2)}
.hdr-in .btn-sm{padding:0 var(--s3)}
}
/* (5) folds: long, secondary blocks start closed with a summary line; key facts never fold */
.fold{margin:var(--s3) 0;border:1px solid var(--line);border-radius:var(--r);background:var(--bg2)}
.fold>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:var(--s3);min-height:56px;padding:var(--s2) var(--s3)}
.fold>summary::-webkit-details-marker{display:none}
.fold>summary::after{content:"";flex:0 0 10px;height:10px;margin-left:auto;border-right:2px solid var(--gold);border-bottom:2px solid var(--gold);transform:rotate(45deg) translate(-2px,-2px);transition:transform var(--dur)}
.fold[open]>summary::after{transform:rotate(-135deg) translate(-2px,-2px)}
.fold>summary:hover{background:var(--surface)}
.fold-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.fold-h{font-family:var(--serif);font-size:var(--t1);color:var(--ink);line-height:1.25;margin:0}
.fold-s{font-size:var(--t-1);color:var(--muted);overflow-wrap:anywhere}
.fold-b{padding:0 var(--s3) var(--s3)}
.fold-b>h2:first-child,.fold-b>h3:first-child{margin-top:var(--s2)}
.fold-all{display:flex;justify-content:flex-end;margin:var(--s3) 0}
.hdr-in .btn-sm,.hdr-safety{white-space:nowrap}
@media (max-width:420px){.hdr-in .logo-top small{display:none}}
.fold-all button{min-height:44px}
/* (2) Buy chooser: one question at a time, 2-4 starter buttons, a summary you can change */
.steps-q{display:flex;flex-direction:column;gap:var(--s3);margin:var(--s4) 0}
.stepq{border:1px solid var(--line);border-radius:var(--r);background:var(--bg2)}
.stepq>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:var(--s3);min-height:56px;padding:var(--s2) var(--s3)}
.stepq>summary::-webkit-details-marker{display:none}
.stepq .sq-n{flex:0 0 28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:var(--surface2);color:var(--gold-hi);font-weight:700;font-size:var(--t-1)}
.stepq.done .sq-n{background:var(--gold);color:var(--on-gold)}
.stepq .sq-q{font-weight:600}
.stepq .sq-a{color:var(--muted);margin-left:auto;text-align:right;font-size:var(--t-1)}
.stepq.done .sq-a{color:var(--gold-hi)}
.stepq .sq-a .sq-ch{text-decoration:underline;text-underline-offset:3px;margin-left:6px}
.stepq[open]>summary{border-bottom:1px solid var(--line)}
.stepq .sq-b{padding:var(--s3)}
.stepq .sq-b .chips{gap:var(--s2)}
.stepq .sq-b .chip{flex:1 1 calc(50% - var(--s2));justify-content:center}
.stepq .sq-more{margin-top:var(--s2)}
.picked{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s2);align-items:center;margin:var(--s2) 0}
.results-h{margin-top:var(--s5)}
@media print{
.fold>.fold-b,.stepq>.sq-b{display:block!important}
details.fold::details-content{content-visibility:visible;display:block}
.fold-all,.hdr-safety,.si-more,.sheet-more{display:none}
}

/* ---- BerryNavSidebar: see DECISIONS.md */
.wrap{max-width:min(1480px,100%);padding-inline:clamp(var(--s3),3vw,var(--s5))}
.block{padding-block:clamp(var(--s3),3vw,var(--s4))}
h1{font-size:clamp(var(--t3),1.1rem + 2.6vw,var(--t5))}
h2{font-size:clamp(var(--t1),1rem + 1vw,var(--t2))}
.grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr))}
.two,.band .two{grid-template-columns:repeat(auto-fit,minmax(min(100%,30rem),1fr))}
.chips>*,.cta-row>*,.agent-acts>*,.v3d-ctl>*{flex:0 1 auto}
.chip,.btn,.btn-ghost,.btn-sm,.eb-call,.eb-ask,.eb-view{white-space:nowrap}
.stepq .sq-b .chip{flex:0 1 auto;justify-content:center}
.form,.filters,.stepq .sq-b{container-type:inline-size}
@container (max-width:520px){.field-row{flex-direction:column;align-items:stretch}.features{columns:1}.vis select{width:100%}}
.form p,.form label{max-width:none}
@media (max-width:700px){
.si{min-height:44px}
.drawer{gap:var(--s1)}
}
/* button groups size their text from the room the group has (container units), so a long label ("Call the office, ask for Chantelle") never wraps or spills */
.agent-call,.agent-acts,.cta-row,.enq-bar{container-type:inline-size}
.agent-call .btn,.agent-call .btn-ghost,.agent-acts .btn,.agent-acts .btn-ghost,.cta-row .btn,.cta-row .btn-ghost{font-size:clamp(.78rem,5cqi,1rem);padding-inline:clamp(10px,4cqi,22px)}
.enq-bar a{font-size:clamp(.78rem,3.7cqi,1rem);padding-inline:clamp(8px,3cqi,14px)}
main button:not([class]){min-height:44px;padding-inline:var(--s3)}
main textarea,main pre{max-width:100%}main pre{overflow-x:auto}
.agent-row li{container-type:inline-size}.agent-row .btn-ghost{font-size:clamp(.78rem,5cqi,1rem);padding-inline:clamp(10px,4cqi,22px)}
/* the full sidebar already lists every Workspace page with its label, so the page-top link row steps aside (it stays on a phone and beside a rail or a hidden sidebar) */
@media (min-width:701px){html[data-side="full"] .ws-nav{display:none}}

/* ---- BerryNavPolish (29 Oct): see DECISIONS.md */
.drawer{padding:var(--s1) 12px var(--s3);scrollbar-width:thin;scrollbar-color:var(--line-ui) transparent;scrollbar-gutter:stable}
.side-bar{padding:var(--s2) 12px}
.drawer .si{padding-inline:12px;gap:12px}
.si:focus-visible,.side-toggle:focus-visible,.key:focus-visible{outline:3px solid var(--gold-hi);outline-offset:-3px}
.side-foot{margin-top:auto}
@media (min-width:701px){
html[data-side="icons"] .drawer{padding-inline:6px}
html[data-side="icons"] .side-bar{padding-inline:var(--s2)}
html[data-side="icons"] .drawer .si{padding-inline:0}
.drawer .si{min-height:44px}.menu{gap:12px}
/* the account lives in the sidebar's options foot; the header copy is only for when the sidebar is hidden */
html:not([data-side="hidden"]) .hdr-acct{display:none}
}
@media (max-width:700px){
/* the drawer fits a phone without scrolling: Safety is already one tap away in the header and Saved is a key beside the menu button */
.drawer{padding:var(--s3) 12px;max-height:calc(100dvh - var(--bar-h) - 64px)}
.side-foot .si-safety,.menu .si[href="/account#saved"]{display:none}
.menu{gap:var(--s1)}/* BerryBrowserSuitesFix: Guides and the account links made the open phone drawer 45 px too tall (tests/nav-polish-browser.cjs); tighter rows, still 44 px targets */
html[data-side="icons"] .drawer{padding-inline:var(--s2)}
}
/* agent profiles and the About page: photo, role, the agency's own words */
.team-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
/* photo and name share the top row; the text and buttons below get the card's full width, so no button is cut by the card edge */
.agent-top{display:flex;gap:var(--s3);align-items:center}.agent-top h2,.agent-top h3,.agent-top p{margin:0}.agent-top h2{font-size:var(--t1)}.agent-top p{margin-top:var(--s1)}
/* BerryLayoutScan (5 Nov 2026): a name too long to sit beside the photo goes under it ("John Bridgewate[r]" was cut off at 320 px) */
.agent-top{flex-wrap:wrap}
.agent-card .card-body>p{margin:var(--s2) 0 0}.agent-card .agent-acts{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s3)}
.agent-card .agent-acts>*{max-width:100%;white-space:normal}
.agent-card-pic img{display:block;width:128px;height:128px;border-radius:50%;object-fit:cover;border:3px solid var(--gold)}
.agent-pic{border:2px solid var(--gold)}
.agent-bio p{max-width:68ch}
.bio-more summary{min-height:44px;display:flex;align-items:center;color:var(--gold-hi);font-weight:600;cursor:pointer}
.about-lead{display:flex;gap:var(--s4);align-items:flex-start;margin-block:var(--s5)}
.about-lead .agent-pic{flex:0 0 auto}
.sold-list{padding-left:var(--s4)}.sold-list li{min-height:44px;display:flex;align-items:center}
.ic-inline{width:1.1em;height:1.1em;vertical-align:-.18em}
@media (max-width:520px){.about-lead{flex-direction:column}}
/* BerryMediaMap: sideways strips can be dragged with a mouse (public/app.js) */
@media (pointer:fine){.gallery ul,[data-dragscroll]{cursor:grab}.gallery ul.dragging,[data-dragscroll].dragging{cursor:grabbing;user-select:none}.gallery ul.dragging img{pointer-events:none}}
/* BerryMediaMap: agent photo, or initials in gold when there is none (same box either way) */
.avatar-i{display:inline-grid;place-items:center;flex:0 0 auto;border-radius:50%;background:var(--surface2);color:var(--gold-hi);border:2px solid var(--gold);font:600 1rem var(--serif);letter-spacing:.04em}
.agent-card-pic .avatar-i.av120{width:128px;height:128px;font-size:2.4rem}.avatar-i.av120{width:120px;height:120px;font-size:2.2rem}.avatar-i.av44{width:96px;height:96px;font-size:1.8rem}.avatar-i.av28{width:52px;height:52px;font-size:1rem;border-width:2px}
.agent-mini{display:inline-flex;align-items:center;gap:8px;vertical-align:middle}.agent-mini img{border-radius:50%;object-fit:cover;width:52px;height:52px;border:2px solid var(--gold)}
.tour-list a{display:inline-flex;align-items:center;min-height:44px}

/* BerryAreaContent: area photo with its credit, key facts, region list, guides */
.area-photo{margin:0 0 var(--s3)}
.area-photo img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r);background:var(--surface2)}
.area-photo figcaption{margin-top:6px;font-size:var(--t-1);color:var(--muted)}
.area-photo figcaption a{color:var(--muted);text-decoration:underline}
.key-facts{margin:var(--s3) 0}
.key-facts small{color:var(--muted);font-size:var(--t-1)}.key-facts small a{color:var(--muted);text-decoration:underline}
.area-actions{display:flex;flex-wrap:wrap;gap:var(--s2);margin:var(--s3) 0}
ul.facts.key{list-style:none;padding:0;display:grid;gap:var(--s2);margin:var(--s3) 0}
.reg-list>li{padding:var(--s3) 0;border-top:1px solid var(--line)}.reg-list .reg-name{font-size:var(--t1)}
.reg-list .chips{margin-top:var(--s2)}.chips.plain li{padding:0}
.guide-list>li{padding:var(--s3) 0;border-top:1px solid var(--line)}
.guide-points{padding-left:1.2em}.guide-points li{margin:var(--s2) 0}
.callout{background:var(--surface2);border-left:4px solid var(--gold);border-radius:var(--r-sm);padding:var(--s3)}
.agency-view{border-left:4px solid var(--line-ui);padding-left:var(--s3)}
@media (min-width:700px){.area-photo img{aspect-ratio:21/9}}
/* BerryListingConversations: the listing guide, one question per screen, phone first (48 px+ targets, one column) */
.lc-q{max-width:40rem}
.lc-q h1{font-size:var(--t2,1.5rem);margin:var(--s3) 0 var(--s2)}
.lc-q h1:focus{outline:none}
.lc-help{color:var(--muted);margin:0 0 var(--s3)}
.lc-need{color:var(--gold-hi)}
.lc-prog{margin:0 0 var(--s2)}
.lc-prog-t{margin:0 0 4px;font-size:var(--t-1);color:var(--muted)}
.lc-prog progress,.lc-draft progress{display:block;width:100%;height:10px;accent-color:var(--gold)}
.lc-opts{display:grid;gap:var(--s2);margin:0 0 var(--s3)}
.lc-opt{display:flex;align-items:center;gap:var(--s3);min-height:56px;padding:12px var(--s3);border:2px solid var(--line-ui);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);font:500 var(--t0) var(--sans);text-align:left;cursor:pointer;width:100%}
.lc-opt .small{display:block;font-weight:400}
.lc-opt input{width:24px;height:24px;flex:0 0 24px;accent-color:var(--gold)}
.lc-opt:hover,.lc-opt:focus-within,.lc-tap:focus-visible{border-color:var(--gold-hi);background:var(--surface2)}
.lc-tap.on{border-color:var(--gold);background:var(--surface2)}
.lc-tap.on::after{content:"\2713";margin-left:auto;color:var(--gold-hi)}
.lc-opt-r{min-height:48px}
.lc-fs{border:0;padding:0;margin:0 0 var(--s3)}
.lc-fs legend{font-weight:600;margin-bottom:var(--s2)}
.lc-form{margin:0 0 var(--s3)}
.lc-go{width:100%}
.lc-other{border-top:1px solid var(--line);padding-top:var(--s3)}
.lc-two{display:grid;gap:var(--s2)}
.lc-nav{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;margin:var(--s3) 0}
.lc-nav form{margin:0}
.lc-thumbs{display:flex;flex-wrap:wrap;gap:var(--s2);list-style:none;padding:0}
.lc-thumbs img{border-radius:6px;object-fit:cover}
.lc-drafts>li{padding:var(--s3) 0;border-top:1px solid var(--line)}
.lc-draft-a{display:grid;gap:4px;padding:var(--s2);margin:0 calc(-1 * var(--s2));border-radius:var(--r-sm);color:var(--ink);text-decoration:none;min-height:48px}
.lc-draft-a:hover,.lc-draft-a:focus-visible{background:var(--surface2)}
.lc-draft-p{color:var(--gold-hi);font-weight:600}
.lc-answers>li{display:flex;flex-wrap:wrap;gap:4px var(--s2);align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.lc-a-q{font-weight:600}
.lc-a-v{color:var(--muted);flex-basis:100%}
.lc-ch{margin-left:auto;min-height:44px;display:inline-flex;align-items:center}
@media (min-width:700px){.lc-go{width:auto}.lc-two{grid-template-columns:1fr 1fr}.lc-opts{grid-template-columns:1fr 1fr}}
.ws-ck.lc-w{color:var(--info)}
.more-homes{margin-top:var(--s3)}.more-homes>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--gold-hi);font-weight:600}.more-homes[open]>summary{margin-bottom:var(--s3)}
/* ---- BerryPropertyTypeSchema (29 Oct 2026): each option says how many homes it finds ("Land (4)"); an empty one is greyed, not hidden;
   on a phone the filters sit in a sheet opened by the Filters button. */
.chip[data-n]::after{content:" (" attr(data-n) ")";font-weight:400}
.chip.chip-none{white-space:nowrap;color:var(--muted);background:transparent;border-style:dashed;cursor:default}
.check.chip-none{color:var(--muted)}
.fsheet-open,.fsheet-head{display:none}
.last-type{margin:var(--s2) 0}
/* BerryCorePathTests B1: after a search, a computer also shows the matches first; Filters opens the questions in place */
@media (min-width:701px){.fsheet-open[data-fold-desk]{display:inline-flex;margin:var(--s2) 0}.fsheet[data-fold-desk]{display:none}.fsheet[data-fold-desk]:target{display:block}.fsheet[data-fold-desk]:target .fsheet-head{display:flex;justify-content:space-between;align-items:center}}
.fsheet-what{font-weight:400;margin-left:2px}.around{margin-top:var(--s3)}
/* BerryCorePathTests: a fieldset keeps min-width:min-content, so the row of viewing times made the phone listing page 441 px wide on a 390 px screen */
fieldset.when{min-width:0}.when .chip{white-space:normal;max-width:100%}
@media (max-width:700px){
.fsheet-open{display:flex;width:100%;justify-content:center;min-height:48px;margin:var(--s3) 0}
/* BerrySearchWords (critique issue 20): a long "Filters · 4 chosen: House, Wānaka, ..." was centred wider than the button and cut off at both ends */
.fsheet-open:has(.fsheet-what){display:block;text-align:center;white-space:normal;line-height:1.35;padding:10px 22px;border-radius:24px}
.fsheet{display:none}
.fsheet:target{display:block;position:fixed;z-index:70;left:0;right:0;bottom:0;max-height:88vh;overflow:auto;background:var(--bg);border-top:2px solid var(--line-ui);border-radius:16px 16px 0 0;box-shadow:var(--shadow);padding:var(--s3) var(--s3) calc(var(--bar-h) + var(--s3))}
.fsheet:target .fsheet-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);position:sticky;top:calc(-1 * var(--s3));z-index:6;background:var(--bg);margin:0 0 var(--s2);padding:var(--s2) 0}
.fsheet-head .fsheet-x{width:auto;flex:0 0 auto}
}
/* BerryPublicHarvest: ports from Will's first Berry site, drawn in the trunk's look (dark, gold, outline icons, nothing clipped) */
.eyebrow{font-size:var(--t-1);letter-spacing:.24em;text-transform:uppercase;color:var(--gold);font-weight:600;margin:0 0 var(--s2)}
/* weather on a listing (old WeatherPopover.astro): now, a 7-day row with today marked, sunrise/sunset, the credit */
.wx-now{display:flex;gap:var(--s2);align-items:center;margin:var(--s2) 0 var(--s3)}
.wx-ic{flex:none;color:var(--gold)}
.wx-week{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:var(--s1)}
.wx-week li{display:flex;flex-direction:column;align-items:center;gap:2px;padding:var(--s2) 2px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);text-align:center;min-width:0}
.wx-week li.is-today{border-color:var(--gold);background:var(--surface2)}
.wx-week .wx-d{font-weight:600;font-size:var(--t-1);text-transform:uppercase;letter-spacing:.06em}.wx-week li.is-today .wx-d{color:var(--gold-hi)}
.wx-week .wx-t strong{font-family:var(--serif);font-size:var(--t0)}
.wx-week .wx-r{color:var(--info)}.wx-week .wx-r.muted{color:var(--muted)}
.wx-sun,.wx-src{margin:var(--s3) 0 0}
@media (max-width:520px){.wx-week{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* structured description (old [...slug].astro parseDescription) */
.desc-h{font-family:var(--serif);font-size:var(--t1);color:var(--gold-hi);margin:var(--s4) 0 var(--s2)}
.desc-list{margin:var(--s2) 0 var(--s3);padding-left:1.2em;max-width:65ch}.desc-list li{margin:2px 0}
.desc-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));gap:var(--s2);margin:var(--s3) 0;max-width:65ch}
.desc-facts div{border:1px solid var(--line);border-radius:var(--r-sm);padding:var(--s2) var(--s3);background:var(--surface)}.desc-facts dt{color:var(--muted);font-size:var(--t-1)}.desc-facts dd{margin:0}
.share-btn{display:inline-flex;align-items:center;gap:var(--s2)}.share-btn .ic{width:18px;height:18px}
/* agent profile (old agents/[slug].astro): photo beside the name, numbers, places, actions; the message card stays beside the page */
.ag-hero{display:grid;gap:var(--s4);align-items:center;margin:var(--s3) 0 var(--s5);padding:var(--s4);border:1px solid var(--line);border-radius:var(--r);background:linear-gradient(135deg,var(--hero-tint),var(--surface) 70%)}
@media (min-width:760px){.ag-hero{grid-template-columns:auto 1fr;gap:var(--s5);padding:var(--s5)}}
.ag-hero-pic .agent-pic{width:260px;height:260px}.ag-hero-pic .avatar-i.av240{width:260px;height:260px;font-size:4.2rem}
@media (max-width:759px){.ag-hero-pic .agent-pic,.ag-hero-pic .avatar-i.av240{width:180px;height:180px}}
.ag-hero h1{margin:0}.ag-hero .lead{margin:var(--s1) 0 0;font-style:italic}
.ag-stats{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);margin:var(--s3) 0;padding:var(--s3) 0;border-top:1px solid var(--line-ui);border-bottom:1px solid var(--line-ui)}
.ag-stats a{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);min-height:44px}.ag-stats strong{font-family:var(--serif);font-size:var(--t3);color:var(--gold-hi);line-height:1.1}.ag-stats span{font-size:var(--t-1);color:var(--muted);max-width:16ch}
.ag-towns .chips{margin:var(--s1) 0 0}
@media (min-width:860px){.ag-side{position:sticky;top:var(--s4);align-self:start}}
/* the Berry story (old story/index.astro + BerryStory.astro): his words set at reading width; eras as cards that grow with their text */
.story-hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(2.4rem,7vw,4.4rem);line-height:1;margin:var(--s2) 0 var(--s3)}
.story-hero h1 em,.story-open h2 em{font-style:italic;color:var(--gold-hi)}
.story-lead{max-width:64ch}
.story-two{display:grid;gap:var(--s5);align-items:start}
@media (min-width:880px){.story-two{grid-template-columns:1.4fr 1fr}}
.story-two p{max-width:65ch;line-height:1.75}
.story-photo{margin:0;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:var(--surface)}
.story-photo img{display:block;width:100%;height:auto}
.story-photo figcaption{padding:var(--s3);font-size:var(--t-1);color:var(--muted);line-height:1.55}.story-photo figcaption strong{display:block;color:var(--gold);letter-spacing:.2em;text-transform:uppercase;margin-bottom:var(--s1)}
.eras{list-style:none;margin:var(--s3) 0 var(--s4);padding:0;display:grid;gap:var(--s4);grid-template-columns:repeat(auto-fill,minmax(min(100%,19rem),1fr))}
.era{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--surface)}
.era img{display:block;width:100%;height:auto} /* the whole photo, never cropped */
.era-pic-none{display:grid;place-items:center;aspect-ratio:16/10;background:linear-gradient(135deg,var(--green),var(--surface2));color:var(--gold)}.era-pic-none .ic{width:40px;height:40px}
.era-b{padding:var(--s3) var(--s4) var(--s4)}.era-b h3{font-family:var(--serif);font-weight:400;font-size:var(--t1);color:var(--gold-hi);margin:0 0 var(--s2)}
.era-b p{margin:0 0 var(--s2);line-height:1.7}.era-b strong{color:var(--ink)}
.era-now{border-left:3px solid var(--gold)}
/* BerryAreaPhotos: photo cards on /areas and region pages (image, name, for-sale count, an "i" for the credit), and the photo hero.
   Phone: two columns. Wide screens: the overview grid fills the width. Overlays sit on solid tokens so the contrast check covers them. */
.wrap.wide{max-width:none}
.pcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:var(--s3);margin:var(--s3) 0 var(--s5);padding:0;list-style:none}
.pc{position:relative;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);transition:border-color var(--dur)}
.pc:hover,.pc:focus-within{border-color:var(--gold)}
.pc-a{display:block;color:var(--ink);text-decoration:none;border-radius:var(--r)}.pc-a:hover{color:var(--ink)}
.pc img,.pc-none{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r) var(--r) 0 0;background:var(--surface2)}
.pc-none{display:grid;place-items:center;color:var(--gold)}
.pc-t{display:flex;flex-direction:column;gap:2px;padding:var(--s2) var(--s3) var(--s3);min-width:0}
.pc-name{font:700 var(--t1)/1.25 var(--serif);overflow-wrap:break-word}
.pc-n{font-size:var(--t-1);color:var(--gold-hi)}
.pc-fb{font-size:var(--t-1);color:var(--muted)}
.pc-i summary{position:absolute;top:var(--s2);right:var(--s2);z-index:2;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--bg);color:var(--gold-hi);border:1px solid var(--line-ui);cursor:pointer;list-style:none}
.pc-i summary::-webkit-details-marker{display:none}.pc-i summary .ic{width:20px;height:20px}
.pc-i[open] summary{border-color:var(--gold-hi)}
.pc-i p{position:absolute;z-index:3;top:60px;left:var(--s2);right:var(--s2);margin:0;padding:var(--s2) var(--s3);background:var(--bg2);border:1px solid var(--line-ui);border-radius:var(--r-sm);font-size:var(--t-1);line-height:1.45;color:var(--muted);max-width:none}
.pc-i p a{color:var(--gold-hi)}
.area-hero{position:relative}
.area-hero img{aspect-ratio:21/9;max-height:460px}
.hero-n{position:absolute;left:var(--s3);top:var(--s3);padding:6px 14px;border-radius:999px;background:var(--bg);color:var(--gold-hi);border:1px solid var(--gold);font-weight:700}
.area-hero .pc-fb{font-size:inherit}
@media (max-width:600px){.pcards{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2)}.pc-t{padding:var(--s2)}.pc-name{font-size:var(--t0)}.area-hero img{aspect-ratio:4/3}.hero-n{left:var(--s2);top:var(--s2);font-size:var(--t-1)}}
/* BerryLayoutScan (5 Nov 2026): two place cards side by side on a phone are about 100 px wide; the place name shrinks to fit its card ("Queenst own" at 320 px), never under 12 px */
@media (max-width:600px){.pc{container-type:inline-size}.pc-name{font-size:max(12px,min(var(--t0),12.5cqi))}}
/* BerryWorkspaceFocus: "More (n)" menus, "Show all n" folds, and one "back" link instead of the whole breadcrumb trail in the Workspace */
.ws-more{display:inline-block;position:relative}.ws-more>summary{cursor:pointer;min-height:48px;display:inline-flex;align-items:center;padding:0 var(--s3);border:1px solid var(--line);border-radius:999px;color:var(--ink);font-weight:600}
.ws-more[open]>summary{border-color:var(--gold)}.ws-more-b{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s2)}
.ws-rest>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--muted);font-weight:600}
.ws .crumbs li{display:none}.ws .crumbs li:nth-last-child(2){display:inline}.ws .crumbs li:nth-last-child(2) a::before{content:"\2039\00a0"}
/* BerryPortalTruth: a glyph and a word per cell (never colour alone); the sold-and-still-advertised rows sit first, in a red box */
.pt-mark{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:var(--t-1);padding:2px 10px;border-radius:999px;border:1px solid var(--line-ui);white-space:nowrap;color:var(--ink);background:var(--surface2)}
.pt-present{color:var(--ok);background:var(--ok-bg);border-color:var(--ok)}.pt-missing{color:var(--bad);background:var(--bad-bg);border-color:var(--bad)}
.pt-duplicate,.pt-differs,.pt-warn{color:var(--warn);background:var(--warn-bg);border-color:var(--warn)}.pt-unread,.pt-off{color:var(--muted);background:var(--surface);border-style:dashed}
.pt-alert{background:var(--bad-bg);border:1px solid var(--bad);border-radius:var(--r);padding:12px 16px;margin:var(--s3) 0}.pt-alert h2{color:var(--bad);margin-top:0;display:flex;gap:8px;align-items:center}
.pt-warn-t{color:var(--warn)}.pt-line{margin:var(--s2) 0}.pt-cell{min-width:9.5em;vertical-align:top}.pt-table th[scope=row]{min-width:14em}
.pt-row-flag th[scope=row]{border-left:4px solid var(--bad)}.pt-row-trouble th[scope=row]{border-left:4px solid var(--warn)}.pt-counts td{text-align:center;font-variant-numeric:tabular-nums}
/* BerryOverseasBuyer: the price in other currencies under a plain asking price, the eligibility check and its cited lines */
.fx{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:var(--r);padding:12px 16px;margin:var(--s3) 0}
.fx-h{font:600 var(--t0) var(--sans);color:var(--muted);margin:0 0 6px}
.fx-list{list-style:none;padding:0;margin:0 0 6px;display:grid;grid-template-columns:repeat(auto-fit,minmax(8em,1fr));gap:4px 16px}
.fx-list li{font-variant-numeric:tabular-nums;color:var(--ink);font-size:var(--t1)}.fx-c{font-size:var(--t-1);color:var(--gold);font-weight:700;letter-spacing:.06em;margin-right:4px}
.fx-src{margin:0}
.ov-lines{padding-left:1.2em;margin:0;display:grid;gap:var(--s3);max-width:44em}.ov-lines li{line-height:1.5}
.ov-lines .src,.ov-home .src{display:block;font-size:var(--t-1);color:var(--muted)}.ov-lines .src a,.ov-home .src a{color:var(--gold-hi)}
.ov-choices .chip[aria-current]{border-color:var(--gold);background:var(--surface2);color:var(--gold-hi);font-weight:700}
.ov-answer{margin-top:var(--s3)}.ov-answer h3{margin-bottom:var(--s2)}
.ov-lawyer{font-weight:700;white-space:nowrap}
.ov-preview{background:var(--warn-bg);border:1px solid var(--warn);color:var(--ink);border-radius:var(--r-sm);padding:8px 12px}
/* BerrySellOverseas (5 Nov 2026): the listing's "Buying from overseas?" box and its video tick box; the Sell page (reasons beside a three-box
   form on a computer; on a phone the steps, then the form, then the reasons) */
.ov-box{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:var(--r);padding:12px 16px;margin:var(--s4) 0}
.ov-box h2{margin:0 0 6px;font-size:var(--t1)}
.ov-box-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}.ov-box-list strong{display:block}
@media(min-width:1100px){.ov-box-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 24px}}
.ov-box a,.sell-town p a{display:inline-block;padding:3px 0}
.ov-box-guides{margin:2px 0 0;padding:0}.ov-box-guides li{padding:0}
.ov-video{margin:10px 0}
.sell-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s4) var(--s5)}/* BerryBrowserSuitesFix: minmax(0,1fr), so the one column never grows to its widest word at 200% text (tests/public-fixes-browser.cjs) */
@media(min-width:860px){.sell-grid{grid-template-columns:minmax(0,1fr) minmax(300px,400px);grid-template-areas:"intro side" "why side"}.sell-intro{grid-area:intro}.sell-side{grid-area:side;position:sticky;top:var(--s4);align-self:start}.sell-why{grid-area:why}}
.sell-sec{margin-top:var(--s5)}.sell-intro .sell-sec{margin-top:var(--s4)}
.sell-steps,.sell-plan{padding-left:1.4em;margin:var(--s2) 0;display:grid;gap:var(--s2);max-width:44em}.sell-steps li,.sell-plan li{line-height:1.5}
.sell-towns{list-style:none;padding:0;margin:var(--s3) 0;display:grid;gap:var(--s3);grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr))}
.sell-town{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:var(--s3)}
.sell-town h3{margin:0 0 4px;font-size:var(--t1)}.sell-town p{margin:4px 0}
.sell-talk{color:var(--muted);font-size:var(--t-1)}
.sell-agents{list-style:none;padding:0;margin:0 0 8px;display:grid;gap:8px}
.sell-agents li{display:flex;align-items:center;gap:10px}
.sell-agents img{border-radius:50%;object-fit:cover;width:52px;height:52px;border:2px solid var(--gold)}
.sell-agents a{font-weight:600}.sell-agents small{display:block;color:var(--muted)}
.sell-form h2{margin-top:0}.sell-extra{margin:0 0 12px}.sell-extra>summary{cursor:pointer;padding:10px 0;color:var(--gold-hi);font-weight:600}
.sell-quotes blockquote{margin:0;border-left:4px solid var(--gold);padding:4px 0 4px var(--s3)}
/* BerryTeamAccess: agents on a listing, shares and asks, the activity log and the team feed */
.ta-agents{margin:0 0 var(--s2);padding-left:1.4em}.ta-agents li{margin:4px 0}.ta-acts{display:inline-flex;flex-wrap:wrap;gap:4px;margin-left:8px;vertical-align:middle}
.ta-sec{border-top:1px solid var(--line);padding-top:var(--s3);margin-top:var(--s3)}.ta-sec h2{margin-top:0}
.ta-levels{border:0;padding:0;margin:var(--s2) 0;display:grid;gap:6px}.ta-levels .check{display:block}
.ta-row{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end}.ta-row .field{margin:0}
.ta-cards>li{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:var(--r);padding:10px 14px;margin:0 0 8px}
.ta-log td{vertical-align:top}.ta-ch{margin:4px 0 0;font-size:var(--t-1)}.ta-ch li{margin:2px 0;overflow-wrap:anywhere}.ta-f{color:var(--muted)}.ta-from{color:var(--muted)}.ta-to{color:var(--ink);font-weight:600}
/* BerryListingActivity: Changes on a listing and Recent changes for the office */
.chg-ic{width:18px;height:18px;flex:none;color:var(--gold);vertical-align:-3px}.fold-h .chg-ic{width:20px;height:20px;margin-right:4px}
.chg-list{margin:var(--s2) 0;padding:0;display:grid;gap:8px;max-width:960px}main .chg-list li,main .chg-list p{max-width:none}
.chg-ev{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--line-ui);border-radius:var(--r);padding:10px 14px}
.chg-ev-approval,.chg-ev-publish{border-left-color:var(--gold)}
.chg-head{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}.chg-title{color:var(--ink);overflow-wrap:anywhere}
.chg-type{display:inline-flex;align-items:center;gap:4px;font-size:var(--t-1);color:var(--gold);border:1px solid var(--line-ui);border-radius:999px;padding:1px 8px;white-space:nowrap}
.chg-meta{margin:4px 0 0;font-size:var(--t-1);color:var(--muted)}.chg-who{color:var(--ink)}
.chg-fields{margin:6px 0 0;font-size:var(--t-1);display:grid;gap:3px}.chg-fields li{overflow-wrap:anywhere}.chg-f{color:var(--muted)}
.chg-b{color:var(--muted);text-decoration:line-through}.chg-a{color:var(--ink);font-weight:600}.chg-hid{color:var(--muted);font-style:italic}
.chg-link{margin:6px 0 0;font-size:var(--t-1);color:var(--muted)}.chg-used{color:var(--ink)}.chg-used strong{color:var(--gold-hi)}
.chg-filter{display:flex;flex-wrap:wrap;gap:6px;margin:var(--s2) 0}
.chg-filter a{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 12px;border:1px solid var(--line-ui);border-radius:999px;color:var(--ink);text-decoration:none;font-size:var(--t-1)}
.chg-filter a[aria-current]{border-color:var(--gold);background:var(--surface2)}.chg-n{color:var(--muted)}
.chg-ro{border:1px solid var(--line-ui);border-radius:var(--r);padding:8px 12px}
.ta-facts{display:grid;grid-template-columns:max-content 1fr;gap:4px 16px}.ta-facts dt{color:var(--muted)}.ta-facts dd{margin:0}
.lc-colist{margin:var(--s3) 0}.lc-colist a{display:inline-flex;align-items:center;min-height:44px}/* tap size: the "Add agents" link was 22 px tall on a phone (listing-guide-browser) */
@media (max-width:640px){.ta-log thead{display:none}.ta-log tr{display:block;border-bottom:1px solid var(--line);padding:8px 0}.ta-log td{display:block;padding:2px 0}}
/* ---- BerryViewingAvailability (29 Oct 2026): the buyer's time picker, the agent's viewing requests and Viewing times page */
fieldset.vw-pick{min-width:0}.vw-pick .chips{margin:0 0 8px}.vw-pick .vw-slot{flex:0 1 auto;min-width:0;max-width:100%}.vw-pick .chip.vw-slot{white-space:normal;line-height:1.25} /* a fieldset is min-content wide by default: without this the chips push it past a 390 px column */
.vw-more>summary{cursor:pointer;color:var(--gold-hi);min-height:44px;display:inline-flex;align-items:center;font-weight:600}
.vw-day{margin:var(--s3) 0}.vw-card{border-left-color:var(--gold)}.vw-note{font-style:italic}
.vw-wins li{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--line)}
.vw-add{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:flex-end}.vw-add .field{flex:1 1 140px;margin:0}
.vw-taking-f .field{margin:0}.vw-team li{padding:8px 0;border-bottom:1px solid var(--line)}
.vw-taking-lead{border-left:4px solid var(--gold);padding:8px 14px;background:var(--surface)}
.vw-taking-tag .tag{margin-left:0;background:var(--surface2);border-color:var(--gold);color:var(--gold-hi)}
.vw-preview li{margin:6px 0;overflow-wrap:anywhere}
@media (max-width:640px){.vw-add .field{flex:1 1 100%}.vw-pick .vw-slot{flex:1 1 calc(50% - var(--s2));justify-content:flex-start}}

/* ---- BerryPublicSmalls (30 Oct 2026): the plain-word "?", the Plain words page, the Gallery and the Featured strip. Tokens only. */
a.q,main a.q{position:relative;display:inline-grid;place-items:center;box-sizing:border-box;width:22px;height:22px;min-width:0;min-height:0;max-height:22px;padding:0;line-height:20px;flex:none;align-self:center;margin:0 2px 0 4px;vertical-align:.1em;border-radius:50%;border:1px solid var(--line-ui);background:var(--surface2);color:var(--gold-hi);font:700 13px/1 var(--sans,system-ui);text-decoration:none}
.q::after{content:"";position:absolute;inset:-11px}
.q:hover,.q:focus-visible,.q[aria-expanded="true"]{border-color:var(--gold-hi);color:var(--gold-hi)}
.q-say{display:block;margin:var(--s1) 0 var(--s2);padding:var(--s2) var(--s3);border-left:3px solid var(--gold);background:var(--bg2);border-radius:var(--r-sm);font:400 var(--t-1)/1.5 var(--sans,system-ui);color:var(--ink);max-width:60ch;white-space:normal}
.q-say[hidden]{display:none}
.q-say a{color:var(--gold-hi);display:inline-block;margin-top:2px}
.pw-list{margin:var(--s4) 0;padding:0}
.pw-list>div{padding:var(--s3) 0;border-bottom:1px solid var(--line)}
.pw-list dt{font:700 var(--t1)/1.3 var(--serif);color:var(--ink)}
.pw-list dd{margin:var(--s1) 0 0}
.pw-list .src{display:block;margin-top:var(--s1)}
.pw-list>div:target{border-left:3px solid var(--gold);padding-left:var(--s3)}
.gals{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:var(--s3);margin:var(--s3) 0;padding:0;list-style:none}
.gal figure{margin:0;height:100%;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);overflow:hidden}
.gal:focus-within figure,.gal figure:hover{border-color:var(--gold)}
.gal-pic{display:block}
.gal img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;background:var(--surface2)}
.gal figcaption{display:flex;flex-direction:column;gap:var(--s1);padding:var(--s2) var(--s3) var(--s3)}
.gal-name{font:700 var(--t1)/1.25 var(--serif)}
.gal-name a{color:var(--ink)}
.gal-cap{font-size:var(--t-1);color:var(--ink)}
.gal-credit{font-size:var(--t-1);color:var(--muted)}
.gal-credit a,.gal-homes a{color:var(--gold-hi)}
.gal-homes{font-size:var(--t-1);margin-top:auto;padding-top:var(--s1)}
.gal-homes a{display:inline-block;min-height:24px}
.feat{border-top:1px solid var(--line)}
.feat-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr))}
.feat-form{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:var(--s2);align-items:end}
.feat-form .field{margin:0}

/* ---- BerryMeaningColours (29 Oct): see DECISIONS.md */
[data-m="you"]{--mc:var(--m-you);--ml:var(--m-you-line);--mb:var(--m-you-bg)}
[data-m="them"]{--mc:var(--m-them);--ml:var(--m-them-line);--mb:var(--m-them-bg)}
[data-m="clock"]{--mc:var(--m-clock);--ml:var(--m-clock-line);--mb:var(--m-clock-bg)}
[data-m="money"]{--mc:var(--m-money);--ml:var(--m-money-line);--mb:var(--m-money-bg)}
[data-m="done"]{--mc:var(--m-done);--ml:var(--m-done-line);--mb:var(--m-done-bg)}
[data-m="info"]{--mc:var(--m-info);--ml:var(--m-info-line);--mb:var(--m-info-bg)}
.mchip{display:inline-flex;align-items:center;gap:5px;padding:1px 10px 1px 7px;border-radius:999px;font:700 var(--t-1)/1.5 var(--sans);letter-spacing:.01em;text-transform:none;color:var(--mc,var(--ink));background:var(--mb,var(--surface2));border:1px solid var(--ml,var(--line-ui));vertical-align:middle;max-width:100%}
.mchip .ic{width:16px;height:16px;flex:0 0 16px}.mchip-t{overflow-wrap:anywhere}
/* the left bar: cards, rows and the Focus card carry their meaning on the edge an eye scans down */
.fx-card[data-m],.day-card[data-m],.tr-sub[data-m],.mrow[data-m]{border-left:6px solid var(--ml)}
.fx-primary[data-m]{border-color:var(--ml);border-left-width:8px}
.fx-kicker{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.tr-sub[data-m],.mrow[data-m]{padding-left:12px}
.day-card[data-m]{border-color:var(--line);border-left-color:var(--ml)}
.day-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
/* section titles: a meaning-coloured underline and picture where the whole section means one thing */
.mh[data-m]{display:inline-flex;align-items:center;gap:8px;border-bottom:3px solid var(--ml);padding-bottom:2px}.mh[data-m]>.ic{color:var(--mc);flex:0 0 auto}
/* people: a role word in a small box + the name in bold ink. Not a colour. */
.who{display:inline-flex;align-items:center;gap:4px;flex-wrap:wrap}.who .ic-who{width:16px;height:16px;color:var(--muted)}
.who-r{font:700 .75rem/1.4 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--ink);border:1px solid var(--line-ui);border-radius:4px;padding:0 5px}
.who-n{color:var(--ink)}
/* the older status chips speak the same six */
.ws-st[data-m],.ws-st-new,.ws-st-draft{--mc:var(--m-you);--ml:var(--m-you-line);--mb:var(--m-you-bg)}
.ws-st-replied,.ws-st-ready{--mc:var(--m-them);--ml:var(--m-them-line);--mb:var(--m-them-bg)}
.ws-st-bad{--mc:var(--m-clock);--ml:var(--m-clock-line);--mb:var(--m-clock-bg)}
.ws-st-underoffer{--mc:var(--m-money);--ml:var(--m-money-line);--mb:var(--m-money-bg)}
.ws-st-published,.ws-st-sold{--mc:var(--m-done);--ml:var(--m-done-line);--mb:var(--m-done-bg)}
.ws-st-new,.ws-st-draft,.ws-st-replied,.ws-st-ready,.ws-st-bad,.ws-st-underoffer,.ws-st-published,.ws-st-sold,.ws-st[data-m]{color:var(--mc);background:var(--mb);border-color:var(--ml)}
.ws-st[data-m="you"]{--mc:var(--m-you);--ml:var(--m-you-line);--mb:var(--m-you-bg)}.ws-st[data-m="them"]{--mc:var(--m-them);--ml:var(--m-them-line);--mb:var(--m-them-bg)}
.ws-st[data-m="clock"]{--mc:var(--m-clock);--ml:var(--m-clock-line);--mb:var(--m-clock-bg)}.ws-st[data-m="money"]{--mc:var(--m-money);--ml:var(--m-money-line);--mb:var(--m-money-bg)}
.ws-st[data-m="done"]{--mc:var(--m-done);--ml:var(--m-done-line);--mb:var(--m-done-bg)}.ws-st[data-m="info"]{--mc:var(--m-info);--ml:var(--m-info-line);--mb:var(--m-info-bg)}
.ws-st .ic{width:14px;height:14px;vertical-align:-2px;margin-right:4px}
/* portal truth: present = done, missing or wrong = waiting on you, still advertised but not for sale = the legal clock (Fair Trading Act) */
.pt-present{color:var(--m-done);background:var(--m-done-bg);border-color:var(--m-done-line)}
.pt-missing,.pt-duplicate,.pt-differs,.pt-warn{color:var(--m-you);background:var(--m-you-bg);border-color:var(--m-you-line)}
.pt-alert{background:var(--m-clock-bg);border-color:var(--m-clock-line)}.pt-alert h2{color:var(--m-clock)}
.pt-row-flag th[scope=row]{border-left-color:var(--m-clock-line)}.pt-row-trouble th[scope=row]{border-left-color:var(--m-you-line)}.pt-warn-t{color:var(--m-you)}
/* the legend (Settings › Help) and the tokens page */
.mlegend{list-style:none;padding:0;margin:var(--s2) 0;display:grid;gap:var(--s2)}.mlegend li{display:grid;gap:2px;padding:6px 0 6px 12px;border-left:6px solid var(--ml)}
.mlegend p{margin:0;font-size:var(--t-1);color:var(--ink)}
.mtok{border-collapse:collapse;width:100%}.mtok th,.mtok td{border-bottom:1px solid var(--line);padding:8px;text-align:left;vertical-align:top}
.mtok .sw{display:inline-block;width:18px;height:18px;border-radius:4px;border:1px solid var(--line-ui);vertical-align:-4px;margin-right:6px}
@media (max-width:640px){.mtok thead{display:none}.mtok tr{display:block;border-bottom:1px solid var(--line);padding:8px 0}.mtok td,.mtok th{display:block;border:0;padding:2px 0}}
/* Windows high contrast / forced colours: the system picks the colours; the bar, the picture and the word still say it */
@media (forced-colors:active){.mchip,.ws-st{border:1px solid CanvasText}.fx-card[data-m],.day-card[data-m],.tr-sub[data-m],.mrow[data-m],.mlegend li{border-left-color:CanvasText}.mh[data-m]{border-bottom-color:CanvasText}}
.fold[data-m]>summary>.ic{color:var(--mc);flex:0 0 24px}.fold[data-m]>summary .fold-h{text-decoration:underline 3px var(--ml);text-underline-offset:6px}
.day-sent[data-m]{border-left-color:var(--ml)}
.mtok .sw-fg{background:var(--mc)}.mtok .sw-line{background:var(--ml)}.mtok .sw-bg{background:var(--mb)}.mlegend .mlegend-who{border-left-color:var(--line-ui)}
.set-h{font-size:var(--t1);margin:var(--s4) 0 var(--s2)}.set-colours>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--gold-hi);font-weight:600}

/* BerryEntryWizard W0: one light card in the hero (never a modal), the "I'm here to" page, the listing chip, the demand note */
.w0{margin:var(--s4) 0 0;padding:var(--s3);background:var(--surface);border:1px solid var(--line-ui);border-radius:var(--r);max-width:60rem}
.w0[hidden],.w0-chip[hidden],[data-w0-after][hidden],[data-w0-last][hidden]{display:none}
.w0 h2{margin:0 0 var(--s2);font-size:var(--t1)}
/* on a computer the first visit's first screen is one decision: who we are, search, and who are you (the page scrolls on to the listings) */
@media (min-width:701px){.hero.w0-on{min-height:100vh;min-height:100svh;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center}}
.w0-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s2)}
.w0-c{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:56px;padding:var(--s2) var(--s3);border:1px solid var(--line-ui);border-radius:var(--r-sm);background:var(--bg2);color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:border-color var(--dur),background var(--dur)}
.w0-c:hover,.w0-c:focus-visible{border-color:var(--gold);background:var(--surface2)}
.w0-c.on{border-color:var(--gold);background:var(--surface2)}
.w0-l{font-weight:700}
.w0-h{font-size:.85rem;color:var(--muted);line-height:1.3}
.w0-foot{margin:var(--s2) 0 0}
.w0-page .w0-grid{grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));margin:var(--s3) 0}
.w0-lead{margin:var(--s3) 0 0}
.w0-both{margin:var(--s2) 0 0}
.w0-keep{margin:var(--s3) 0;padding:var(--s3);border:1px solid var(--line-ui);border-radius:var(--r);background:var(--surface)}
.w0-keep h2{margin-top:0}
.w0-chip{position:fixed;right:var(--s3);bottom:var(--s3);z-index:56;display:flex;align-items:center;gap:var(--s1);padding:var(--s1) var(--s1) var(--s1) var(--s3);background:var(--surface2);border:1px solid var(--gold);border-radius:999px;box-shadow:var(--shadow)}
.w0-chip a{color:var(--ink);font-weight:600;text-decoration:none;min-height:44px;display:flex;align-items:center}
.w0-chip a:hover{text-decoration:underline}
.w0-chip-x{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:var(--ink);cursor:pointer}
.w0-chip-x .ic{width:18px;height:18px}
.w0-demand{margin:var(--s4) 0;padding:var(--s3);border:1px solid var(--line-ui);border-radius:var(--r);background:var(--surface)}
.w0-demand h2{margin-top:0}
.fold-demand>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:var(--gold-hi);font-weight:600}
.demand-contact{border:1px solid var(--line);border-radius:var(--r-sm);padding:var(--s2) var(--s3);margin:var(--s3) 0}
@media (max-width:900px){.w0-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:700px){
.w0{margin-top:var(--s3);padding:var(--s2) var(--s3) var(--s3)}
.w0-grid{grid-template-columns:1fr 1fr}
.w0-c{min-height:48px;justify-content:center}
.w0-c:last-child{grid-column:1 / -1}
.w0-h{display:none}
.w0-foot{font-size:.8rem}
.has-bar .w0-chip{bottom:calc(76px + env(safe-area-inset-bottom))}
.w0-chip{left:var(--s3);right:auto}
html[data-hand="right"] .w0-chip{left:auto;right:var(--s3)}
}
@media print{.w0,.w0-chip{display:none!important}}

/* BerrySleek2FA: two-step sign-in pages (lib/twofa-views.js). The QR keeps a white quiet zone so phones read it on the dark theme. */
.tfa-qr{margin:12px 0;max-width:240px}.tfa-qr svg{display:block;width:100%;height:auto;border-radius:var(--r-sm)}
.tfa-key{font-size:var(--t1);letter-spacing:.08em;word-spacing:.25em;display:inline-block;line-height:1.7}
/* BerryNewAgentDay1: a phone cannot scan its own screen, so the open-in-app button leads there; a computer has no app to open, so the code leads */
.tfa-app .btn{display:flex;align-items:center;justify-content:center}.tfa-app-note{display:block;margin-top:6px}
@media (min-width:701px) and (pointer:fine){.tfa-app{display:none}}
@media (max-width:700px),(pointer:coarse){.tfa-qr{max-width:150px}}
/* mid sign-in the sidebar would be empty, and on a phone its bar would cover the QR code */
.ws-outside .side{display:none}html body.ws-outside .page{margin:0;padding-bottom:var(--s3)}html body.ws-outside .logo-top{display:inline-flex}
.fd-card{margin:0 0 20px;padding:16px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface)}.fd-card h2{margin:0 0 4px}
.fd-steps{margin:8px 0 12px;padding-left:24px}.fd-steps li{margin:0 0 12px}.fd-why{display:block;margin-top:4px}
.ap-photo{display:block;border-radius:var(--r-sm);object-fit:cover}
.tfa-steps>li{margin:0 0 20px}
.tfa-codes{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px 24px;padding-left:28px;font-size:var(--t1)}
.tfa-codes code{letter-spacing:.06em}
.tfa-or{margin:8px 0}.tfa-lost{margin:20px 0}
.tfa-pk{padding-left:20px}.tfa-pk li{margin:0 0 10px}
.tfa-noapp,.ws-first{margin:8px 0}.tfa-noapp summary,.ws-first summary{cursor:pointer;padding:11px 0;font-weight:600;text-decoration:underline;text-underline-offset:3px}
/* BerryMondayReady: the first set-up's fingerprint-or-face choice, and the authenticator app folded under it */
.tfa-pk-first[hidden]{display:none}.tfa-pk-first{border:1px solid var(--line-ui);border-radius:var(--r-sm);padding:12px 16px;margin:16px 0}.tfa-pk-first .btn{width:100%}
.tfa-way{margin:24px 0 8px}.tfa-way[hidden]{display:none}
/* BerryAgentFirstSignIn: "check your listings" (lib/first-check.js), one card per listing, two answers each */
.fc-list{display:grid;gap:16px;padding:0;margin:16px 0}
.fc-card{display:grid;grid-template-columns:160px 1fr;gap:16px;padding:16px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface)}
.fc-card[data-answer=ok]{border-left:6px solid var(--m-done-line)}.fc-card[data-answer=wrong]{border-left:6px solid var(--m-you-line)}
.fc-img{width:160px;height:107px;object-fit:cover;border-radius:6px}.fc-noimg{display:flex;align-items:center;justify-content:center;background:var(--bg);color:var(--muted);font-size:.85rem}
.fc-addr{margin:0 0 4px;font-size:var(--t1,1.15rem)}.fc-body p{margin:4px 0}.fc-note{margin:4px 0 8px;padding:6px 10px;border-left:3px solid var(--line);white-space:pre-wrap}
.fc-act{grid-column:2;display:flex;flex-wrap:wrap;gap:8px 12px;align-items:flex-start}.fc-act .btn,.fc-act summary{min-height:44px}
.fc-wrong summary{list-style:none;display:inline-flex;align-items:center}.fc-wrong summary::-webkit-details-marker{display:none}.fc-wrong[open]{flex-basis:100%}
.fc-missing{margin:8px 0 16px}.fc-next{margin-top:16px}
@media (max-width:600px){.fc-card{grid-template-columns:88px 1fr;gap:12px;padding:12px}.fc-img{width:88px;height:59px}.fc-act{grid-column:1/-1}}
.tfa-codes code{white-space:nowrap}@media (max-width:600px){.tfa-codes{grid-template-columns:1fr}}
@media print{.tfa .btn,.tfa .btn-ghost{display:none!important}}
/* BerryListingTours: the listing page's "Take the tour" line and the Workspace Tours panel (lib/tours-ws.js) */
.tour-cta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:var(--s2) 0}
.tl-prev{margin:0 0 var(--s3);padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
.tl-prev video{display:block;width:100%;max-width:640px;max-height:70vh;background:var(--bg);border-radius:6px}
.tl-prev figcaption{margin:8px 0}
.tl-ok{color:var(--ok)}.tl-no{color:var(--bad)}.tl-draft{color:var(--warn)}
.tl-decide{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 12px}
.tl-decide .field{flex:1 1 240px;margin:0}
/* BerryListingBrochure: the Workspace panel. A preview is the real page drawn at a fixed scale, so it fits a phone without a script */
.br-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:var(--s4);align-items:start;margin:var(--s4) 0}
.br-card{min-width:0;padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
.br-card h2{margin-top:0}
.br-frame{--sc:.27;width:calc(var(--w)*var(--sc)*1px);height:calc(var(--h)*var(--sc)*1px);overflow:hidden;border:1px solid var(--line-ui);background:var(--bg)}
.br-frame iframe{display:block;width:calc(var(--w)*1px);height:calc(var(--h)*1px);border:0;transform:scale(var(--sc));transform-origin:0 0}
.br-frame-brochure{--w:794;--h:2258;--sc:.36}.br-frame-square{--w:1080;--h:1080}.br-frame-story{--w:1080;--h:1920}
.br-state{margin:8px 0}

/* ---- BerryFirstScreen (31 Oct 2026, buyer critique issues 12, 13, 15, 16): the wordmark, the photo hero with the newest homes on the first
   screen, the Buy page's results before its questions, a sort row and a compact phone card. */
/* the wordmark: "BERRY" is the agency's own logo file used as a mask, so it is drawn in the gold token (and in the system colour in forced colours) */
.logo-wm{flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;line-height:1}
.logo-mark[data-wm]{flex:0 0 auto;display:block;width:118px;height:auto;aspect-ratio:3184.9/651;border-radius:0;background:var(--gold-hi)}
/* BerryVectorLogo (9 Nov 2026): one vector file, four pieces (tools/brand-logo.py prints these numbers; each piece keeps its own shape, so a
   percentage size and place pick it out at any width). BERRY 118 px as before; the small lines at the old 0.75rem lines' cap height, with
   a thin outline stroke so they keep the weight the old Lora 700 lines had (Alice has one weight). */
.logo-mark[data-wm],.logo-wm .lm{-webkit-mask-image:url(/brand/berry-logo-mask.svg);mask-image:url(/brand/berry-logo-mask.svg);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.logo-mark[data-wm]{-webkit-mask-size:100% 239.7%;mask-size:100% 239.7%;-webkit-mask-position:0 0;mask-position:0 0}
.logo-wm .lm{display:block;flex:0 0 auto;height:.6118rem;background:var(--ink)}
.logo-wm .lm-re{aspect-ratio:2797/263.2;-webkit-mask-size:113.9% 592.9%;mask-size:113.9% 592.9%;-webkit-mask-position:0 53.3%;mask-position:0 53.3%}
.logo-wm .lm-nz{aspect-ratio:534/263.2;-webkit-mask-size:596.5% 592.9%;mask-size:596.5% 592.9%;-webkit-mask-position:0 76.6%;mask-position:0 76.6%}
.logo-wm .lm-est{aspect-ratio:1928.1/263.2;-webkit-mask-size:165.2% 592.9%;mask-size:165.2% 592.9%;-webkit-mask-position:0 100%;mask-position:0 100%;background:var(--gold-hi)}
.logo-b svg{display:block;width:100%;height:100%}
@media (forced-colors:active){.logo-wm .lm{forced-color-adjust:none;background:CanvasText}}
.logo-wm .logo-t{display:flex;flex-direction:column;gap:4px}
.logo-wm small{display:flex;align-items:center;font:600 .75rem/1 var(--serif);letter-spacing:.17em;text-transform:uppercase;color:var(--ink)}
.logo-wm .logo-est{font-weight:400;color:var(--gold-hi)}
.logo-wm .logo-nz{display:block;padding-right:8px;margin-right:8px;border-right:1px solid var(--line-ui)}
.logo-wm:hover .logo-mark[data-wm]{background:var(--ink)}
@media (forced-colors:active){.logo-mark[data-wm]{forced-color-adjust:none;background:CanvasText}}
@media (max-width:420px){.hdr-in .logo-top .logo-est{display:flex}.logo-top .logo-mark[data-wm]{width:96px}}
.foot-logo.logo-wm{display:inline-flex}
/* in the sidebar the three lines keep the old logo's 48 px, so the menu below does not start to scroll on a laptop */
.drawer .logo-wm{gap:3px}.drawer .logo-mark[data-wm]{width:104px}.drawer .logo-wm .logo-t{gap:3px}.drawer .logo-wm small{font-size:.75rem}
/* the photo hero: Berry's own landscape behind the heading and search, darkened where the words are (measured in tests/first-screen-browser.cjs) */
:root{--hero-ph:560px}
.hero.w0-on{min-height:0;display:block}
.hero-photo{position:relative;overflow:hidden;padding-top:var(--s5);border-bottom:0;background:var(--bg)}
.hero-photo .hero-img{position:absolute;z-index:0;left:0;top:0;width:100%;height:var(--hero-ph);object-fit:cover;object-position:50% 55%}
.hero-photo::before{content:"";position:absolute;z-index:1;left:0;right:0;top:0;height:var(--hero-ph);background:linear-gradient(180deg,transparent 60%,var(--bg) 100%),linear-gradient(90deg,color-mix(in srgb,var(--bg) 90%,transparent) 0%,color-mix(in srgb,var(--bg) 86%,transparent) 70%,color-mix(in srgb,var(--bg) 40%,transparent) 100%)}
html[data-contrast="high"] .hero-photo::before{background:linear-gradient(180deg,transparent 60%,var(--bg) 100%),color-mix(in srgb,var(--bg) 85%,transparent)}
.hero-photo .hero-in{position:relative;z-index:2}
.hero-photo .lead{color:var(--ink)}
.hero-eyebrow{margin:0 0 var(--s2);font:600 var(--t-1)/1.4 var(--serif);letter-spacing:.17em;text-transform:uppercase;color:var(--gold-hi)}
.hero-credit{position:absolute;z-index:3;top:var(--s2);right:var(--s3);margin:0;padding:2px 10px;border-radius:999px;background:color-mix(in srgb,var(--bg) 92%,transparent);color:var(--ink);font-size:.75rem;letter-spacing:.08em}
/* "Just listed": the newest four, one link each */
.jl-wrap{margin:var(--s4) 0 var(--s3)}
.jl-head{margin-bottom:var(--s2)}.jl-head h2{margin:0;font-size:var(--t1)}
.jl-row{list-style:none;margin:0;padding:0;display:grid;gap:var(--s3);grid-template-columns:repeat(4,minmax(0,1fr))}
main .jl-row li,main .sortbar li{max-width:none}
.jl-a{display:flex;flex-direction:column;height:100%;background:var(--surface);border:1px solid var(--line-ui);border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);box-shadow:var(--shadow);transition:border-color var(--dur)}
.jl-a:hover{border-color:var(--gold);color:var(--ink)}
.jl-a:focus-visible{outline:3px solid var(--gold-hi);outline-offset:3px;border-radius:var(--r)}
.jl-pic{display:grid;place-items:center;aspect-ratio:3/2;overflow:hidden;background:var(--surface2);font:700 var(--t1) var(--serif)}
.jl-pic img{width:100%;height:100%;object-fit:cover;display:block}
.jl-t{display:flex;flex-direction:column;gap:2px;padding:var(--s2) var(--s3) var(--s3);min-width:0}
.jl-price{color:var(--gold-hi)}
.jl-addr{font-weight:600;overflow-wrap:anywhere}
.jl-sub{font-size:var(--t-1);color:var(--muted)}
@media (min-width:701px) and (max-width:999px){.jl-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){
:root{--hero-ph:430px}
.hero-photo::before{background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 74%,transparent) 0%,color-mix(in srgb,var(--bg) 82%,transparent) 65%,var(--bg) 100%)}
.hero-photo .lead{font-size:var(--t0)}
.hero-photo .search input{flex-basis:150px}
.jl-wrap{margin-top:var(--s3)}
.jl-row{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(210px,66%);overflow-x:auto;overscroll-behavior-x:contain;margin-inline:calc(-1 * var(--s3));padding:2px var(--s3) var(--s2);scroll-padding-inline:var(--s3)}
/* no scroll snapping: with it, Tab left the third and fourth homes half off the screen (tests/first-screen-browser.cjs) */
}
/* Buy: the results first; on a computer the questions are a column beside them; the order and the list/photo switch above the homes */
.fcol-h{display:none}
@media (min-width:701px){
.buy-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,340px);gap:var(--s4);align-items:start}
/* BerryBuyerFixes (8 Nov 2026, blind buyer review: "on desktop, filters have a separate vertical scroll area"): the column scrolls with the
   page (no box that scrolls on its own inside the page); it starts with what is chosen and Clear all (.fcol-nav) */
.buy-cols>.fsheet,.buy-cols>.fsheet[data-fold-desk]{display:block;position:static;border:1px solid var(--line);border-radius:var(--r);background:var(--bg2);padding:var(--s3)}
.buy-cols .fcol-nav{display:block;margin:0 0 var(--s2)}
.fsheet-open,.fsheet-open[data-fold-desk]{display:none}
.buy-cols>.fsheet .fsheet-head{display:none}
.buy-cols .fcol-h{display:block;margin:0 0 var(--s2);font-size:var(--t1)}
.buy-cols .results-h{margin-top:0}
.buy-cols .steps-q{margin:var(--s2) 0}
}
.sortrow{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s2);margin:0 0 var(--s3)}
/* BerryBuyerFixes (8 Nov 2026, blind buyer review: the phone's sort chips scrolled sideways): one menu, "Sort: Newest", opening to the four
   orders over the page (not pushing it down); each a 44 px row, the chosen one ticked. Same on a phone and a computer. */
.sortmenu{position:relative}
.sortmenu>summary{list-style:none;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:8px 16px;border:1px solid var(--line-ui);border-radius:999px;background:var(--surface);color:var(--ink);cursor:pointer;white-space:nowrap}
.sortmenu>summary::-webkit-details-marker{display:none}
.sortmenu>summary::after{content:"";width:7px;height:7px;margin-left:4px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.sortmenu[open]>summary::after{transform:translateY(2px) rotate(-135deg)}
.sortmenu-list{position:absolute;z-index:30;left:0;top:calc(100% + 6px);min-width:220px;list-style:none;margin:0;padding:6px;background:var(--bg);border:1px solid var(--line-ui);border-radius:var(--r);box-shadow:var(--shadow)}
.sortmenu-list a{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 12px;border-radius:8px;color:var(--ink);text-decoration:none}
.sortmenu-list a:hover{background:var(--surface)}
.sortmenu-list a::before{content:"";width:16px;flex:0 0 16px}
.sortmenu-list a[aria-current="true"]{font-weight:700;background:var(--surface)}
.sortmenu-list a[aria-current="true"]::before{content:"\2713"}
.viewtog{min-height:44px;padding:8px 14px}
/* BerryBuyerFixes (item 1): the area quick-start, Home and Buy. Chips wrap to a second line; a chip never shrinks or breaks inside a word. */
.area-start{margin:var(--s3) 0}
.area-start .as-h{margin:0 0 var(--s1);font-weight:600}
.area-start ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s2)}
.area-start li{flex:0 0 auto;max-width:100%}
.area-start .chip{font-weight:600;white-space:nowrap}
.as-n{font-weight:400;opacity:.85}
.chip.on .as-n{opacity:1}
.area-first,.area-near{margin:0 0 var(--s3)}
.area-near .chip{margin:2px 4px 2px 0}
/* BerryBuyerFixes (item 2): the card's "Details last checked" line, then "Listed" */
.card .checked{margin:0}
.card .checked+.listed,.card .stale+.listed{margin-top:0}
.viewtog{display:none;font:inherit;cursor:pointer}
.viewtog[aria-pressed="true"]{background:var(--gold);color:var(--on-gold);border-color:var(--gold);font-weight:600}
.sort-note{margin:0 0 var(--s3)}
@media (max-width:700px){
/* one line: the sort menu, then the photo switch at the end (BerryBuyerFixes: the menu replaced the row of chips that scrolled sideways) */
.sortrow{flex-wrap:nowrap}
html.js .viewtog{display:inline-flex;flex:0 0 auto}
.viewtog{padding:8px 12px;font-size:.92rem}
/* BerrySortChips (5 Nov 2026, Will's phone): a control never shrinks or breaks inside a word */
.sortmenu{flex:0 1 auto;min-width:0}
.sortmenu>summary,.viewtog{white-space:nowrap;overflow-wrap:normal;word-break:normal}
.area-start{margin:var(--s2) 0}.area-start ul{gap:6px}.area-start .chip{padding:6px 10px;font-size:.92rem}.area-start .as-h{font-size:.95rem}
.hero-photo{padding-top:40px}
/* the search button beside the box, not under it (still 48 px tall): one row less before the homes, on the home page and on Buy */
.search input{flex-basis:150px}
.search .btn{width:auto;flex:0 0 auto}
/* BerrySearchFit (6 Nov, Will's phone): "e.g. 3 bed house in Wānaka" was cut off beside "Search listings"; under 480 px the box takes the full width and the button sits under it */
@media (max-width:480px){.search input{flex-basis:100%}.search .btn{flex:1 1 100%}}
/* the compact card: photo beside price, address, town and facts (about 140 px a home, not a screen) */
html:not([data-cards="big"]) .hits{gap:var(--s2)}
html:not([data-cards="big"]) .hits .card{flex-direction:row;align-items:stretch}
html:not([data-cards="big"]) .hits .card:hover{transform:none}
html:not([data-cards="big"]) .hits .card-pic{flex:0 0 38%;max-width:150px;aspect-ratio:auto;min-height:118px;border-bottom:0;border-right:1px solid var(--line)}
/* BerryLayoutScan (5 Nov 2026): a home with no photo shows its suburb in the narrow photo box; the name now fits the box ("Queenstow n" at 320-390 px) */
html:not([data-cards="big"]) .hits .card-pic{container-type:inline-size}
html:not([data-cards="big"]) .hits .card-pic>span{font-size:max(12px,min(var(--t1),13cqi));padding:0 4px;text-align:center}
html:not([data-cards="big"]) .hits .card-body{min-width:0;padding:var(--s2) var(--s3) var(--s2) var(--s2);gap:0}
html:not([data-cards="big"]) .hits .card .price{min-height:0;font-size:var(--t0)}
html:not([data-cards="big"]) .hits .card h3{font-size:var(--t0)}
html:not([data-cards="big"]) .hits .card .agent,html:not([data-cards="big"]) .hits .card .listed{display:none}
html:not([data-cards="big"]) .hits .card .where,html:not([data-cards="big"]) .hits .card .factline{font-size:var(--t-1);margin:0}
}
/* ---- BerryTraditionalHarvest2 (31 Oct 2026): pages from the first Berry site (FAQ, property management, compare places, lifestyle).
   Existing tokens only. The compare table is a table on a wide screen and, on a phone, one topic at a time with each place labelled. */
.trad .lead{max-width:70ch}
.trad-h{margin:var(--s3) 0 var(--s2);font-size:var(--t0)}
.trad-checked .src{display:block;font-size:var(--t-1);color:var(--muted)}
.trad-checked .src a{color:var(--gold-hi)}
.trad-took{padding-left:1.2em;display:grid;gap:var(--s2)}.trad-took q{font-style:italic}
.trad-list{padding-left:1.2em;margin:var(--s2) 0}.trad-list li{margin:4px 0}
.trad-jump{margin:var(--s3) 0}
.trad-cards{display:grid;gap:var(--s3);grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));margin:var(--s3) 0}
.trad-card h3{margin:0 0 var(--s2)}.trad-card .trad-lead{font-weight:600}
.trad-pm{display:grid;gap:var(--s4);align-items:start}
@media (min-width:900px){.trad-pm{grid-template-columns:1.4fr 1fr}}
.trad-pm .trad-cards{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.trad-tick{list-style:none;padding:0}.trad-tick li{padding:8px 0;border-bottom:1px solid var(--line)}.trad-tick li::before{content:"✓ ";color:var(--gold)}
.trad-cmp-form{display:grid;gap:var(--s3);grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));align-items:end}
.trad-cmp{width:100%;border-collapse:collapse;margin:var(--s4) 0;table-layout:fixed}
.trad-cmp th,.trad-cmp td{text-align:left;vertical-align:top;padding:var(--s3);border-top:1px solid var(--line)}
.trad-cmp thead th{font-family:var(--serif);font-size:var(--t2);border-top:0}
.trad-cmp tbody th{width:12em;color:var(--muted);font-weight:600}
@media (max-width:760px){
  .trad-cmp,.trad-cmp tbody,.trad-cmp tr,.trad-cmp th,.trad-cmp td{display:block;width:auto}
  .trad-cmp thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .trad-cmp tr{border-top:1px solid var(--line);padding:var(--s2) 0}
  .trad-cmp tbody th{color:var(--ink);font-family:var(--serif);font-size:var(--t1);border:0;padding:var(--s2) 0}
  .trad-cmp td{border:0;padding:var(--s2) 0 var(--s2) var(--s3);border-left:3px solid var(--line)}
  .trad-cmp td::before{content:attr(data-label);display:block;font-weight:700;color:var(--gold-hi);font-size:var(--t-1)}
}
.trad-where li{margin:4px 0}
.trad-took-d summary{cursor:pointer;min-height:44px;display:flex;align-items:center}

/* BerryAgentDailyLoop: the spelling warning (lib/spell-check.js) and "Next" after a reply. Warning colours come from .notice. */
.ws-spell h2{font-size:1.05rem;margin:0 0 4px}.ws-spell p{margin:0 0 8px}.ws-spell{margin:0 0 12px}
.ws-spell-l{margin:0;padding:0}.ws-spell-l li{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;justify-content:space-between;padding:6px 0;border-top:1px solid var(--warn)}
.ws-spell-a{display:flex;flex-wrap:wrap;gap:6px}.ws-spell-a form,.ws-spell-l form{margin:0}.ws-spell-a button,.ws-spell-l button{min-height:44px}
.ws-spell-line{margin:8px 0}
.ws-next{margin:0 0 12px}.ws-next p{margin:0 0 4px}.ws-next .btn{margin:6px 0 2px}
/* BerryFindAPerson (5 Nov 2026): the Find a person box and its one-line-per-person results, phone width first */
.fp-row{display:flex;gap:8px;flex-wrap:wrap}.fp-row input{flex:1 1 12rem;min-width:0;font-size:1.1rem;min-height:44px}.fp-row .btn{min-height:44px}
.fp-list{padding:0;margin:0}.fp-person{border-top:1px solid var(--line);padding:10px 0}.fp-person h3{margin:2px 0;font-size:1.1rem}
.fp-person p{margin:3px 0;overflow-wrap:anywhere}.fp-reach a{display:inline-block;padding:6px 0}
/* BerryBuyerMatch (5 Nov 2026): Buyers who fit (listing page) and Buyers looking */
.bm-box{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:14px 0}.bm-box h2{margin:0 0 4px}
.bm-list{padding:0;margin:0}.bm-row{border-top:1px solid var(--line);padding:10px 0}.bm-row p{margin:3px 0;overflow-wrap:anywhere}
.bm-called{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:4px 0 0}.bm-pair{display:flex;gap:12px;flex-wrap:wrap}.bm-pair .field{flex:1 1 9rem}
.bm-kinds{border:0;padding:0;margin:8px 0}.bm-kinds label{display:inline-flex;gap:6px;align-items:center;min-height:44px;margin-right:12px}
/* BerryOwnerMondayPage, moved here 5 Nov 2026 (BerryReview5NovFixes F6): an inline <style> is blocked by the CSP (style-src 'self') */
.owner-pipeline-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.owner-pipeline section{margin:16px 0}
.owner-pipeline details{min-width:0;overflow-wrap:anywhere}
.owner-pipeline summary{cursor:pointer;padding:8px 0}
.owner-pipeline li{margin:8px 0}
@media(max-width:600px){.owner-pipeline-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* BerryFeedbackAppraisal (5 Nov 2026): the "OK to share" ticks and the private note on buyer feedback; the Appraisals list and form */
.vu-share{display:flex;margin:0 0 8px}
.vu-private{display:block;margin:2px 0;padding-left:8px;border-left:3px solid var(--line);overflow-wrap:anywhere}
.ap-money{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 12px}
.ap-form fieldset{border:0;padding:0;margin:0;min-width:0}
.ap-table td,.ap-table th{overflow-wrap:anywhere}
@media(max-width:600px){.ap-money{grid-template-columns:1fr}}

/* BerryStopListCallLog (5 Nov 2026): "Log a call" box on contact, enquiry and listing pages; "Calls to make" in My day */
.cl-box { margin: 1.25rem 0; padding: 1rem; border: 1px solid var(--line); border-radius: 8px; }
.cl-form { display: grid; gap: .4rem; max-width: 40rem; }
.cl-f { font-weight: 600; font-size: .95rem; }
.cl-in { width: 100%; box-sizing: border-box; }
.cl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); gap: .5rem; margin-top: .4rem; }
.cl-btn { min-height: 44px; text-align: center; }
.cl-calls li, .cl-day li { margin: .5rem 0; }
.cl-late strong { color: var(--bad); }
/* BerryAgentDeadEnds (5 Nov 2026): Log a call on a phone. Every box at least 44 px tall with 16 px text (iPhone Safari zooms the page in on
   anything smaller); "Call again in" as chips; the date box only once "Pick a date" is chosen (it follows the radios, so :checked ~ shows it). */
.cl-in { display: block; min-height: 44px; font: inherit; font-size: max(16px, 1rem); font-weight: 400; padding: 8px 12px; border: 2px solid var(--line-ui); border-radius: var(--r-sm); background: var(--surface2); color: var(--ink); }
.cl-in:focus { border-color: var(--gold-hi); }
.cl-again { display: flex; flex-wrap: wrap; gap: var(--s2); align-items: center; border: 0; padding: 0; margin: 0; min-width: 0; }
.cl-again legend { padding: 0; margin: 0 0 var(--s2); }
.cl-chip-in { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.cl-chip { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border: 1px solid var(--line-ui); border-radius: 999px; background: var(--surface); color: var(--ink); font-size: max(16px, 1rem); cursor: pointer; transition: border-color var(--dur), background var(--dur); }
.cl-chip:hover { border-color: var(--gold); }
.cl-chip-in:checked + .cl-chip { background: var(--gold); color: var(--on-gold); border-color: var(--gold); font-weight: 600; }
.cl-chip-in:focus-visible + .cl-chip { outline: 2px solid var(--gold-hi); outline-offset: 2px; }
.cl-on { display: none; flex-basis: 100%; }
.cl-chip-in[value="date"]:checked ~ .cl-on { display: grid; gap: var(--s1); }
/* BerryListingWinSmalls (5 Nov 2026): "Possible listing later" and "Referred by" on a person's page, the My day cards (lib/listing-win.js) and
   "Not now: move it" on a call-back. The chips and buttons are the 44 px ones above; a fold's summary and a name link are 44 px too. */
.lw-box { margin: 1.25rem 0; padding: 1rem; border: 1px solid var(--line); border-radius: 8px; }
.lw-form { display: grid; gap: .4rem; max-width: 40rem; }
.lw-acts { display: flex; flex-wrap: wrap; gap: var(--s2); align-items: center; margin: .4rem 0; }
.lw-cards { padding: 0; }
.lw-card { margin: .75rem 0; padding: .75rem; border: 1px solid var(--line); border-radius: 8px; overflow-wrap: anywhere; }
.lw-name, .cl-due a { display: inline-flex; align-items: center; min-height: 44px; }
.lw-more > summary, .cl-snooze > summary { display: flex; align-items: center; gap: 10px; min-height: 44px; cursor: pointer; font-weight: 600; color: var(--gold-hi); }
.lw-more > summary::after, .cl-snooze > summary::after { content: ""; width: 8px; height: 8px; border-right: 2px solid var(--gold); border-bottom: 2px solid var(--gold); transform: rotate(45deg) translate(-2px, -2px); transition: transform var(--dur); }
.lw-more[open] > summary::after, .cl-snooze[open] > summary::after { transform: rotate(-135deg) translate(-2px, -2px); }
.lw-more[open], .cl-snooze[open] { display: grid; gap: var(--s2); flex-basis: 100%; }
.cl-move { display: flex; flex-wrap: wrap; gap: var(--s2); align-items: flex-start; margin: .4rem 0; }
/* BerryAgentDeadEnds: "Under offer needs Graham's OK" and the owner's one-press approval (lib/status-ask.js); "New vendor" on the appraisal form */
.sa-box form { margin: var(--s2) 0; }
.sa-approve { max-width: 40rem; }
.sa-list > li { margin: 0 0 var(--s4); }
/* BerrySalePrice (6 Nov 2026): the sale's three boxes on Mark sold, the ask and the approval, and the sale price page (lib/sale-price.js). 16 px text
   so iPhone Safari does not zoom; every box and button at least 44 px; the record table scrolls inside its own box on a phone. */
.sp-fields { border: 0; padding: 0; margin: 0 0 var(--s3); min-width: 0; max-width: 40rem; }
.sp-fields legend { font-weight: 600; padding: 0; margin: 0 0 6px; }
.sp-fields .field input { font-size: 16px; min-height: 48px; }
.sa-askform { max-width: 40rem; }
.sa-item > p > a { display: inline-flex; align-items: center; min-height: 44px; } /* the listing's address above each ask in Check and approve was 22 px */
.sp-acts { display: flex; flex-wrap: wrap; gap: var(--s2); align-items: center; }
.sp-acts .btn, .sp-acts .btn-ghost, .sp-box .btn-ghost { display: inline-flex; align-items: center; min-height: 44px; }
.sp-trail td, .sp-trail th { white-space: nowrap; }
.sp-trail td:last-child { white-space: normal; min-width: 10em; }
.ap-form .ap-newvendor { margin: var(--s2) 0 var(--s3); }
.ap-form .ap-newvendor legend { font-weight: 600; padding: 0; margin: 0 0 var(--s1); }
/* BerryPastClients (5 Nov 2026): Warm calls' "Bought with Berry" and "Withdrew or went elsewhere" lists, and the milestones line in My day */
.pc-more{margin:0 0 var(--s2)}
.pc-list{padding:0;margin:var(--s2) 0;max-width:46rem}
.pc-row{border-top:1px solid var(--line);padding:12px 0}
.pc-row p{margin:3px 0;overflow-wrap:anywhere}
.pc-tel{display:inline-flex;align-items:center;min-height:44px;padding:0 6px;font-weight:600}
.pc-log>summary{display:inline-flex;align-items:center;min-height:44px;cursor:pointer;margin:4px 0}
.pc-say{color:var(--gold-hi);margin:6px 0}
.pc-day{margin:var(--s2) 0;overflow-wrap:anywhere}
/* BerryAgentStats (5 Nov 2026): Agency stats and My stats (lib/agency-stats-page.js) */
.st-sec{margin:20px 0}
.st-table caption{text-align:left;font-weight:600;padding:4px 0}
.st-table td.st-num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.st-table th[scope=row]{white-space:nowrap}
.st-table tr.st-total th,.st-table tr.st-total td{font-weight:700;border-top:2px solid var(--line)}
.st-tiles{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.st-tiles li{border:1px solid var(--line);border-radius:8px;padding:12px;min-width:0;overflow-wrap:anywhere}
.st-tiles strong{display:block;font-size:1.8rem;line-height:1.1}
.st-tiles span{display:block;font-size:.9rem}
.st-year{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.st-year .btn-ghost{min-height:44px}
/* BerryListingNews (5 Nov 2026): "Tell everyone who asked" on the listing page */
.ln-box{border:1px solid var(--gold);border-radius:12px;padding:12px 14px;margin:14px 0;overflow-wrap:anywhere}.ln-box h2{margin:0 0 4px}
.ln-box.ln-done{border-color:var(--line);padding:6px 14px}
.ln-msg{background:var(--surface2);border-radius:8px;padding:8px 12px;margin:8px 0}
.ln-body{white-space:pre-wrap;font:inherit;margin:6px 0}
.ln-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:8px}.ln-actions form{margin:0}
.ln-list li{margin:4px 0}
.ln-setting{margin-top:10px}
/* BerryPhoneListing (5 Nov 2026): "Add a listing" on one phone screen (lib/phone-listing.js, public/phone-listing.js). Everything is .pl-* */
.pl{padding-bottom:150px}
.pl [hidden]{display:none}
.pl-lead{margin-bottom:12px}
.pl-sec{border-top:1px solid var(--line);padding:12px 0 4px;margin:0}
.pl-sec h2{font-size:1.15rem;margin:0 0 8px}
.pl-copy{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;margin:0 0 8px}.pl-copy .field{flex:1 1 220px;margin:0}
.pl-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.pl-row2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.pl-row .field,.pl-row2 .field{min-width:0}
.pl-sug{display:flex;flex-wrap:wrap;gap:8px;margin:-4px 0 12px}.pl-sug[hidden]{display:none}
.pl-methods{border:0;padding:0;margin:0 0 10px;display:flex;flex-wrap:wrap;gap:8px}
.pl-methods legend{font-weight:600;padding:0;margin-bottom:6px}
.pl-chip{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border:2px solid var(--line-ui);border-radius:999px;background:var(--surface2);font-weight:600}
.pl-chip:has(input:checked){border-color:var(--gold-hi);background:var(--bg2)}
.pl-when[hidden]{display:none}
.pl-hl{margin:-8px 0 12px}
.pl-agents summary{min-height:44px;display:flex;align-items:center;font-weight:600}
html.pl-js .pl-nojs{display:none}
.pl-thumbs{list-style:none;padding:0;margin:8px 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.pl-thumbs li{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:4px;min-width:0}
.pl-thumbs img{grid-column:1/-1;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r-sm)}
.pl-thumbs .pl-n{position:absolute;left:6px;top:6px;background:var(--bg);color:var(--ink);border-radius:999px;padding:0 8px;font-weight:700}
.pl-thumbs .btn-ghost{min-height:44px;padding:0 8px;touch-action:none}
.pl-thumbs .pl-rm{touch-action:auto}
.pl-lift{opacity:.75;outline:3px solid var(--gold-hi)}
.pl-photos{display:flex;flex-wrap:wrap;gap:10px;margin:8px 0}
.pl-pick{position:relative;overflow:hidden;cursor:pointer}
.pl-file{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.pl-need .ws-checks li{margin:4px 0}
.pl-bar{position:sticky;bottom:0;z-index:55;display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center;padding:8px 0 calc(8px + env(safe-area-inset-bottom));background:var(--bg2);border-top:1px solid var(--line-ui)}
.pl-said{grid-column:1/-1;margin:0;font-size:.9rem;overflow-wrap:anywhere}
@media (max-width:859px){.pl-bar{position:fixed;left:0;right:0;bottom:0;padding:8px 16px calc(8px + env(safe-area-inset-bottom))}}
@media (max-width:700px){.pl-bar{bottom:calc(var(--bar-h) + env(safe-area-inset-bottom));padding-bottom:8px}.pl{padding-bottom:calc(var(--bar-h) + 150px)}}
/* ---- BerryKeyFacts (5 Nov 2026, public critique items 7 and 8): the listing's Key facts, the "Request the LIM, title and reports" and
   "Ask for the price guide" buttons (listing page and cards), their request page, and the Key facts boxes in the listing wizard. Tokens only. */
.key-facts{margin:var(--s4) 0}.key-facts>h2{margin-bottom:var(--s2)}
.kf-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--s2);margin:var(--s2) 0 var(--s3)}
.kf-list div{border:1px solid var(--line);border-radius:var(--r-sm);padding:var(--s2) var(--s3);background:var(--surface);min-width:0}
.kf-list dt{color:var(--muted);font-size:var(--t-1)}.kf-list dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.kf-docs{margin:var(--s3) 0 var(--s2)}
.kf-ask{margin:var(--s2) 0 0}.kf-ask .btn,.kf-ask .btn-ghost{width:auto;max-width:100%;white-space:normal;text-align:center}
.card .kf-ask{margin-top:var(--s2)}
html:not([data-cards="big"]) .hits .card .kf-ask .btn-ghost{min-height:44px;padding:0 var(--s3);font-size:var(--t-1)}
.kf-page h1{margin-bottom:var(--s1)}
.kf-ws{border:0;padding:0;margin:var(--s3) 0 0;min-width:0}.kf-ws legend{font-weight:600;padding:0;margin-bottom:6px}
/* BerryAuthorities (5 Nov 2026): the agency agreement tracker (lib/agreements.js): Agreements page, the listing's box and red line, the hand-off warning */
.ag-tiles{list-style:none;padding:0;margin:16px 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.ag-tile{border:1px solid var(--line-ui);border-radius:var(--r);padding:10px 14px;background:var(--surface);display:flex;flex-direction:column}
.ag-tile strong{font-size:1.6rem;line-height:1.1}.ag-tile-expired{border-color:var(--bad);color:var(--bad);background:var(--bad-bg)}.ag-tile-none,.ag-tile-expiring{border-color:var(--warn)}
.ag-notes{padding-left:18px}
.ag-list{list-style:none;padding:0;margin:16px 0;display:grid;gap:14px}
.ag-row{border:1px solid var(--line-ui);border-left:5px solid var(--ok);border-radius:var(--r);padding:12px 16px;background:var(--surface);min-width:0;overflow-wrap:anywhere}
main .ag-row{max-width:none}.ag-row.ag-expired{border-left-color:var(--bad)}.ag-row.ag-none,.ag-row.ag-expiring{border-left-color:var(--warn)}
.ag-head{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:baseline}
.ag-chip{display:inline-block;font-size:var(--t-1);font-weight:700;padding:2px 10px;border-radius:999px;border:1px solid var(--ok);color:var(--ok);background:var(--ok-bg)}
.ag-chip-expired{border-color:var(--bad);color:var(--bad);background:var(--bad-bg)}.ag-chip-none,.ag-chip-expiring{border-color:var(--warn);color:var(--warn);background:var(--warn-bg)}
.ag-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:6px 16px;margin:10px 0}
.ag-facts div{min-width:0}.ag-facts dt{font-size:var(--t-1);color:var(--muted)}.ag-facts dd{margin:0}
.ag-acts{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:flex-end;border-top:1px solid var(--line);padding-top:10px}
.ag-form{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;margin:0}.ag-form .field{margin:0;flex:1 1 160px;min-width:0}
.ag-red{background:var(--bad-bg);border:1px solid var(--bad);color:var(--bad);border-radius:var(--r);padding:10px 14px;margin:10px 0}
.ag-amber,.ag-warn{background:var(--warn-bg);border:1px solid var(--warn);color:var(--warn);border-radius:var(--r);padding:8px 12px;margin:8px 0}
.ag-box{border:1px solid var(--line-ui);border-radius:var(--r);padding:6px 14px;margin:10px 0;background:var(--surface)}
.ag-box summary{min-height:44px;display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;cursor:pointer}
.ag-box .ag-form{margin:8px 0}.ag-hist li{margin:2px 0}

/* ---- BerryPublicFixes (5 Nov 2026), from the public-site critique (kin-research/berry-public-critique/REPORT.md). Tokens only. ---- */
/* item 11: on a phone listing, one fixed bar at a time. While the enquiry bar shows (scrolled past the price, form not on screen), the main
   bottom menu steps aside and the enquiry bar sits at the very bottom; at the top of the page, or at the form, the menu is back. Only with the
   page's script running (it sets data-side and the in-view classes), so without script nothing changes. */
@media (max-width:700px){
html[data-side="hidden"] .has-bar:not(.form-in-view):not(.price-in-view) .side-bar{display:none}
html[data-side="hidden"] .has-bar:not(.form-in-view):not(.price-in-view) .enq-bar{bottom:0;padding-bottom:calc(var(--s2) + env(safe-area-inset-bottom))}
}
/* item 13: large text. Under 30em of screen (a 480 px phone at normal text size, and every phone when the reader's text is twice the size) the
   header, buttons and chips wrap instead of being clipped or pushing the page sideways. */
@media (max-width:30em){
.hdr-in{flex-wrap:wrap;row-gap:var(--s1);min-width:0}
/* BerryLayoutScan (5 Nov 2026): break-word, not anywhere. Both break a word that cannot fit its line, but "anywhere" also lets a flex or grid
   item shrink to one letter wide, so on every phone words broke one letter per line (Will's Buy sort chips "N e w e s t", the bottom bar's
   "Complian ce", "Queenstow n" on a Buy card, "Fak ebu yer" in the inbox). Found by tools/layout-scan.cjs; tests/layout-scan.cjs holds it. */
.hdr-in .btn-sm,.hdr-safety,.chip,.btn,.btn-ghost,.btn-sm,.eb-call,.eb-ask,.eb-view,a.key,.sl{white-space:normal;overflow-wrap:break-word;max-width:100%;text-align:center}
.btn,.btn-ghost,.btn-sm{height:auto;padding-block:var(--s2)}
.logo-wm small{flex-wrap:wrap}
main,.page{overflow-wrap:break-word}
/* the phone's bottom bar has a fixed height: at big text its labels keep to what fits (never under 12 px) and the bar never widens the page */
.side-bar{max-width:100vw;overflow:hidden}
a.key,.side-toggle{min-width:0;font-size:max(12px,min(.78rem,3.9vw))}
a.key{overflow:hidden;min-width:min-content} /* BerryLayoutScan: a key is never narrower than its longest word (the other keys give way) */
.search input,.field input,.field select,.field textarea{min-width:0;max-width:100%}
}
/* the photo credit sat over the hero's first line when text is big on a narrow screen: there it sits in the flow, under the hero */
@media (max-width:22em){.hero-credit{position:static;display:inline-block;margin:var(--s2) var(--s3)}}
/* item 13: link-buttons and inline list links at least 44 px tall; tick boxes with their label a 44 px target */
.btn,.btn-ghost,.btn-sm,.chip,a.btn-ghost.small{min-height:44px}
.oh-list a,.foot-bar a,.foot-g a,.sold-list a{display:inline-flex;align-items:center;min-height:44px}
label:has(>input[type="checkbox"]),label:has(>input[type="radio"]):not(.seg label){display:inline-flex;align-items:center;gap:var(--s2);min-height:44px;padding-block:2px}
input[type="checkbox"],input[type="radio"]{width:24px;height:24px;flex:none}
.seg input[type="radio"]{width:1px;height:1px}
/* item 13: no text under 12 px: the smallest sizes above (.6rem to .72rem: the menu headings, the logo's small lines, badges, the photo credit)
   are now .75rem, which is 12 px at the smallest text setting. tests/public-fixes.cjs fails on any smaller size in this file. */

/* BerryBlindWsFixes (5 Nov 2026), blind critique item 2: the listing page's summary card (lib/listing-card.js), first on the page. On a phone the
   photo is full width above the facts; from 601 px it sits beside them. Every button and the enquiry fold is a 44 px target. */
.lsc{display:grid;gap:var(--s3);border:1px solid var(--line-ui);border-radius:10px;background:var(--surface);padding:var(--s3);margin:var(--s3) 0;min-width:0}
.lsc-ph{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:8px;background:var(--surface2)}
.lsc-none{display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:1rem}
/* BerryAgentDayFixes (9 Nov 2026, review fix 4): "No photo yet" is a link to the photos step, and a short bar on a phone, not a 4:3 grey box filling the first screen */
a.lsc-none{text-decoration:underline;font-weight:600;color:var(--ink,inherit)}
@media (max-width:600px){.lsc-none{aspect-ratio:auto;min-height:56px}}
.ws-draftbar{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;justify-content:space-between}.ws-draftbar form{margin:0}.ws-draftbar p{margin:0;flex:1 1 18rem}
.lsc-draft{margin-left:.25rem}
.wl-filter{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;margin:var(--s2) 0}.wl-filter input,.wl-filter select,.wl-filter .btn-ghost{min-height:44px;font-size:1rem} /* BerryAgentDayFixes fix 8: Listings search and agent filter, 44 px targets */
.lsc-b{min-width:0}
.lsc-price{font-size:1.25rem;font-weight:700;margin:0 0 var(--s2)}
.lsc-facts{display:grid;gap:var(--s2);margin:0 0 var(--s3)}
.lsc-facts>div{display:grid;grid-template-columns:8.5em 1fr;gap:var(--s2);align-items:start}
.lsc-facts dt{color:var(--muted);font-size:1rem}
.lsc-facts dd{margin:0;font-size:1rem;min-width:0;overflow-wrap:anywhere}
.lsc-enq summary{min-height:44px;display:inline-flex;align-items:center;cursor:pointer}
.lsc-enq ul{margin:var(--s1) 0 0}
.lsc-enq li a{display:inline-flex;align-items:center;min-height:44px}
.lsc-acts{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2)}
.lsc-acts form{margin:0;display:contents}
.lsc-acts .btn-ghost{min-height:44px;width:100%;justify-content:center;text-align:center;font-size:1rem}
@media (min-width:601px){.lsc{grid-template-columns:minmax(0,320px) minmax(0,1fr);align-items:start}.lsc-acts{display:flex;flex-wrap:wrap}.lsc-acts .btn-ghost{width:auto}}
/* BerryBlindWsFixes item 10: the owner's "Needs you", one row per thing with its own Approve or Open button (lib/focus.js ownerHome) */
.ndy-list{display:grid;gap:var(--s2);margin:var(--s2) 0}
.ndy-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s2);padding:var(--s2) 0;border-top:1px solid var(--line)}
.ndy-t{display:grid;gap:2px;min-width:0;flex:1 1 14em;overflow-wrap:anywhere}
.ndy-go{min-height:44px;font-size:1rem}
.ndy-row form{margin:0}
/* BerryBlindWsFixes item 3: the owner's phone approval page (lib/owner-review.js) */
.rvw-diff{list-style:none;padding:0;margin:var(--s2) 0;display:grid;gap:var(--s3)}
.rvw-diff li{border:1px solid var(--line-ui);border-radius:8px;padding:var(--s3);background:var(--surface);min-width:0;overflow-wrap:anywhere}
.rvw-diff h3{margin:0 0 var(--s2);font-size:1rem}
.rvw-diff p{margin:var(--s1) 0}
.rvw-k{display:block;font-size:.875rem;color:var(--muted)}
.rvw-diff del{background:var(--bad-bg);color:var(--bad)}
.rvw-diff ins{background:var(--ok-bg);color:var(--ok);text-decoration:none}
.rvw-form .field input{font-size:16px;min-height:44px}
.rvw-go{min-height:48px;font-size:1.0625rem;width:100%}
@media (min-width:601px){.rvw-go{width:auto}}
/* BerryBlindWsFixes item 6: the Inbox, one compact row per person (lib/inbox-rows.js): name and age, the listing, the first line; Call and Text
   are 44 px targets at the right; on a phone the actions sit under the text */
.ibx-list{display:grid;gap:0;margin:var(--s2) 0;border-top:1px solid var(--line)}
.ibx-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px var(--s2);align-items:center;padding:var(--s2) 0;border-bottom:1px solid var(--line);border-left:4px solid transparent;padding-left:var(--s2)}
.ibx-row[data-m="you"]{border-left-color:var(--m-you-line)}
.ibx-main{display:grid;gap:1px;min-width:0;min-height:44px;color:inherit;text-decoration:none}
/* BerryLayoutScan (5 Nov 2026): the phone rule for plain link lists (.ws .plain li>a:first-child{display:inline-flex}) turned each inbox row
   into three squeezed columns ("Fak ebu yer"); the row stays a stack of lines */
.ws .plain .ibx-row>a.ibx-main{display:grid;align-items:stretch}
.ibx-main:hover .ibx-name,.ibx-main:focus-visible .ibx-name{text-decoration:underline}
.ibx-top{display:flex;justify-content:space-between;gap:var(--s2);min-width:0}
.ibx-name{min-width:0;overflow-wrap:anywhere}
.ibx-age{flex:none;color:var(--muted);font-size:.875rem}
.ibx-sub,.ibx-msg{font-size:.9375rem;min-width:0;overflow-wrap:anywhere} /* the first line is cut on the server (lib/inbox-rows.js FIRST_LINE), never by CSS */
.ibx-sub{color:var(--muted)}
.ibx-acts{display:flex;gap:var(--s1)}
.ibx-act{min-height:44px;min-width:56px;justify-content:center}
.ibx-more{grid-column:1/-1;font-size:.9375rem}
.ibx-more summary{min-height:44px;display:inline-flex;align-items:center;cursor:pointer}
.ibx-more li a{display:inline-flex;align-items:center;min-height:44px}
@media (max-width:480px){.ibx-row{grid-template-columns:minmax(0,1fr)}.ibx-acts:not(:empty){padding-top:var(--s1)}}
/* BerryBlindWsFixes item 7: reply templates above the reply box; Call and Text side by side */
.rpl-tpl{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s1);margin:var(--s2) 0}
.rpl-tpl-h{color:var(--muted);font-size:1rem;margin-right:var(--s1)}
.cl-reach{display:flex;flex-wrap:wrap;gap:var(--s2)}
/* BerryBlindWsFixes item 14: People (lib/people.js) */
.ppl-search{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--s2);margin:var(--s2) 0}
.ppl-search .field{flex:1 1 16em;margin:0}
.ppl-search input{font-size:16px;min-height:44px}
.ppl-list{border-top:1px solid var(--line);margin:var(--s2) 0}
.ppl-row{display:flex;justify-content:space-between;align-items:center;gap:var(--s2);padding:var(--s1) 0;border-bottom:1px solid var(--line)}
.ppl-name{display:grid;min-height:44px;align-content:center;min-width:0;overflow-wrap:anywhere}
.ppl-call{min-height:44px;flex:none}
/* BerryContactsCapture: People on a phone broke names one letter per line (Call was 100% wide) */
.ws .plain li.ppl-row>a.ppl-name{display:grid;flex:1 1 auto}
.ppl-row .ppl-call{width:auto}
.ppl-tl-list li{padding:var(--s2) 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
/* BerryBlindWsFixes item 15: My day's quick add (What, Day, Time, Add); the rest folded under More (lib/day.js) */
.dqa{display:grid;gap:var(--s2)}
.dqa .field input,.dqa .field select{font-size:16px;min-height:44px}
.dqa-when{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2)}.dqa-when input,.dqa-when select{width:100%;min-width:0} /* BerryLayoutScan (5 Nov 2026): 1fr could not shrink below a date box, so "Add to my diary" ran 37 px off a 320 px phone */
.dqa-add{min-height:44px;justify-self:start}
.dqa-more summary{min-height:44px;display:inline-flex;align-items:center;cursor:pointer}
.dqa-more[open]{display:grid;gap:var(--s2)}
/* BerryOurEffect (5 Nov 2026): Before Berry and since Berry (lib/our-effect-page.js). A row a measure, a column a side; on a phone each row is a card. */
.oe-table caption{text-align:left;font-weight:600;padding:4px 0}
.oe-table th[scope=row]{min-width:12em}
.oe-how,.oe-per,.oe-n,.oe-why{display:block;font-weight:400;font-size:var(--t-1);color:var(--muted)}
.oe-table td strong{display:block;font-variant-numeric:tabular-nums}
.oe-few{display:block;font-weight:600}
.oe-table a,.oe-actions a,.oe-link a{display:inline-flex;align-items:center;min-height:44px}
.oe-note{margin:12px 0}
.oe-notes li{margin:0 0 6px}
@media (max-width:640px){
  .oe-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .oe-table,.oe-table caption,.oe-table tbody,.oe-table tr,.oe-table th,.oe-table td{display:block;width:auto;min-width:0} /* a caption left as table-caption shrank to one word a line */
  .oe-table tr{border:1px solid var(--line-ui);border-radius:8px;padding:8px 12px;margin:0 0 12px}
  .oe-table th[scope=row],.oe-table td{border:0;padding:6px 0}
  .oe-table td::before{content:attr(data-label);display:block;font-size:var(--t-1);font-weight:600;color:var(--ink)}
}
/* BerryListingWin2 (5 Nov 2026): other agencies' listings (lib/agency-watch.js), the written appraisal (lib/written-appraisal.js), the "We have a
   buyer" letter (lib/buyer-letter.js) and the past-client check-ins (lib/warm-calls-lists.js). Chips, buttons and cards are the 44 px lw-* and cl-* ones. */
.ow-rules{margin:var(--s2) 0;padding-left:1.2rem;max-width:46rem}
.ow-rules li{margin:4px 0}
.ow-stand{margin:var(--s1) 0}
.ow-new>summary{display:flex;align-items:center;min-height:44px;cursor:pointer;font-weight:600}
.wa-comps{padding:0;margin:var(--s1) 0}
.wa-comp{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;padding:var(--s1) 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
.wa-ok{color:var(--ok)}
.wa-link{display:inline-flex;align-items:center;min-height:44px}
.bl-acts{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center}
.bl-letter{max-width:40rem;margin:var(--s3) 0;padding:var(--s4);border:1px solid var(--line);border-radius:8px;background:var(--surface);overflow-wrap:anywhere}
.bl-from{text-align:right}
@media print{.bl-noprint{display:none!important}body:has(.bl-noprint) .notice{display:none!important}.bl-letter{border:0;padding:0;margin:0;max-width:none;background:none;color:inherit}}
/* BerryEditConflicts (5 Nov 2026): "someone else changed this listing after you opened it" (lib/edit-conflicts.js box, public/phone-listing.js).
   No new colours: it is a .notice. On a phone each row is a card: the box's name, then Yours and Now under it. */
.ec-box{margin:var(--s3) 0}.ec-box h2{margin-top:0}
.ec-diff{border-collapse:collapse;width:100%;table-layout:fixed;margin:var(--s2) 0}.ec-diff caption{text-align:start;font-weight:600;padding:0 0 var(--s1)}
.ec-diff th,.ec-diff td{border:1px solid var(--warn);padding:var(--s2);vertical-align:top;text-align:start;overflow-wrap:break-word}
.ec-diff mark{background:transparent;color:inherit;font-weight:700;text-decoration:underline;text-decoration-thickness:2px}
.ec-acts{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s3);margin:var(--s3) 0}.ec-acts form{margin:0}.ec-acts .btn,.ec-acts .btn-ghost{min-height:44px;width:auto}
@media (max-width:600px){.ec-diff thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .ec-diff,.ec-diff caption,.ec-diff tbody,.ec-diff tr,.ec-diff th,.ec-diff td{display:block}.ec-diff tr{margin:0 0 var(--s2)}.ec-diff td:before{content:attr(data-label);display:block;font-weight:600}}
/* BerryTradeMeRelist (6 Nov 2026): "Trade Me advert closes in N days" in My day (lib/trademe-relist-ws.js). The listing's address is a 44 px tap target; the Relist form sits on its own line. */
.tm-row > p > a{display:inline-flex;align-items:center;min-height:44px}
.tm-act{margin:var(--s2) 0}.tm-act .btn,.tm-act .btn-ghost{min-height:44px;width:auto}

[data-theme=light] a:hover,[data-theme=warm] a:hover,[data-theme=light] .btn-ghost:hover,[data-theme=warm] .btn-ghost:hover{color:var(--ink)}
html[data-theme="light"] .hdr{background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(8px)}
html[data-theme="light"] .card,html[data-theme="light"] .jl-a{border-color:var(--line)}
html[data-theme="light"] .hero:not(.hero-photo){background:var(--bg)}
.theme-pick{display:inline-flex;align-items:center;gap:2px;padding:2px;border:1px solid var(--line);border-radius:999px;background:var(--surface)}
.theme-opt{display:inline-flex;align-items:center;gap:6px;min-height:44px;min-width:44px;padding:0 12px;border-radius:999px;color:var(--ink);text-decoration:none;font-size:var(--t-1);font-weight:600}
.theme-opt:hover{background:var(--surface2);color:var(--ink)}
.theme-opt[aria-current="true"]{background:var(--surface2);box-shadow:inset 0 0 0 1px var(--gold)}
.theme-opt::before{content:"";width:14px;height:14px;border-radius:50%;border:1px solid var(--line-ui);flex:0 0 auto}
.to-light::before{background:var(--sw-light)}.to-warm::before{background:var(--sw-warm)}.to-dark::before{background:var(--sw-dark)}
.hdr-in .theme-pick{margin-left:auto}
.hdr-in .theme-pick+.btn-sm,.hdr-in .theme-pick~.hdr-ws{margin-left:0}
.theme-pick-foot{display:none;margin:var(--s2) 0}
.theme-pick-l{padding:0 var(--s2);font-size:var(--t-1);color:var(--muted)}
@media (max-width:700px){.theme-pick-hdr{display:none}.theme-pick-foot{display:inline-flex}.hdr-in .btn-sm{margin-left:auto}}
@media (max-width:1000px){.theme-pick-hdr .theme-opt span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.theme-pick-hdr .theme-opt{padding:0;justify-content:center}.theme-pick-hdr .theme-opt::before{width:18px;height:18px}}

.jr-home{padding-block:var(--s6) var(--s4)}
.jr-cards{display:grid;gap:var(--s4);grid-template-columns:repeat(2,minmax(0,1fr))}
.jr-card{display:flex;flex-direction:column;gap:var(--s2);padding:var(--s5);border:1px solid var(--line);border-radius:var(--r);background:var(--surface);color:var(--ink);text-decoration:none;box-shadow:var(--shadow);transition:border-color var(--dur)}
.jr-card:hover{border-color:var(--gold);color:var(--ink)}
.jr-card strong{font:600 var(--t2)/1.2 var(--serif)}
.jr-card .small{color:var(--muted)}
.jr-card-k{font-size:var(--t-1);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-hi);font-weight:700}
.jr-go{align-self:flex-start;margin-top:var(--s2);display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:999px;background:var(--green);color:var(--on-green);font-weight:600}
.jr-go::after{content:" \2192";margin-left:6px}
.home-more .fold{background:transparent}
.home-more .fold-b>.block:first-child{padding-top:0}
main>.wrap.block+.wrap.block{margin-top:var(--s3)}
.desc-more{margin:var(--s2) 0}
.desc-more>summary{display:inline-flex;align-items:center;min-height:44px;cursor:pointer;color:var(--gold-hi);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.desc-more[open]>summary{margin-bottom:var(--s2)}

@media (max-width:700px){
.jr-cards{grid-template-columns:none}
.jr-card{padding:var(--s4)}
.jr-home{padding-block:var(--s4) var(--s3)}
}
.theme-pick-side{display:none;margin:var(--s2) var(--s2) 0}
html[data-side="full"] .theme-pick-side{display:inline-flex}
html[data-side="full"] .theme-pick-side{width:calc(100% - 2 * var(--s2));box-sizing:border-box}
html[data-side="full"] .theme-pick-side .theme-opt{flex:1 1 0;justify-content:center;gap:4px;padding:0 4px;min-width:0}
@media (max-width:700px){html[data-side="full"] .theme-pick-side{display:inline-flex}}
.theme-pick-foot{max-width:100%;flex-wrap:wrap;box-sizing:border-box}
.theme-pick-foot .theme-opt{padding:0 8px}
@media (max-width:360px){.theme-pick-l{display:none}}
/*BerryThemeContrast: footer cards, Share field*/
.foot-groups{gap:var(--s3);align-items:start}
.foot-g{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:var(--s2) var(--s3) var(--s3);min-width:0}
@media (max-width:1099px){.foot-groups{gap:var(--s2);border-top:0}.foot-g{padding:0 var(--s3)}}
.share-url{background:var(--surface);color:var(--ink);border:1px solid var(--muted);border-radius:var(--r-sm);padding:8px 10px;min-height:44px;max-width:100%}
/* BerryFlowStyle: Still / Flow (lib/flow-style.js) */
[data-style-set=flow]::before{background:linear-gradient(135deg,var(--m-info-line),var(--m-you-line),var(--gold))}
.style-pick.theme-pick-foot{display:inline-flex}.theme-pick-foot:not(.style-pick){margin-right:var(--s2)}
/* BerryFontChoice: Font (lib/font-choice.js) beside Style; no swatch, the words say it */
.font-pick.theme-pick-foot{display:inline-flex}.font-pick .theme-opt::before{display:none}
/* BerryFonts (6 Nov 2026, Natalie): Lora for headings (here "Berry Serif": Lora reserves its name), Figtree for text; SIL OFL 1.1, public/fonts/. The "fb" faces are local fonts sized to match, so the swap barely moves the page */
@font-face{font-family:Berry Serif;src:url(/fonts/berry-serif-700.woff2)format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:Figtree;src:url(/fonts/figtree.woff2)format("woff2");font-weight:300 900;font-display:swap}
@font-face{font-family:Lora fb;src:local("Georgia Bold"),local(Georgia-Bold);font-weight:100 900;size-adjust:93.2%;ascent-override:107.9%;descent-override:29.4%;line-gap-override:0%}
@font-face{font-family:Figtree fb;src:local(Arial),local(ArialMT);font-weight:100 549;size-adjust:100.6%;ascent-override:94.4%;descent-override:24.9%;line-gap-override:0%}
@font-face{font-family:Figtree fb;src:local("Arial Bold"),local(Arial-BoldMT);font-weight:550 900;size-adjust:96.2%;ascent-override:98.8%;descent-override:26%;line-gap-override:0%}
h1,h2{letter-spacing:-.01em}
/* BerryMapsQuiet: the listing's closed Maps button (lib/map-prominence.js) */
.maps-q{margin:var(--s3) 0}.maps-q>summary{list-style:none;cursor:pointer;width:max-content}.maps-q>summary::-webkit-details-marker{display:none}
.maps-b{margin-top:var(--s2);padding:var(--s3);border:1px solid var(--line);border-radius:var(--r);background:var(--bg2)}.maps-b h3{margin:var(--s3) 0 var(--s1)}
.maps-links{margin:0}.maps-links li{min-height:44px;display:flex;align-items:center}.maps-go{display:flex;flex-wrap:wrap;gap:var(--s2)}.mini-map iframe{display:block;width:100%;height:min(72vh,560px);border:1px solid var(--line);border-radius:var(--r);margin-top:var(--s2)}
/* BerryStarkBlackTheme: the one-time light-look hint (public/app.js) */
.theme-hint{display:flex;align-items:center;gap:var(--s1);margin:0 0 0 var(--s2);font-size:var(--t-1)} /* BerryPublicFixes1: in the header row, in flow */
.theme-hint-t{font-weight:600}.theme-hint-space{display:block;flex:none}
.theme-hint-go{min-height:44px;padding:0 var(--s2);border:0;border-radius:999px;background:var(--gold);color:var(--on-gold);font:700 var(--t-1) var(--sans);cursor:pointer}
.theme-hint-x{flex:none;min-width:44px;min-height:44px;border:0;background:transparent;color:var(--ink);font:400 1.25rem/1 var(--sans);cursor:pointer}
@media (max-width:700px){.hdr-in:has(.theme-hint,.theme-hint-space){flex-wrap:wrap;row-gap:0}.theme-hint{flex-basis:100%;margin:0}html[data-hint-due] .hdr:not(.hdr-staff) .hdr-in{padding-bottom:calc(var(--s2) + 44px)}html[data-hint-due] .hdr:not(.hdr-staff),.hdr:has(.theme-hint,.theme-hint-space){position:static}}
.theme-hint-side{flex-wrap:wrap;gap:2px 4px;margin:var(--s1) 0}.theme-hint-side .theme-hint-t{flex-basis:100%}.theme-hint-side .theme-hint-go{padding:0 10px;font-size:.85rem}
@media (prefers-reduced-motion:no-preference){html:not([data-motion="reduce"]) .theme-hint{animation:theme-hint-in .2s ease-out}}
@keyframes theme-hint-in{from{opacity:0}}
@media print{.theme-hint{display:none}}
/* ---- BerryPhoneHeroCards (9 Nov 2026, Will's phone screenshots: "ELEVATE" cut to "E L E V A T", "Kal", "YA", "ab"). The agents' photos are
   their artwork and are never edited. 1) A focal point per photo (lib/photo-focus.js puts fx-NN fy-NN on the <img>; no inline style, the CSP is
   style-src 'self'): every cropped photo box keeps that spot in view. 2) Up to 600 px a listing card stacks: the whole photo full width at its
   own shape (the <img>'s width and height give the box its shape before the file arrives: no layout shift), then price, address, chips, facts.
   Kept above the BerryGoldAndBlack block, which must stay last (tests/gold-and-black.cjs M6 reads it to the end of the file). */
.card-pic img,.gallery img,.ws-photos img,.jl-pic img,.lsc-ph,.pf-prev img{object-position:var(--fx,50%) var(--fy,50%)}
.fx-0{--fx:0%}.fx-5{--fx:5%}.fx-10{--fx:10%}.fx-15{--fx:15%}.fx-20{--fx:20%}.fx-25{--fx:25%}.fx-30{--fx:30%}.fx-35{--fx:35%}.fx-40{--fx:40%}.fx-45{--fx:45%}.fx-50{--fx:50%}
.fx-55{--fx:55%}.fx-60{--fx:60%}.fx-65{--fx:65%}.fx-70{--fx:70%}.fx-75{--fx:75%}.fx-80{--fx:80%}.fx-85{--fx:85%}.fx-90{--fx:90%}.fx-95{--fx:95%}.fx-100{--fx:100%}
.fy-0{--fy:0%}.fy-5{--fy:5%}.fy-10{--fy:10%}.fy-15{--fy:15%}.fy-20{--fy:20%}.fy-25{--fy:25%}.fy-30{--fy:30%}.fy-35{--fy:35%}.fy-40{--fy:40%}.fy-45{--fy:45%}.fy-50{--fy:50%}
.fy-55{--fy:55%}.fy-60{--fy:60%}.fy-65{--fy:65%}.fy-70{--fy:70%}.fy-75{--fy:75%}.fy-80{--fy:80%}.fy-85{--fy:85%}.fy-90{--fy:90%}.fy-95{--fy:95%}.fy-100{--fy:100%}
@media (max-width:600px){
.card-pic:has(img){display:block;aspect-ratio:auto}
.card-pic:has(img) img{position:static;width:100%;height:auto;max-height:min(125vw,78vh);object-fit:contain}
html:not([data-cards="big"]) .hits .card{flex-direction:column}
html:not([data-cards="big"]) .hits .card-pic{flex:none;max-width:none;min-height:0;border-right:0;border-bottom:1px solid var(--line)}
html:not([data-cards="big"]) .hits .card-pic:not(:has(img)){aspect-ratio:3/2}
html:not([data-cards="big"]) .hits .card-body{padding:var(--s3);gap:var(--s1)}
html:not([data-cards="big"]) .hits .card .price{font-size:var(--t1)}
html.js .viewtog{display:none}
}
/* BerryListingCardArt */
.card-art{display:contents}
/* BerryAuditRound1 */
@media (max-width:700px){.hdr-in .theme-pick-hdr+.btn-sm{margin-left:auto}}
@media (min-width:701px){.hdr:not(.hdr-staff) .hdr-in a:is(.hdr-ws,.hdr-acct){background:none;box-shadow:none;color:var(--ink);font-weight:600;padding:0 var(--s2);text-decoration:underline var(--line-ui);text-underline-offset:.3em}.hdr:not(.hdr-staff) .hdr-in a:is(.hdr-ws,.hdr-acct):hover{color:var(--gold);filter:none}}
/* BerryGoldAndBlack: gloss and gold sheen, the black look only; colours and images only, so nothing moves (DECISIONS.md) */
html:not([data-theme=light],[data-theme=warm],[data-contrast=high]){
& .hdr{background-image:var(--gloss-black);box-shadow:var(--gloss-edge);border-image:var(--gold-rule) 1}
& .hero{border-image:var(--gold-rule) 1}
& .btn:not(.btn-ghost,.btn-alt,.btn-call,.btn-danger,.btn-emerg){background-image:var(--gloss-btn);border-color:var(--gloss-btn-line);box-shadow:var(--gloss-edge)}
& .btn:not(.btn-ghost,.btn-alt,.btn-call,.btn-danger,.btn-emerg):hover{background-image:var(--gloss-btn-hi);border-color:var(--gold)}
& :is(.btn-alt,.btn-sm,.btn-call,.theme-hint-go,.logo-mark:not([data-wm])){background-image:var(--gold-sheen);box-shadow:var(--gold-edge)}
& :is(.btn-alt,.btn-sm,.btn-call,.theme-hint-go):hover{filter:brightness(1.07)}
& .logo-mark[data-wm]{background-image:var(--gold-sheen-text)}
& .logo-wm:hover .logo-mark[data-wm]{background-image:none}
& .card:hover{background-image:var(--gloss-black);box-shadow:var(--gloss-edge),var(--shadow)}}
@media (forced-colors:active){.hdr,.hero{border-image:none}}