:root{
  --bg:#F3F6F5;--surface:#FFFFFF;--surface-2:#E9EFED;--ink:#13293D;--muted:#55687A;--line:#D6E0DD;
  --brand:#0F5E57;--on-brand:#FFFFFF;--key:#F3B21B;--on-key:#2A1F00;--ok:#1D8A55;--danger:#B93A2E;--focus:#2A7DE1;
  --map-land:#CFDCD8;--map-line:#FFFFFF;--hero:#0F5E57;
  --shadow:0 1px 2px rgba(19,41,61,.06),0 8px 24px rgba(19,41,61,.07);
  box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0E171D;--surface:#15222B;--surface-2:#1C2D38;--ink:#E6EEF1;--muted:#9AABB6;--line:#2A3D49;
  --brand:#2FA897;--on-brand:#03201C;--ok:#4CC28A;--danger:#E8776B;--focus:#6AA8F5;--map-land:#2A3E4A;--map-line:#15222B;--hero:#0B3F3A;--shadow:none;color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0E171D;--surface:#15222B;--surface-2:#1C2D38;--ink:#E6EEF1;--muted:#9AABB6;--line:#2A3D49;
  --brand:#2FA897;--on-brand:#03201C;--ok:#4CC28A;--danger:#E8776B;--focus:#6AA8F5;--map-land:#2A3E4A;--map-line:#15222B;--hero:#0B3F3A;--shadow:none;color-scheme:dark}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 Figtree,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:"Bricolage Grotesque",Figtree,system-ui,sans-serif;line-height:1.12;letter-spacing:-.012em;margin:0;font-weight:700}
p{margin:0}
img{max-width:100%;display:block}
a{color:var(--brand)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.wrap{max-width:1180px;margin:0 auto;padding-left:20px;padding-right:20px}
.muted{color:var(--muted)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
svg.i{width:18px;height:18px;flex:none;vertical-align:-3px}

/* header */
header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:var(--surface);border-bottom:1px solid var(--line)}
.hdr{display:flex;align-items:center;gap:18px;height:64px}
.logo{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink);font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:1.15rem;letter-spacing:-.02em;white-space:nowrap}
.logo .mark{width:34px;height:34px;border-radius:10px;background:var(--brand);display:grid;place-items:center;flex:none}
.logo small{font-weight:600;color:var(--muted);font-size:.9em}
nav.main{display:flex;gap:2px}
nav.main a{padding:8px 11px;border-radius:999px;text-decoration:none;color:var(--muted);font-weight:600;font-size:.93rem;white-space:nowrap}
nav.main a:hover{color:var(--ink);background:var(--surface-2)}
nav.main a[aria-current="page"]{color:var(--brand);background:var(--surface-2)}
.hdr-actions{margin-left:auto;display:flex;align-items:center;gap:8px}
.ctysel{width:auto;max-width:170px;min-height:38px!important;padding:6px 8px!important;border-radius:999px!important;font-size:.88rem;font-weight:600;background:var(--surface-2)!important;border-color:transparent!important}
.avatar{width:38px;height:38px;border-radius:50%;background:var(--surface-2);color:var(--ink);display:grid;place-items:center;font-weight:700;text-decoration:none;border:1px solid var(--line);font-size:.9rem;flex:none}
.iconlink{position:relative;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--ink);text-decoration:none}
.iconlink:hover{background:var(--surface-2)}
.dot{position:absolute;top:2px;right:0;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#D23B5B;color:#fff;font-size:.7rem;font-weight:700;display:grid;place-items:center;line-height:1}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:10px;border:1px solid transparent;font-weight:600;text-decoration:none;font-size:.95rem;line-height:1.2;background:var(--surface-2);color:var(--ink);white-space:nowrap}
.btn:hover{filter:brightness(.97)}
.btn-primary{background:var(--brand);color:var(--on-brand)}
.btn-key{background:var(--key);color:var(--on-key)}
.btn-ghost{background:transparent;border-color:var(--line)}
.btn-danger{background:transparent;color:var(--danger);border-color:var(--line)}
.btn-sm{padding:7px 11px;font-size:.87rem;border-radius:8px}
.btn-lg{padding:14px 22px;font-size:1.02rem}
.btn-block{width:100%}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.linkbtn{background:none;border:0;padding:0;color:var(--brand);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* hero */
.hero{background:var(--hero);color:#fff;padding:52px 0 92px}
.hero h1{font-size:clamp(2.1rem,5.4vw,4rem);font-weight:800;max-width:16ch;letter-spacing:-.025em}
.hero p{margin-top:16px;font-size:1.12rem;max-width:54ch;opacity:.88}
.search{background:var(--surface);color:var(--ink);border-radius:18px;padding:14px;box-shadow:0 18px 50px rgba(0,0,0,.18);margin-top:-58px;position:relative;z-index:2}
.seg{display:inline-flex;background:var(--surface-2);border-radius:12px;padding:4px;gap:2px;flex-wrap:wrap}
.seg label{position:relative}
.seg input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.seg span{display:block;padding:8px 14px;border-radius:9px;font-weight:600;font-size:.93rem;color:var(--muted)}
.seg label:has(input:checked) span{background:var(--surface);color:var(--ink);box-shadow:var(--shadow)}
.seg label:has(input:focus-visible) span{outline:3px solid var(--focus)}
.search-row{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr auto;gap:10px;margin-top:12px}
@media (max-width:860px){.search-row{grid-template-columns:1fr 1fr}.search-row .q,.search-row button{grid-column:1/-1}}

/* scope tabs */
.scope{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;margin:4px 0 18px;scrollbar-width:none}
.scope a{padding:8px 14px;border-radius:999px;border:1px solid var(--line);text-decoration:none;color:var(--ink);font-weight:600;font-size:.92rem;white-space:nowrap;background:var(--surface)}
.scope a[aria-current="page"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}

/* sections */
section.block{padding:44px 0 8px}
.sec-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:18px}
.sec-head h2{font-size:clamp(1.45rem,2.6vw,1.9rem)}
.sec-head a{font-weight:600;text-decoration:none;white-space:nowrap}

/* listing cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;color:var(--ink);position:relative}
.card:hover{border-color:var(--brand)}
.card.feat{border:2px solid var(--key)}
.ph{aspect-ratio:4/3;position:relative;background:var(--surface-2);overflow:hidden}
.ph img{width:100%;height:100%;object-fit:cover}
.tag{position:absolute;left:12px;bottom:12px;background:var(--key);color:var(--on-key);font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:1.04rem;padding:5px 12px 5px 24px;border-radius:4px 11px 11px 4px;box-shadow:0 2px 8px rgba(0,0,0,.22)}
.tag::before{content:"";position:absolute;left:9px;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;border:2px solid var(--on-key);opacity:.6}
.tag small{font-family:Figtree,sans-serif;font-weight:600;font-size:.72rem;opacity:.8}
.pills{position:absolute;left:12px;top:12px;display:flex;gap:6px;flex-wrap:wrap;right:56px}
.purpose{background:rgba(255,255,255,.94);color:#13293D;font-size:.78rem;font-weight:700;padding:4px 9px;border-radius:999px}
.purpose.sale{background:#13293D;color:#fff}
.purpose.short{background:#3B2A7A;color:#fff}
.purpose.featured{background:var(--key);color:var(--on-key)}
.fav{position:absolute;right:10px;top:10px;width:36px;height:36px;border-radius:50%;border:0;background:rgba(255,255,255,.94);color:#13293D;display:grid;place-items:center;z-index:2}
.fav[aria-pressed="true"]{color:#D23B5B}
.fav[aria-pressed="true"] svg path{fill:currentColor}
.statusflag{position:absolute;right:12px;bottom:12px;background:var(--danger);color:#fff;font-size:.75rem;font-weight:700;padding:3px 8px;border-radius:6px}
.card-body{padding:13px 15px 15px;display:flex;flex-direction:column;gap:6px;flex:1}
.card-title{font-weight:600;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:inherit;text-decoration:none}
.card-title::after{content:"";position:absolute;inset:0}
.loc{color:var(--muted);font-size:.9rem;display:flex;gap:5px;align-items:center}
.facts{display:flex;flex-wrap:wrap;gap:12px;font-size:.88rem;color:var(--muted);margin-top:auto;padding-top:6px}
.facts span{display:inline-flex;gap:5px;align-items:center}
.who{display:flex;align-items:center;gap:6px;font-size:.85rem;color:var(--muted);border-top:1px solid var(--line);padding-top:9px;margin-top:4px}
.vbadge{display:inline-flex;align-items:center;gap:3px;color:var(--brand);font-weight:700;font-size:.8rem}
.vbadge svg{width:16px;height:16px}

/* requirement cards */
.req{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 16px 14px;display:flex;flex-direction:column;gap:9px;color:var(--ink);text-decoration:none}
.req:hover{border-color:var(--brand)}
.req.feat{border:2px solid var(--key)}
.req-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.chip-sm{font-size:.78rem;font-weight:700;padding:4px 9px;border-radius:999px;background:var(--surface-2);color:var(--ink);display:inline-block}
.chip-sm.want{background:var(--key);color:var(--on-key)}
.req h3{font-size:1.15rem}
.budget{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:1.25rem;color:var(--brand)}
.req ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.req li{font-size:.83rem;background:var(--surface-2);padding:3px 8px;border-radius:6px}

/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.step{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:20px}
.step b{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--brand);color:var(--on-brand);font-family:"Bricolage Grotesque";margin-bottom:10px}
.step h3{font-size:1.1rem;margin-bottom:6px}
.callout{display:flex;gap:18px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:20px;margin-top:18px}
.callout .big{width:52px;height:52px;border-radius:14px;background:var(--surface-2);display:grid;place-items:center;color:var(--brand);flex:none}
@media (max-width:760px){.steps{grid-template-columns:1fr}.callout{flex-direction:column;align-items:flex-start}}

/* browse */
.page{padding-top:26px;padding-bottom:40px}
.page-title{font-size:clamp(1.6rem,3.4vw,2.3rem);margin-bottom:6px}
.browse{display:grid;grid-template-columns:270px 1fr;gap:26px;align-items:start;margin-top:8px}
.filters{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px;position:sticky;top:calc(80px + env(safe-area-inset-top,0px));max-height:calc(100vh - 100px);overflow:auto}
.filters summary.top{display:none}
.filters .field{margin-bottom:12px}
.results-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}
@media (max-width:860px){
  .browse{grid-template-columns:1fr}
  .filters{position:static;padding:0;max-height:none}
  .filters summary.top{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;font-weight:700;cursor:pointer;list-style:none}
  .filters summary.top::-webkit-details-marker{display:none}
  .filters .fbody{padding:0 16px 16px}
}
.empty{background:var(--surface);border:1px dashed var(--line);border-radius:14px;padding:36px 20px;text-align:center}
.empty h3{margin-bottom:6px}
.empty .btn{margin-top:14px}

/* map */
.mapbox{height:440px;border-radius:14px;border:1px solid var(--line);background:var(--surface-2);position:relative;overflow:hidden;margin-bottom:16px}
.mapbox.sm{height:260px}
.mapfallback{padding:20px;height:100%;overflow:auto}
.mapfallback ul{padding-left:18px;margin:10px 0 0}
.maplegend{font-size:.86rem;margin:-6px 0 14px}

/* forms */
.field{display:flex;flex-direction:column;gap:6px}
.field > span{font-weight:600;font-size:.9rem}
.hint{font-size:.82rem;color:var(--muted);font-weight:400}
input[type=text],input[type=email],input[type=password],input[type=tel],input[type=number],input[type=url],input[type=date],input[type=time],select,textarea{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);min-height:44px}
textarea{min-height:130px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--brand);outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 22%,transparent)}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:700px){.g3,.g4{grid-template-columns:1fr 1fr}}
@media (max-width:440px){.g2{grid-template-columns:1fr}}
.formcard{max-width:860px}
fieldset{border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:18px 18px 20px;margin:0 0 18px;display:flex;flex-direction:column;gap:14px;min-width:0}
legend{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:1.12rem;padding:0 6px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.chip span{display:inline-block;padding:7px 12px;border:1px solid var(--line);border-radius:999px;font-size:.88rem;background:var(--surface)}
.chip:has(input:checked) span{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}
.chip:has(input:focus-visible) span{outline:3px solid var(--focus)}
.check{display:flex;gap:9px;align-items:flex-start;font-size:.93rem}
.check input{width:18px;height:18px;margin-top:2px;accent-color:var(--brand);flex:none}
[data-purpose="sale"] .rent-only,[data-purpose="buy"] .rent-only,[data-purpose="rent"] .sale-only{display:none!important}
[data-term="long"] .short-only,[data-term="short"] .long-only{display:none!important}
form:not([data-term="both"]) .both-only{display:none!important}
[data-kind="land"] .res-only,[data-kind="land"] .bld-only,[data-kind="com"] .res-only{display:none!important}
.photos{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
@media (max-width:600px){.photos{grid-template-columns:repeat(3,1fr)}}
.pslot{aspect-ratio:1;border-radius:10px;border:1.5px dashed var(--line);display:grid;place-items:center;position:relative;overflow:hidden;background:var(--surface-2);color:var(--muted);font-size:.8rem;text-align:center}
.pslot img{width:100%;height:100%;object-fit:cover}
.pslot .x{position:absolute;top:5px;right:5px;width:26px;height:26px;border-radius:50%;border:0;background:rgba(0,0,0,.65);color:#fff;font-size:15px;line-height:1}
.pslot .cover{position:absolute;left:5px;bottom:5px;background:var(--key);color:var(--on-key);font-size:.7rem;font-weight:700;padding:2px 6px;border-radius:5px}
.pslot label{position:absolute;inset:0;display:grid;place-items:center;cursor:pointer;padding:6px}
.err{color:var(--danger);font-size:.86rem;font-weight:600}
.okline{color:var(--ok);font-size:.88rem;font-weight:600}
.form-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}

/* auth */
.authbox{max-width:440px;margin:30px auto 50px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:26px}
.authbox h1{font-size:1.75rem;margin-bottom:6px}
.authbox form{display:flex;flex-direction:column;gap:14px;margin-top:20px}
.demo-note{background:color-mix(in srgb,var(--key) 22%,var(--surface));border:1px solid color-mix(in srgb,var(--key) 60%,var(--line));border-radius:12px;padding:12px 14px;font-size:.92rem;margin-top:16px}
.demo-note b.code{font-family:"Bricolage Grotesque";font-size:1.35rem;letter-spacing:.14em;display:block;margin-top:2px}
.codein{font-size:1.5rem!important;letter-spacing:.4em;text-align:center;font-family:"Bricolage Grotesque",sans-serif}

/* detail */
.detail{display:grid;grid-template-columns:1fr 360px;gap:26px;align-items:start;margin-top:16px}
@media (max-width:920px){.detail{grid-template-columns:1fr}}
.gallery .main{aspect-ratio:16/10;border-radius:16px;overflow:hidden;background:var(--surface-2);position:relative}
.gallery .main img{width:100%;height:100%;object-fit:cover}
.thumbs{display:flex;gap:8px;margin-top:10px;overflow-x:auto}
.thumbs button{border:2px solid transparent;padding:0;border-radius:9px;overflow:hidden;width:84px;height:62px;flex:none;background:none}
.thumbs button[aria-current="true"]{border-color:var(--brand)}
.thumbs img{width:100%;height:100%;object-fit:cover}
.d-price{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:clamp(1.8rem,3.6vw,2.4rem);color:var(--ink)}
.d-price small{font-size:.5em;color:var(--muted);font-weight:600}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;margin-top:16px}
.panel h2{font-size:1.2rem;margin-bottom:12px}
.kv{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px 18px;margin:0}
.kv div{border-bottom:1px solid var(--line);padding-bottom:8px}
.kv dt{font-size:.8rem;color:var(--muted)}
.kv dd{margin:2px 0 0;font-weight:600}
.amen{display:flex;flex-wrap:wrap;gap:8px}
.amen span{display:inline-flex;gap:6px;align-items:center;padding:6px 10px;border-radius:8px;background:var(--surface-2);font-size:.88rem}
.desc{white-space:pre-line;max-width:70ch}
.side{position:sticky;top:calc(80px + env(safe-area-inset-top,0px));display:flex;flex-direction:column;gap:14px}
@media (max-width:920px){.side{position:static}}
.contact{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;display:flex;flex-direction:column;gap:12px}
.contact.boost{border:2px solid var(--key)}
.person{display:flex;gap:12px;align-items:center}
.person .avatar{width:48px;height:48px;font-size:1.05rem}
.masked{font-family:"Bricolage Grotesque",sans-serif;font-size:1.25rem;font-weight:700;letter-spacing:.04em;display:flex;align-items:center;gap:8px}
.lockline{font-size:.88rem;color:var(--muted)}
.share{display:flex;flex-wrap:wrap;gap:8px}
.share a,.share button{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;border:1px solid var(--line);background:var(--surface);color:var(--ink);text-decoration:none}
.share a:hover,.share button:hover{border-color:var(--brand);color:var(--brand)}
.videos{display:grid;gap:10px}
.vid{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2)}
.vid .play{width:46px;height:46px;border-radius:12px;background:#E62117;color:#fff;display:grid;place-items:center;flex:none}
.vid a.t{font-weight:600;color:var(--ink);text-decoration:none;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.banner{padding:12px 14px;border-radius:12px;background:color-mix(in srgb,var(--danger) 14%,var(--surface));border:1px solid color-mix(in srgb,var(--danger) 40%,var(--line));font-weight:600;margin-top:14px}
.crumbs{font-size:.9rem;color:var(--muted)}
.crumbs a{color:var(--muted)}

/* account */
.tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);margin:18px 0 22px;overflow-x:auto}
.tabs a{padding:10px 14px;text-decoration:none;color:var(--muted);font-weight:600;border-bottom:3px solid transparent;white-space:nowrap}
.tabs a[aria-current="page"]{color:var(--ink);border-color:var(--brand)}
.rows{display:flex;flex-direction:column;gap:12px}
.row{display:grid;grid-template-columns:96px 1fr auto;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px}
.row img{width:96px;height:72px;object-fit:cover;border-radius:8px}
.row .acts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
@media (max-width:640px){.row{grid-template-columns:72px 1fr}.row img{width:72px;height:56px}.row .acts{grid-column:1/-1;justify-content:flex-start}}
.social-row{display:grid;grid-template-columns:130px 1fr auto;gap:10px;align-items:center}
@media (max-width:560px){.social-row{grid-template-columns:1fr}}
.ok{color:var(--ok);font-weight:700;font-size:.86rem;display:inline-flex;gap:4px;align-items:center}
.badgebox{display:flex;gap:14px;align-items:center;padding:14px;border-radius:12px;background:var(--surface-2)}
table.pay{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:hidden}
table.pay th,table.pay td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line);font-size:.92rem}
table.pay th{font-weight:600;color:var(--muted);background:var(--surface-2)}

/* messages */
.inbox{display:grid;grid-template-columns:320px 1fr;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface);height:min(72vh,660px)}
.tlist{border-right:1px solid var(--line);overflow:auto}
.titem{display:flex;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);align-items:flex-start}
.titem:hover{background:var(--surface-2)}
.titem[aria-current="page"]{background:var(--surface-2)}
.titem .avatar{width:40px;height:40px}
.titem .meta{flex:1;min-width:0}
.titem .meta b{display:flex;gap:6px;align-items:center}
.titem .snip{font-size:.86rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.titem.unread .snip{color:var(--ink);font-weight:600}
.udot{width:9px;height:9px;border-radius:50%;background:#D23B5B;flex:none;margin-top:6px}
.chat{display:flex;flex-direction:column;min-height:0;min-width:0}
.chat-head{display:flex;gap:10px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line)}
.chat-item{display:flex;gap:10px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);background:var(--surface-2);font-size:.9rem}
.chat-item img{width:52px;height:40px;border-radius:6px;object-fit:cover}
.msgs{flex:1;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:8px;background:var(--bg)}
.bub{max-width:78%;padding:9px 12px;border-radius:14px 14px 14px 4px;background:var(--surface);border:1px solid var(--line);white-space:pre-wrap;overflow-wrap:anywhere;align-self:flex-start}
.bub.me{align-self:flex-end;background:var(--brand);color:var(--on-brand);border-color:var(--brand);border-radius:14px 14px 4px 14px}
.bub time{display:block;font-size:.72rem;opacity:.7;margin-top:3px}
.composer{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line);align-items:flex-end}
.composer textarea{min-height:44px;height:44px;max-height:140px;resize:none}
.safety{font-size:.8rem;color:var(--muted);text-align:center;padding:4px 0 8px}
@media (max-width:760px){
  .inbox{grid-template-columns:1fr;height:calc(100vh - 230px);min-height:420px}
  .inbox.has-chat .tlist{display:none}
  .inbox:not(.has-chat) .chat{display:none}
  .tlist{border-right:0}
}

/* modal */
.mwrap{position:fixed;inset:0;background:rgba(10,20,28,.55);z-index:90;display:grid;place-items:center;padding:16px}
.mbox{background:var(--surface);border-radius:18px;max-width:520px;width:100%;max-height:calc(100% - 32px);overflow:auto;padding:22px;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.mbox h2{font-size:1.4rem;margin-bottom:4px}
.bopts{display:flex;flex-direction:column;gap:10px;margin:16px 0}
.bopt{position:relative;display:flex;gap:12px;align-items:flex-start;padding:14px;border:1.5px solid var(--line);border-radius:12px;cursor:pointer}
.bopt input{margin-top:4px;accent-color:var(--brand);width:18px;height:18px;flex:none}
.bopt:has(input:checked){border-color:var(--brand);background:color-mix(in srgb,var(--brand) 7%,var(--surface))}
.bopt .pr{margin-left:auto;font-family:"Bricolage Grotesque";font-weight:800;font-size:1.1rem;white-space:nowrap}
.bopt p{font-size:.86rem;color:var(--muted);margin-top:2px}
.bopt .best{font-size:.7rem;font-weight:700;background:var(--key);color:var(--on-key);padding:2px 7px;border-radius:999px;margin-left:6px;vertical-align:2px}

/* footer, tabbar, toast */
footer{border-top:1px solid var(--line);margin-top:50px;padding:30px 0 40px;color:var(--muted);font-size:.9rem}
footer .wrap{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between}
footer a{color:var(--muted)}
.tabbar{display:none}
@media (max-width:1340px){nav.main a.opt{display:none}}
@media (max-width:1120px){nav.main a{padding:8px 8px;font-size:.88rem}.hdr-actions .btn-key span{display:none}}
@media (max-width:860px){
  nav.main{display:none}
  .hdr-actions .btn-key,.hdr-actions .iconlink,.hdr-actions .cursel{display:none}
  .hdr{gap:10px}
  .logo{font-size:1rem}
  .logo small{display:none}
  .ctysel{max-width:96px}
  .hdr-actions .btn-ghost{padding:8px 12px}
  .tabbar{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
  .tabbar a{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px 7px;font-size:.72rem;font-weight:600;color:var(--muted);text-decoration:none}
  .tabbar a[aria-current="page"]{color:var(--brand)}
  .tabbar a .dot{top:2px;right:calc(50% - 22px)}
  .tabbar a.post span.pp{width:42px;height:42px;border-radius:13px;background:var(--key);color:var(--on-key);display:grid;place-items:center;margin-top:-18px;box-shadow:0 4px 12px rgba(0,0,0,.18)}
  body{padding-bottom:76px}
}
@media (max-width:380px){.logo span.word{font-size:.92rem}}
#toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:100;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none;width:min(92vw,440px)}
@media (max-width:860px){#toast{bottom:calc(88px + env(safe-area-inset-bottom,0px))}}
.toast{background:var(--ink);color:var(--bg);padding:11px 16px;border-radius:10px;font-weight:600;font-size:.93rem;box-shadow:0 10px 30px rgba(0,0,0,.25);animation:tin .2s ease-out;text-align:center}
.toast.err{background:var(--danger);color:#fff}
@keyframes tin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* WordPress + Leaflet */
html{margin-top:0!important}
body.admin-bar header.top{top:32px}
@media screen and (max-width:782px){body.admin-bar header.top{top:46px}}
.leaflet-container{font:inherit;background:var(--surface-2);z-index:1}
.leaflet-tooltip{font-weight:600;font-size:.82rem}
.leaflet-control-attribution{font-size:10px}
.mapbox .leaflet-container{height:100%;width:100%}
#pinMap{height:300px;border-radius:12px;border:1px solid var(--line);overflow:hidden;z-index:1}
.pslot.up{border-style:solid}
.pslot .spin{width:26px;height:26px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--brand);animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
button[aria-busy="true"]{opacity:.7;cursor:progress}

/* country + currency */
.cursel{max-width:78px}
/* The header must never be wider than the page, whatever font loads: menu links that
   don't fit drop onto a hidden second row instead of pushing the buttons off screen. */
@media (min-width:861px){
  .ctysel{max-width:150px}
  .hdr .logo,.hdr-actions{flex:none}
  nav.main{flex:1 1 0;min-width:0;flex-wrap:wrap;align-content:flex-start;height:52px;padding:6px 4px;row-gap:24px;overflow:hidden}
}
.footprefs{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;width:100%;padding-top:16px;border-top:1px solid var(--line)}
.footprefs label{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--ink)}
.footprefs .ctysel{max-width:210px;border-radius:10px!important;background:var(--surface)!important;border-color:var(--line)!important}
.footprefs .cursel{max-width:96px}
.footprefs a{margin-left:auto;font-size:.8rem}
.approx{font-size:.86rem;color:var(--muted);font-weight:600}
.approx.lg{font-size:.98rem;margin-top:2px}
.notice{margin-top:16px;padding:12px 14px;border-radius:12px;background:color-mix(in srgb,var(--key) 18%,var(--surface));border:1px solid color-mix(in srgb,var(--key) 55%,var(--line));font-size:.95rem}
.notice .linkbtn{font:inherit;font-weight:600}

/* availability calendar */
.cal-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.cal-nav .btn[disabled]{opacity:.35}
.flipx{display:inline-block;transform:scaleX(-1)}
.cal-key{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 8px;font-size:.84rem;color:var(--muted)}
.cal-key .k{display:inline-block;width:14px;height:14px;border-radius:4px;margin-left:8px;border:1px solid var(--line);background:var(--surface)}
.cal-key .k:first-child{margin-left:0}
.cal-key .k.bk{background:var(--ink);border-color:var(--ink)}
.cal-key .k.imp{background:repeating-linear-gradient(135deg,var(--muted) 0 3px,var(--surface-2) 3px 6px);border-color:var(--muted)}
.cal-wrap{display:grid;grid-template-columns:1fr 1fr;gap:22px}
@media (max-width:640px){.cal-wrap{grid-template-columns:1fr}}
.cal-h{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;margin-bottom:8px;text-align:center}
.cal-g{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal-w{font-size:.74rem;font-weight:700;color:var(--muted);text-align:center;padding-bottom:2px}
.cal-d{display:grid;place-items:center;aspect-ratio:1;min-height:34px;border-radius:8px;font-size:.9rem;font-weight:600;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:0;font-family:inherit;line-height:1}
.cal-d.past{border-color:transparent;background:none;color:var(--muted);opacity:.45;font-weight:500}
.cal-d.bk{background:var(--ink);border-color:var(--ink);color:var(--bg);text-decoration:line-through;text-decoration-thickness:1px}
.cal-d.imp{background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--muted) 45%,var(--surface)) 0 4px,var(--surface-2) 4px 8px);border-color:var(--muted);color:var(--ink)}
button.cal-d{cursor:pointer}
button.cal-d.free:hover{border-color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,var(--surface))}
button.cal-d.bk{text-decoration:none}
.cal-note{font-size:.86rem;margin-top:12px}
.feedform{display:grid;grid-template-columns:150px 1fr auto;gap:10px}
@media (max-width:640px){.feedform{grid-template-columns:1fr}}
.row.feed{grid-template-columns:1fr auto}
.copyrow{display:grid;grid-template-columns:1fr auto;gap:10px}
@media (max-width:520px){.copyrow{grid-template-columns:1fr}}
.howto summary{font-weight:600;cursor:pointer;padding:4px 0}
.howto p{font-size:.92rem;color:var(--muted);margin-top:6px}

/* waiting for approval */
.chip-sm.held{background:color-mix(in srgb,var(--danger) 16%,var(--surface));color:var(--ink)}
.bub.held{opacity:.75;border-style:dashed}

/* Social media links in the footer */
.footsocial{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;width:100%}
.footsocial b{color:var(--ink);margin-right:4px}
.footsocial a{display:inline-flex;align-items:center;min-height:36px;padding:6px 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);font-weight:600;text-decoration:none}
.footsocial a:hover{border-color:var(--brand);color:var(--brand)}

/* Linked profile whose name does not match the account name */
.nomatch{color:#9a5b00;font-weight:700;font-size:.86rem}

/* "Get the app" bar shown on phones, above the header */
.appbar{background:var(--ink);color:var(--bg)}
.appbar[hidden]{display:none}
.appbar .wrap{display:flex;align-items:center;gap:10px;padding-top:8px;padding-bottom:8px;min-height:56px}
.appbar .mark{width:36px;height:36px;border-radius:9px;background:var(--brand);display:grid;place-items:center;flex:none}
.appbar .mark svg{width:20px;height:20px}
.appbar-t{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.appbar-t b{font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.appbar-t span{font-size:.8rem;opacity:.8}
.appbar .btn{flex:none;white-space:nowrap}
.appbar-x{flex:none;width:36px;height:44px;margin-left:-8px;border:0;background:none;color:inherit;font-size:1.5rem;line-height:1;cursor:pointer;opacity:.8}
.footapps{padding-top:0}

/* The site logo picture (header and app bar): shown on a white tile so it also reads in dark mode */
.logo .mark.logo-pic,.appbar .mark.logo-pic{background:#fff;overflow:hidden;padding:2px}
.logo .mark.logo-pic{width:40px;height:40px;border-radius:10px}
.mark.logo-pic img{width:100%;height:100%;object-fit:contain;display:block}
.logo .word{font-weight:700;letter-spacing:-.01em}
@media (max-width:860px){
  .hdr .logo{gap:7px;min-width:0;flex:0 1 auto}
  .logo .mark.logo-pic{width:34px;height:34px;border-radius:9px}
  .logo .word{overflow:hidden;text-overflow:ellipsis}
  .hdr-actions{min-width:0;flex:0 0 auto}
  .hdr-actions .ctysel{max-width:84px}
}
@media (max-width:400px){.logo span.word{font-size:.95rem}.hdr-actions .ctysel{max-width:72px}}
@media (max-width:380px){.logo span.word{font-size:.9rem}.hdr-actions .ctysel{max-width:56px}}
@media (max-width:340px){.hdr{gap:8px}.logo span.word{font-size:.8rem}.hdr-actions .ctysel{max-width:46px}.hdr-actions .btn-ghost{padding:8px 9px}}
@media (max-width:340px){.btn{max-width:100%;white-space:normal;text-align:center}}

/* "Write my ad for me" under the description box */
.aiw{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin:-4px 0 6px}
.aiw .btn{flex:none}
.aiw .hint{flex:1 1 220px;font-size:.86rem;color:var(--muted)}
.aiw .hint.warn{color:#9a5b00;font-weight:600}

/* Stars (given by the site owner) and reviews */
.stars{display:inline-flex;color:#e8a200;font-size:.95rem;letter-spacing:1px;line-height:1;vertical-align:middle;margin-left:4px}
.stars i{font-style:normal;color:var(--line)}
.who .stars{font-size:.8rem;letter-spacing:0}
.rateline{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;margin-top:3px;font-size:.86rem}
.rateline .stars{margin-left:0}
.revlink{color:var(--brand);font-weight:600}
.ratebox{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;margin-top:14px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2)}
.ratebox .stars{font-size:1.3rem;margin-left:0}
.review{border-top:1px solid var(--line);padding:14px 0}
.review:first-child{border-top:0}
.review-h{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.review p{margin:0;overflow-wrap:anywhere}
.rvform{margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.rvwhy{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.hpx{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Star picker in the review form, and stars on each review */
.starpick{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end;gap:2px;position:relative}
.starpick input{position:absolute;opacity:0;width:1px;height:1px}
.starpick label{font-size:2rem;line-height:1;color:var(--line);cursor:pointer;padding:2px 3px}
.starpick input:checked~label,.starpick label:hover,.starpick label:hover~label{color:#e8a200}
.starpick input:focus-visible+label{outline:2px solid var(--brand);outline-offset:2px;border-radius:4px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rvstars .stars{margin-left:2px;font-size:.9rem}

/* "Import from a link" box on the Post an ad page */
.importbox{border:1px dashed var(--line);border-radius:12px;padding:14px 16px;margin:0 0 20px;background:var(--surface-2)}
.importbox p{margin:4px 0 10px;font-size:.9rem}
.imp-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.imp-row input{flex:1 1 240px;min-width:0}
.imp-row .btn{flex:none}
.importbox .hint{display:block;margin:8px 0 0;font-size:.88rem;color:var(--muted)}
.importbox .hint:empty{display:none}
.importbox .hint.warn{color:#9a5b00;font-weight:600}

/* Bookings */
.bookbox{gap:10px}
.bookbox .bk-mode{display:flex;gap:6px;align-items:flex-start;font-size:.88rem;margin:0}
.bookbox .bk-mode svg{flex:none;width:16px;height:16px;margin-top:2px;color:#e8a200}
.bookbox .field{margin:0}
.bookbox .g2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bookbox input[type=date]{padding-left:8px;padding-right:6px;font-size:.92rem}
.bookbox[data-kind=short] .bk-long,.bookbox[data-kind=long] .bk-short{display:none}
.bk-est{font-weight:700;margin:0;font-size:.93rem}
.bk-est:empty,.bookbox .err:empty{display:none}
.bk-small{font-size:.8rem;margin:0}
.bk-h{font-size:1.1rem;margin:22px 0 10px}
.bk-h:first-child{margin-top:0}
.bkrow{display:flex;gap:14px;justify-content:space-between;align-items:flex-start;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--surface);flex-wrap:wrap}
.bk-main{flex:1 1 300px;min-width:0;display:flex;flex-direction:column;gap:3px}
.bk-title{font-weight:700;color:var(--ink);text-decoration:none}
.bk-note{margin:4px 0 0;font-style:italic;overflow-wrap:anywhere}
.bk-side{display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.bk-side .acts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.chip-sm.bk-confirmed{background:color-mix(in srgb,var(--ok) 20%,var(--surface))}
.chip-sm.bk-pending{background:color-mix(in srgb,#e8a200 26%,var(--surface))}
.chip-sm.bk-declined,.chip-sm.bk-cancelled,.chip-sm.bk-expired{background:var(--surface-2);color:var(--muted)}
@media (max-width:560px){.bk-side{align-items:flex-start;width:100%}.bk-side .acts{justify-content:flex-start}}

.bk-rules[hidden]{display:none}

/* phones: date boxes never push a form wider than the screen; the open account tab is scrolled into view */
.g2>*,.g3>*,.g4>*{min-width:0}
input[type=date],input[type=time]{min-width:0}
@media (max-width:440px){.bookbox input[type=date],#blockForm input[type=date]{padding-left:8px;padding-right:4px}#blockForm>div{grid-column:1/-1}#blockForm>div>span{display:none}}

/* Help: links to the illustrated guide */
.helplink{display:inline-flex;align-items:center;gap:6px;padding:5px 12px 5px 6px;border-radius:999px;border:1px solid var(--line);color:var(--ink);text-decoration:none;font-weight:600;font-size:.9rem;white-space:nowrap;background:var(--surface)}
.helplink:hover{background:var(--surface-2)}
.helplink b,.herohelp b,.helpline b{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--brand);color:#fff;font-size:.85rem;font-weight:800;flex:none}
@media (max-width:1120px){.helplink{padding:5px}.helplink span{display:none}}
@media (max-width:860px){.helplink{display:none}}
.herohelp{margin:16px 0 0}
.herohelp a{display:inline-flex;align-items:center;gap:8px;padding:8px 16px 8px 8px;border-radius:999px;background:rgba(255,255,255,.16);color:#fff;text-decoration:none;font-weight:650;font-size:.95rem}
.herohelp a:hover{background:rgba(255,255,255,.26)}
.herohelp b{background:#fff;color:var(--brand)}
.helpline{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:6px 0 0;padding-top:12px;border-top:1px solid var(--line);font-size:.93rem}
.hero p.herohelp{opacity:1}

/* Contact details at the bottom of the site */
.footcontact{width:100%;display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline}
.footcontact b{color:var(--ink)}
.footcontact address{font-style:normal}
.footcontact .fc-phones{display:flex;flex-wrap:wrap;gap:6px 14px}
.footcontact a{font-weight:600;white-space:nowrap}

/* Hide my contact details */
.privbox{border:1px solid var(--line);background:var(--surface-2);border-radius:12px;padding:12px 14px}
.privbox .check{align-items:flex-start}
.hidnote{display:flex;gap:8px;align-items:flex-start}
.hidnote .i{flex:none;margin-top:2px}

/* The page as the server sends it, shown for a moment before the app takes over (and what search engines read) */
.ssr h1{font-size:clamp(1.5rem,4vw,2.1rem);font-weight:800;margin:6px 0 10px;letter-spacing:-.01em}
.ssr h2{font-size:1.2rem;margin:26px 0 12px}
.ssr h2 a{color:inherit;text-decoration:none}
.ssr h3{font-size:1rem;margin:10px 12px 4px;color:var(--ink)}
.ssr p{margin:0 0 10px}
.ssr-crumbs{font-size:.9rem;color:var(--muted);margin-bottom:6px}
.ssr-price{font-weight:800;font-size:1.15rem;color:var(--ink)}
.ssr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.ssr-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;padding-bottom:10px}
.ssr-card a{text-decoration:none;color:inherit;display:block}
.ssr-card img,.ssr-noimg{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--surface-2);height:auto}
.ssr-card p{margin:2px 12px;font-size:.92rem;color:var(--muted)}
.ssr-card .ssr-price{font-size:1rem;color:var(--ink)}
.ssr-req{padding-top:6px}
.ssr-links{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 6px}
.ssr-links a{display:inline-block;padding:7px 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);text-decoration:none;font-weight:600;font-size:.92rem}
.ssr-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px;margin:14px 0}
.ssr-photos img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:12px;background:var(--surface-2)}
.ssr-facts{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:14px 0}
.ssr-facts dt{color:var(--muted)}
.ssr-facts dd{margin:0;font-weight:600}
.ssr-am{columns:2;padding-left:20px}

/* Prices in this area (hosts only) */
.areaprice{border:1px solid var(--line);border-left:4px solid var(--brand,#0F5E57);border-radius:12px;padding:12px 14px;margin:12px 0 4px;background:var(--surface-2);font-size:.93rem;line-height:1.5}
.areaprice[hidden]{display:none}
.areaprice p{margin:6px 0 0}
.areaprice .ap-h{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;justify-content:space-between}
.areaprice .ap-only{font-size:.74rem;font-weight:600;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:1px 9px;background:var(--surface);white-space:nowrap}
.areaprice .ap-cmp{font-weight:600}
.contact.areaprice{gap:0;padding:14px 16px;margin:0}

/* Town by town: note shown when a place has more ads than are sent at once */
.capnote{font-size:.88rem;margin:0 0 12px}

/* Travel packages */
.purpose.travel{background:#0B6E8A;color:#fff}
.seg .segx{display:inline-flex;align-items:center;padding:8px 14px;border-radius:9px;font-weight:600;font-size:.93rem;color:var(--ink);text-decoration:none;border:1px dashed var(--line)}
.seg .segx:hover{background:var(--surface)}
/* Five sections in the menu: a little tighter, so that all of them fit beside the buttons. */
@media (min-width:861px){nav.main{gap:0}nav.main a{padding:8px 8px;font-size:.88rem}.hdr{gap:12px}.ctysel{max-width:124px}}
@media (min-width:861px) and (max-width:1119px){nav.main a{padding:8px 6px;font-size:.84rem}.hdr{gap:8px}.ctysel{max-width:104px}.logo span.word{font-size:1rem}}

/* Alerts */
.toast.tap{pointer-events:auto;cursor:pointer;text-decoration:none;display:block;border:2px solid var(--key)}
.soundrow{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin:2px 0 10px}
.soundrow .check{margin:0;flex:1 1 260px}