
:root{
  --navy:#062b57;--navy2:#0b3b70;--gold:#d59a27;--paper:#fff;
  --text:#16263d;--muted:#667085;--border:#e7e0d2;--cream:#fffaf0;
}
*{box-sizing:border-box}
body{
  margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  color:var(--text);
  background:linear-gradient(180deg,#fffdf7,#f8f4e9);
}
.hero{
  min-height:300px;position:relative;background:
    linear-gradient(rgba(3,28,56,.18),rgba(3,28,56,.25)),
    url("../images/generic-community-background.png") center/cover no-repeat;
}
.city-page .hero{
  background:
    linear-gradient(rgba(3,28,56,.18),rgba(3,28,56,.25)),
    url("../../../images/generic-community-background.png") center/cover no-repeat;
}
.hero-label{
  position:absolute;left:18px;bottom:18px;padding:10px 14px;border-radius:11px;
  background:rgba(5,28,50,.62);color:#fff;backdrop-filter:blur(6px);
  text-shadow:0 1px 3px rgba(0,0,0,.65);font-weight:800;
}
.container{width:min(1500px,100%);margin:auto;padding:16px 14px 42px}
.location-controls{
  display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;
  padding:9px;background:rgba(255,255,255,.96);border-radius:14px;
  box-shadow:0 5px 20px rgba(20,35,55,.10);margin-top:-24px;position:relative;z-index:5;
}
select,input{
  width:100%;height:40px;min-width:0;border:1px solid #d8d2c6;border-radius:8px;
  padding:7px 9px;background:#fff;color:var(--text);font:inherit;font-size:13px;
}
select:disabled,input:disabled{background:#f1f1f1;color:#929292}
.location-note{font-size:12px;color:var(--muted);margin:10px 3px 15px}
.categories{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;
}
.category{
  min-height:58px;display:flex;align-items:center;gap:10px;padding:13px 15px;
  border:1px solid var(--border);border-radius:11px;background:#fff;
  font-weight:800;box-shadow:0 2px 8px rgba(0,0,0,.035);
}
.category-icon{font-size:21px}
.category.hidden{display:none}
.empty-city-note{
  padding:10px 13px;border-radius:10px;background:#fff8df;border:1px solid #ead9a5;
  color:#66551d;margin-bottom:12px;font-size:13px;
}
.visitor-counter{
  margin:20px auto 0;width:max-content;max-width:100%;padding:7px 11px;
  border-radius:999px;background:#fff;border:1px solid var(--border);font-size:12px;font-weight:700;
}
footer{text-align:center;color:var(--muted);font-size:12px;padding:18px}
@media(max-width:1200px){.location-controls{grid-template-columns:repeat(4,minmax(0,1fr))}.categories{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){
  .hero{min-height:245px}.location-controls{grid-template-columns:1fr;margin-top:-14px}
  select,input{height:44px;font-size:14px}.categories{grid-template-columns:1fr}
}


/* v58 restored rich Sydney/Gilbert pages */
.rich-city .hero{min-height:500px;overflow:hidden}
.rich-city .hero-city-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.rich-city .hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(3,18,48,.18),rgba(3,18,48,.25))}
.city-glass{position:absolute;z-index:3;color:#fff;background:rgba(5,25,45,.48);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(7px);border-radius:12px;padding:9px 11px;text-shadow:0 1px 3px rgba(0,0,0,.7)}
.city-live-panel{right:16px;top:16px;min-width:250px}
.banner-events{left:16px;top:16px;max-width:45%}
.banner-event-list{display:flex;gap:7px;flex-wrap:wrap}
.banner-event-thumb{display:block;width:56px;height:72px;border-radius:7px;overflow:hidden;border:1px solid rgba(255,255,255,.35)}
.banner-event-thumb img{width:100%;height:100%;object-fit:cover}
.city-info-panel{left:16px;right:16px;bottom:16px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:8px}
.city-info-card{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:8px;padding:7px 9px;font-size:11px}
.city-info-card strong{display:block;margin-bottom:3px}
.tabs{display:flex;gap:8px;margin:15px 0}
.tab-btn{border:1px solid var(--border);background:#fff;border-radius:9px;padding:9px 13px;font-weight:800;cursor:pointer}
.tab-btn.active{background:var(--navy);color:#fff}
.business-category{background:#fff;border:1px solid var(--border);border-radius:11px;margin:10px 0;overflow:hidden}
.business-category h2{margin:0;padding:12px 14px;font-size:15px;background:linear-gradient(135deg,var(--navy),var(--navy2));color:#fff}
.business-listing{display:grid;grid-template-columns:1.2fr .9fr .8fr 1.1fr 1.2fr;gap:8px;padding:10px 12px;border-top:1px solid var(--border);font-size:12px}
.business-listing strong{font-size:13px}
.business-listing a{color:#0b5e9a;text-decoration:none}
.business-empty{padding:0}
.events-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.event-card{background:#fff;border:1px solid var(--border);border-radius:11px;padding:12px}
.event-card h3{margin:0 0 7px;font-size:15px}
.event-meta{font-size:12px;color:var(--muted);margin:3px 0}
.event-flyer{display:inline-block;width:78px;height:100px;border-radius:8px;overflow:hidden;border:1px solid var(--border);margin-top:8px}
.event-flyer img{width:100%;height:100%;object-fit:cover}
.hidden{display:none!important}
@media(max-width:850px){
  .rich-city .hero{min-height:800px;display:flex;flex-direction:column;justify-content:flex-end;gap:7px;padding:8px}
  .city-live-panel,.banner-events,.city-info-panel{position:relative;inset:auto;width:100%;max-width:none}
  .city-live-panel{order:10}.banner-events{order:20}.city-info-panel{order:30;grid-template-columns:1fr}
  .business-listing{grid-template-columns:1fr}
  .events-grid{grid-template-columns:1fr}
}


/* v59 global iconic landmark city backgrounds */
.city-page .hero{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,#17334d,#071b2e);
}
.city-page .hero-city-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
}
.city-page .hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(180deg,rgba(3,18,48,.14),rgba(3,18,48,.34));
  pointer-events:none;
}
.city-page .hero-label{
  z-index:3;
}
.city-page:not(.rich-city) .hero{
  min-height:330px;
}
.city-page:not(.rich-city) .hero-label{
  position:absolute;
  left:18px;
  bottom:18px;
}
@media(max-width:700px){
  .city-page:not(.rich-city) .hero{min-height:270px}
}


/* v60 mobile rendering hardening */
html,body{max-width:100%;overflow-x:hidden}
img{max-width:100%}
.city-page .hero{
  background:#102b43 !important;
  overflow:hidden;
}
.city-page .hero-city-image{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
  display:block !important;
  z-index:0 !important;
}
.location-controls>*{min-width:0}
.location-controls select,
.location-controls input{
  max-width:100%;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.rich-city .city-glass{
  max-width:calc(100% - 16px);
}
@media(max-width:850px){
  .container{padding-left:9px;padding-right:9px}
  .location-controls{
    margin-left:0 !important;
    margin-right:0 !important;
    width:100% !important;
  }
  .rich-city .hero{
    min-height:680px !important;
    padding:8px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-end !important;
    gap:7px !important;
  }
  .rich-city .city-live-panel,
  .rich-city .banner-events,
  .rich-city .city-info-panel{
    position:relative !important;
    inset:auto !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
  }
  .rich-city .city-live-panel{order:10}
  .rich-city .banner-events{order:20}
  .rich-city .city-info-panel{order:30}
  .city-info-panel{grid-template-columns:1fr !important}
  .business-listing{grid-template-columns:1fr !important}
  .events-grid{grid-template-columns:1fr !important}
}
@media(max-width:520px){
  .city-page:not(.rich-city) .hero{min-height:235px !important}
  .rich-city .hero{min-height:720px !important}
  .hero-label{left:9px !important;right:9px !important;bottom:9px !important;font-size:13px}
  .city-glass{font-size:11px}
}


/* v61 universal city time/weather/holiday panels */
.universal-city-info{
  position:absolute;
  z-index:8;
  left:12px;
  right:12px;
  bottom:12px;
  display:grid;
  grid-template-columns:1.1fr 1.5fr 1fr 1fr;
  gap:8px;
}
.universal-info-card{
  min-width:0;
  padding:9px 10px;
  border-radius:11px;
  color:#fff;
  background:rgba(5,25,45,.52);
  border:1px solid rgba(255,255,255,.27);
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
  text-shadow:0 1px 3px rgba(0,0,0,.72);
  font-size:11px;
  line-height:1.4;
}
.universal-info-title{
  font-weight:800;
  margin-bottom:4px;
  font-size:11px;
}
.universal-time{
  font-size:17px;
  font-weight:800;
  line-height:1.15;
}
.universal-muted{
  opacity:.88;
}
@media(max-width:900px){
  .city-page:not(.rich-city) .hero{
    min-height:560px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-end !important;
    padding:8px !important;
  }
  .universal-city-info{
    position:relative !important;
    inset:auto !important;
    width:100% !important;
    grid-template-columns:1fr !important;
    gap:6px !important;
    margin:0 !important;
  }
  .city-page:not(.rich-city) .hero-label{
    position:relative !important;
    inset:auto !important;
    width:max-content;
    max-width:100%;
    margin-bottom:6px;
  }
}
@media(max-width:520px){
  .city-page:not(.rich-city) .hero{min-height:620px !important}
  .universal-info-card{padding:7px 8px;font-size:10.5px}
  .universal-time{font-size:16px}
}


/* v62 PWA install prompt */
.pwa-install-banner{
  position:fixed;
  left:12px;
  right:12px;
  bottom:12px;
  z-index:10000;
  display:none;
  align-items:center;
  gap:10px;
  max-width:620px;
  margin:auto;
  padding:11px 12px;
  border-radius:14px;
  background:rgba(6,43,87,.96);
  color:#fff;
  box-shadow:0 8px 28px rgba(0,0,0,.28);
  border:1px solid rgba(255,255,255,.2);
}
.pwa-install-banner.show{display:flex}
.pwa-install-icon{font-size:25px;flex:0 0 auto}
.pwa-install-copy{min-width:0;flex:1;font-size:12px;line-height:1.35}
.pwa-install-copy strong{display:block;font-size:13px;margin-bottom:2px}
.pwa-install-actions{display:flex;gap:6px;flex:0 0 auto}
.pwa-install-btn,.pwa-install-close{
  border:0;border-radius:9px;padding:8px 10px;font-weight:800;cursor:pointer;
}
.pwa-install-btn{background:#fff;color:#062b57}
.pwa-install-close{background:rgba(255,255,255,.15);color:#fff}
.pwa-ios-help{
  display:none;
  position:fixed;
  left:12px;right:12px;bottom:12px;z-index:10001;
  max-width:620px;margin:auto;padding:13px;border-radius:14px;
  background:#fff;color:#16263d;border:1px solid #ddd;
  box-shadow:0 8px 28px rgba(0,0,0,.25);
  font-size:13px;line-height:1.45;
}
.pwa-ios-help.show{display:block}
.pwa-ios-help button{float:right;border:0;background:#062b57;color:#fff;border-radius:8px;padding:6px 9px}
@media(min-width:900px){
  .pwa-install-banner,.pwa-ios-help{left:auto;right:18px;width:390px}
}


/* v64 curated landmark framing */
.city-page .hero-city-image{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  background:#102b43;
}
.city-page .hero{
  background:#102b43 !important;
}
.city-page .hero.has-landmark .hero-city-image{
  opacity:1;
}
@media(max-width:700px){
  .city-page .hero-city-image{
    object-position:center center !important;
  }
}


/* v67 reliable desktop/mobile country flags */
.country-picker-wrap{
  position:relative;
  min-width:0;
}
.country-picker-button{
  width:100%;
  height:40px;
  display:flex;
  align-items:center;
  gap:7px;
  padding:7px 9px;
  border:1px solid #d8d2c6;
  border-radius:8px;
  background:#fff;
  color:var(--text);
  font:inherit;
  font-size:13px;
  cursor:pointer;
  text-align:left;
}
.country-picker-button:disabled{
  background:#f1f1f1;
  color:#929292;
  cursor:default;
}
.country-picker-button img{
  width:22px;
  height:15px;
  object-fit:cover;
  border-radius:2px;
  flex:0 0 auto;
  box-shadow:0 0 0 1px rgba(0,0,0,.08);
}
.country-picker-label{
  min-width:0;
  flex:1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.country-picker-caret{
  opacity:.6;
  flex:0 0 auto;
}
.country-picker-menu{
  position:absolute;
  z-index:1000;
  left:0;
  right:0;
  top:calc(100% + 4px);
  max-height:300px;
  overflow:auto;
  background:#fff;
  border:1px solid #d8d2c6;
  border-radius:10px;
  box-shadow:0 10px 28px rgba(0,0,0,.16);
  padding:5px;
  display:none;
}
.country-picker-menu.open{display:block}
.country-picker-option{
  width:100%;
  display:flex;
  align-items:center;
  gap:8px;
  border:0;
  background:transparent;
  padding:8px 9px;
  border-radius:7px;
  cursor:pointer;
  font:inherit;
  font-size:13px;
  text-align:left;
  color:var(--text);
}
.country-picker-option:hover,
.country-picker-option:focus{
  background:#f3f6fa;
  outline:none;
}
.country-picker-option img{
  width:22px;
  height:15px;
  object-fit:cover;
  border-radius:2px;
  box-shadow:0 0 0 1px rgba(0,0,0,.08);
  flex:0 0 auto;
}
.country-picker-native{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  clip:rect(0 0 0 0) !important;
  clip-path:inset(50%) !important;
  white-space:nowrap !important;
}
@media(max-width:650px){
  .country-picker-button{
    height:44px;
    font-size:14px;
  }
  .country-picker-option{
    font-size:14px;
    padding:9px;
  }
}


/* v72 dedicated city events pages */
.city-events-link{display:inline-flex;align-items:center;gap:6px;margin:10px 0 2px;padding:8px 11px;border-radius:9px;background:#062b57;color:#fff!important;text-decoration:none;font-weight:800;font-size:12px}
.events-page-title{margin:18px 0 10px;font-size:22px}
.events-empty{padding:14px;background:#fff;border:1px solid var(--border);border-radius:11px;color:var(--muted)}
.city-events-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.city-event-card{background:#fff;border:1px solid var(--border);border-radius:12px;padding:13px}
.city-event-card h2{margin:0 0 7px;font-size:16px}
.city-event-meta{font-size:12px;color:var(--muted);margin:4px 0}
.city-event-description{font-size:13px;line-height:1.5}
.city-event-flyer{display:inline-block;width:90px;height:116px;margin-top:9px;overflow:hidden;border-radius:8px;border:1px solid var(--border)}
.city-event-flyer img{width:100%;height:100%;object-fit:cover}
@media(max-width:700px){.city-events-grid{grid-template-columns:1fr}}


/* v73 global city event flyer thumbnails */
.global-banner-events{
  position:absolute;
  z-index:9;
  left:12px;
  top:12px;
  display:none;
  max-width:min(48%,520px);
  padding:9px 10px;
  border-radius:12px;
  color:#fff;
  background:rgba(5,25,45,.48);
  border:1px solid rgba(255,255,255,.28);
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
  text-shadow:0 1px 3px rgba(0,0,0,.72);
}
.global-banner-events.show{display:block}
.global-banner-events-title{
  font-size:11px;
  font-weight:800;
  margin-bottom:6px;
}
.global-banner-events-list{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
}
.global-banner-event-thumb{
  display:block;
  width:56px;
  height:72px;
  border-radius:7px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.38);
  background:rgba(255,255,255,.08);
  position:relative;
}
.global-banner-event-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.global-banner-event-thumb::after{
  content:"↗";
  position:absolute;
  right:3px;
  bottom:3px;
  width:16px;
  height:16px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(0,0,0,.62);
  color:#fff;
  font-size:9px;
  font-weight:800;
}
.global-banner-events-more{
  display:flex;
  align-items:center;
  justify-content:center;
  width:56px;
  height:72px;
  border-radius:7px;
  border:1px dashed rgba(255,255,255,.42);
  color:#fff!important;
  text-decoration:none;
  font-size:10px;
  text-align:center;
  padding:4px;
}
@media(max-width:850px){
  .global-banner-events{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    order:20;
  }
}


/* v74 monthly grouped flyer thumbnails */
.global-banner-events{
  max-width:min(72%,760px);
}
.global-banner-events-list{
  display:flex;
  align-items:flex-start;
  gap:8px;
  flex-wrap:wrap;
}
.global-banner-event-month{
  padding:7px;
  border-radius:9px;
  border:1px solid rgba(255,255,255,.30);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}
.global-banner-event-month-title{
  font-size:10px;
  line-height:1;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.45px;
  margin:0 0 6px;
  color:#fff;
  text-shadow:0 1px 3px rgba(0,0,0,.8);
}
.global-banner-event-month-thumbs{
  display:flex;
  gap:5px;
  flex-wrap:wrap;
}
.global-banner-event-month.month-tone-0{background:rgba(15,75,125,.70)}
.global-banner-event-month.month-tone-1{background:rgba(112,64,18,.70)}
.global-banner-event-month.month-tone-2{background:rgba(42,105,65,.70)}
.global-banner-event-month.month-tone-3{background:rgba(92,48,112,.70)}
.global-banner-events-all-link{
  align-self:stretch;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:86px;
  padding:7px 9px;
  border-radius:9px;
  background:rgba(0,0,0,.45);
  border:1px solid rgba(255,255,255,.30);
  color:#fff!important;
  text-decoration:none;
  font-size:10px;
  font-weight:800;
  text-align:center;
}
@media(max-width:850px){
  .global-banner-events-list{
    display:flex;
    overflow-x:auto;
    flex-wrap:nowrap;
    padding-bottom:3px;
  }
  .global-banner-event-month{
    flex:0 0 auto;
  }
  .global-banner-events-all-link{
    flex:0 0 76px;
  }
}


/* v75 Businesses + Events tabs on all city pages */
.city-main-tabs{
  display:flex;
  gap:8px;
  margin:14px 0 12px;
  flex-wrap:wrap;
}
.city-main-tab{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:38px;
  padding:8px 13px;
  border:1px solid var(--border);
  border-radius:9px;
  background:#fff;
  color:var(--text)!important;
  text-decoration:none;
  font-weight:800;
  font-size:13px;
}
.city-main-tab.active{
  background:var(--navy);
  color:#fff!important;
  border-color:var(--navy);
}
@media(max-width:650px){
  .city-main-tabs{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:7px;
  }
  .city-main-tab{
    width:100%;
  }
}


/* v76 unified Businesses / Events buttons */
.city-main-tabs{
  display:flex;
  align-items:center;
  gap:8px;
  margin:14px 0 12px;
}
.city-main-tab{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:8px 13px;
  border:1px solid #ddd6c8;
  border-radius:9px;
  background:#fff;
  color:#111!important;
  text-decoration:none;
  font-weight:800;
  font-size:13px;
}
.city-main-tab.active{
  background:#062b57;
  border-color:#062b57;
  color:#fff!important;
}
@media(max-width:650px){
  .city-main-tabs{
    display:flex;
    grid-template-columns:none;
    gap:8px;
  }
  .city-main-tab{
    width:auto;
  }
}


/* v79 responsive landmark compositions */
@media(min-width:701px){
  .city-page .hero-city-image{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
  }
}
@media(max-width:700px){
  .city-page .hero.portrait-landmark,
  .city-page .hero:has(.hero-city-image){
    background:#102b43!important;
  }
  .city-page .hero.portrait-landmark .hero-city-image,
  .city-page .hero .hero-city-image[src*="-mobile.webp"]{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
  }
}


/* v80 true portrait mobile landmark hero */
@media(max-width:700px){
  body.city-page header.hero{
    min-height:0!important;
    height:auto!important;
    aspect-ratio:3 / 4!important;
    max-height:none!important;
    overflow:hidden!important;
  }
  body.city-page header.hero .hero-city-image{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
    transform:none!important;
  }
  body.city-page header.hero .hero-city-image[src*="Sydney-mobile.webp"]{
    object-position:center center!important;
  }
}


/* v81 true mobile portrait media separated from info panels */
.hero-media{
  position:absolute;
  inset:0;
  z-index:0;
}
.hero-mobile-panels{
  position:static;
}

/* Desktop/tablet wider than mobile: preserve existing overlay appearance */
@media(min-width:701px){
  .rich-city .hero-media{
    position:absolute;
    inset:0;
  }
  .rich-city .hero-media .hero-city-image{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }
  .rich-city .hero-mobile-panels{
    display:contents;
  }
}

/* Mobile: portrait picture is its own 3:4 frame.
   Weather/events/forecast cards sit BELOW the image and no longer stretch it. */
@media(max-width:700px){
  body.city-page.rich-city header.hero{
    display:block!important;
    min-height:0!important;
    height:auto!important;
    aspect-ratio:auto!important;
    padding:0!important;
    overflow:visible!important;
    background:#102b43!important;
  }

  body.city-page.rich-city header.hero .hero-media{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:3 / 4!important;
    overflow:hidden!important;
    background:#102b43!important;
  }

  body.city-page.rich-city header.hero .hero-media .hero-city-image{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
    transform:none!important;
  }

  body.city-page.rich-city header.hero .hero-mobile-panels{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    gap:7px!important;
    width:100%!important;
    padding:8px!important;
    background:linear-gradient(180deg,#102b43,#0b2236)!important;
    z-index:5!important;
  }

  body.city-page.rich-city header.hero .hero-mobile-panels > .city-live-panel,
  body.city-page.rich-city header.hero .hero-mobile-panels > .global-banner-events,
  body.city-page.rich-city header.hero .hero-mobile-panels > .city-info-panel{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
  }

  body.city-page.rich-city header.hero .hero-mobile-panels > .city-info-panel{
    display:grid!important;
    grid-template-columns:1fr!important;
  }

  /* Ensure no old rule can make the image cover the entire header */
  body.city-page.rich-city header.hero > .hero-city-image{
    display:none!important;
  }
}


/* v82 mobile single-screen blurred city dashboard */
@media(max-width:700px){

  html, body{
    min-height:100%;
    overflow-x:hidden;
  }

  body.city-page{
    min-height:100dvh;
    background:#071b2e;
  }

  /* The city hero becomes the fixed full-screen blurred background. */
  body.city-page header.hero{
    position:fixed!important;
    inset:0!important;
    width:100%!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    overflow:hidden!important;
    z-index:0!important;
    padding:0!important;
    margin:0!important;
    display:block!important;
    background:#071b2e!important;
  }

  body.city-page header.hero .hero-media{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    aspect-ratio:auto!important;
    overflow:hidden!important;
  }

  body.city-page header.hero .hero-city-image,
  body.city-page header.hero .hero-media .hero-city-image{
    position:absolute!important;
    inset:-4%!important;
    width:108%!important;
    height:108%!important;
    object-fit:cover!important;
    object-position:center!important;
    filter:blur(12px) brightness(.52) saturate(.92)!important;
    transform:scale(1.04)!important;
  }

  body.city-page header.hero::before{
    content:"";
    position:absolute!important;
    inset:0!important;
    z-index:2!important;
    background:
      linear-gradient(180deg,rgba(3,15,30,.40),rgba(3,15,30,.58)),
      radial-gradient(circle at 50% 20%,rgba(255,255,255,.05),transparent 45%)!important;
    pointer-events:none;
  }

  /* Main city content is now the visible dashboard. */
  body.city-page main.container{
    position:relative!important;
    z-index:20!important;
    width:100%!important;
    min-height:100dvh!important;
    height:100dvh!important;
    margin:0!important;
    padding:
      calc(env(safe-area-inset-top,0px) + 6px)
      7px
      calc(env(safe-area-inset-bottom,0px) + 6px)!important;
    display:flex!important;
    flex-direction:column!important;
    gap:5px!important;
    overflow:hidden!important;
    background:transparent!important;
  }

  /* Put location selectors first and keep them compact. */
  body.city-page .location-controls{
    order:1!important;
    position:relative!important;
    z-index:30!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:4px!important;
    width:100%!important;
    margin:0!important;
    padding:5px!important;
    border-radius:10px!important;
    background:rgba(5,25,45,.42)!important;
    border:1px solid rgba(255,255,255,.18)!important;
    backdrop-filter:blur(9px)!important;
    -webkit-backdrop-filter:blur(9px)!important;
    box-shadow:none!important;
  }

  body.city-page .location-controls select,
  body.city-page .location-controls input,
  body.city-page .country-picker-button{
    height:32px!important;
    min-height:32px!important;
    padding:4px 6px!important;
    border-radius:7px!important;
    font-size:10.5px!important;
    line-height:1.1!important;
  }

  /* Make country custom picker fit the grid like a normal field. */
  body.city-page .country-picker-wrap{
    min-width:0!important;
  }

  /* Business / Events buttons directly below selectors. */
  body.city-page .city-main-tabs,
  body.city-page .tabs{
    order:2!important;
    margin:0!important;
    gap:5px!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    width:100%!important;
  }

  body.city-page .city-main-tab,
  body.city-page .tab-btn,
  body.city-page .tab{
    min-height:30px!important;
    height:30px!important;
    padding:4px 8px!important;
    border-radius:7px!important;
    font-size:10.5px!important;
  }

  /* Move city information out of the fixed hero and into viewport overlay area. */
  body.city-page header.hero .hero-mobile-panels,
  body.city-page header.hero .universal-city-info{
    position:fixed!important;
    left:7px!important;
    right:7px!important;
    top:auto!important;
    bottom:
      calc(env(safe-area-inset-bottom,0px) + 6px)!important;
    z-index:18!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:4px!important;
    width:auto!important;
    padding:0!important;
    margin:0!important;
    background:transparent!important;
  }

  /* Rich city panel wrappers become contents so cards can use the shared grid. */
  body.city-page header.hero .hero-mobile-panels > .city-live-panel,
  body.city-page header.hero .hero-mobile-panels > .global-banner-events,
  body.city-page header.hero .hero-mobile-panels > .city-info-panel{
    position:relative!important;
    inset:auto!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
  }

  body.city-page .city-glass,
  body.city-page .universal-info-card,
  body.city-page .global-banner-events,
  body.city-page .city-live-panel,
  body.city-page .city-info-panel{
    background:rgba(5,25,45,.47)!important;
    border:1px solid rgba(255,255,255,.18)!important;
    border-radius:8px!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
    color:#fff!important;
    text-shadow:0 1px 2px rgba(0,0,0,.72)!important;
    box-shadow:none!important;
  }

  body.city-page .city-live-panel,
  body.city-page .universal-info-card{
    padding:6px!important;
    font-size:9.5px!important;
    line-height:1.25!important;
  }

  body.city-page .universal-city-info{
    grid-template-columns:1fr 1fr!important;
  }

  body.city-page .universal-info-title,
  body.city-page .city-info-card strong,
  body.city-page .global-banner-events-title{
    font-size:9px!important;
    margin-bottom:2px!important;
  }

  body.city-page .universal-time,
  body.city-page .city-live-time{
    font-size:14px!important;
    line-height:1!important;
  }

  /* Rich forecast/holiday area: compact 3-card strip. */
  body.city-page .city-info-panel{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:4px!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    backdrop-filter:none!important;
  }

  body.city-page .city-info-card{
    padding:5px 6px!important;
    border-radius:7px!important;
    background:rgba(5,25,45,.47)!important;
    border:1px solid rgba(255,255,255,.18)!important;
    font-size:9px!important;
    line-height:1.2!important;
  }

  /* Upcoming event months: compact and horizontally scrollable. */
  body.city-page .global-banner-events{
    padding:5px!important;
    max-height:112px!important;
    overflow:hidden!important;
  }

  body.city-page .global-banner-events-list{
    display:flex!important;
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    gap:4px!important;
    padding-bottom:2px!important;
    scrollbar-width:none!important;
  }

  body.city-page .global-banner-events-list::-webkit-scrollbar{
    display:none!important;
  }

  body.city-page .global-banner-event-month{
    flex:0 0 auto!important;
    padding:4px!important;
    border-radius:6px!important;
  }

  body.city-page .global-banner-event-month-title{
    font-size:8px!important;
    margin-bottom:3px!important;
  }

  body.city-page .global-banner-event-thumb{
    width:34px!important;
    height:44px!important;
    border-radius:4px!important;
  }

  body.city-page .global-banner-events-all-link{
    flex:0 0 54px!important;
    min-height:52px!important;
    font-size:8px!important;
    padding:3px!important;
  }

  /* Hide long directory body from the first screen.
     The tabs remain visible and users can tap Businesses/Events.
     This achieves a true no-scroll initial dashboard. */
  body.city-page #businessSection,
  body.city-page #eventsSection,
  body.city-page .categories,
  body.city-page .empty-city-note,
  body.city-page .location-note,
  body.city-page .visitor-counter,
  body.city-page footer{
    display:none!important;
  }

  /* Rich page header labels are unnecessary in this compact dashboard. */
  body.city-page .hero-label{
    display:none!important;
  }

  /* PWA install banner must not cover the dashboard cards. */
  body.city-page .pwa-install-banner{
    bottom:6px!important;
    left:7px!important;
    right:7px!important;
    max-width:none!important;
    font-size:10px!important;
    padding:7px!important;
  }
}

/* Small phones: keep all primary controls inside the first viewport. */
@media(max-width:390px) and (max-height:760px){
  body.city-page .location-controls select,
  body.city-page .location-controls input,
  body.city-page .country-picker-button{
    height:29px!important;
    min-height:29px!important;
    font-size:9.5px!important;
  }

  body.city-page header.hero .hero-mobile-panels,
  body.city-page header.hero .universal-city-info{
    gap:3px!important;
  }

  body.city-page .city-live-panel,
  body.city-page .universal-info-card,
  body.city-page .city-info-card{
    padding:4px!important;
    font-size:8.4px!important;
  }

  body.city-page .global-banner-event-thumb{
    width:30px!important;
    height:39px!important;
  }
}


/* v83 restore mobile data visibility + unblurred city image */
@media(max-width:700px){

  /* Keep city image clear rather than blurred. */
  body.city-page header.hero .hero-city-image,
  body.city-page header.hero .hero-media .hero-city-image{
    filter:brightness(.62) saturate(.95)!important;
    transform:none!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
  }

  /* Slight overlay only for readability; no blur. */
  body.city-page header.hero::before{
    background:
      linear-gradient(180deg,rgba(3,15,30,.30),rgba(3,15,30,.48)),
      radial-gradient(circle at 50% 20%,rgba(255,255,255,.04),transparent 48%)!important;
  }

  /* Main dashboard can scroll naturally after the first-screen controls.
     Important: do not hide directory/business/event data. */
  body.city-page main.container{
    height:auto!important;
    min-height:100dvh!important;
    overflow:visible!important;
    padding-bottom:14px!important;
  }

  /* Keep compact primary controls at the top. */
  body.city-page .location-controls{
    position:relative!important;
  }

  body.city-page .city-main-tabs,
  body.city-page .tabs{
    position:relative!important;
  }

  /* Info panels stay compact but are part of normal flow so they don't cover content. */
  body.city-page header.hero .hero-mobile-panels,
  body.city-page header.hero .universal-city-info{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    top:auto!important;
    width:100%!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:4px!important;
    padding:7px!important;
    margin:0!important;
    z-index:5!important;
    background:transparent!important;
  }

  /* Restore visible business/event/category data. */
  body.city-page #businessSection,
  body.city-page #eventsSection,
  body.city-page .categories,
  body.city-page .empty-city-note{
    display:block!important;
  }

  body.city-page #eventsSection[hidden]{
    display:none!important;
  }

  /* Visitor counter can remain visible below content. */
  body.city-page .visitor-counter{
    display:block!important;
  }

  /* Footer optional but visible after content. */
  body.city-page footer{
    display:block!important;
    position:relative!important;
    z-index:20!important;
    background:rgba(255,255,255,.92)!important;
  }

  /* Location note can stay hidden to save first-screen space. */
  body.city-page .location-note{
    display:none!important;
  }

  /* Rich city image remains behind header area, not entire page. */
  body.city-page.rich-city header.hero{
    position:relative!important;
    inset:auto!important;
    height:auto!important;
    min-height:0!important;
    width:100%!important;
    overflow:hidden!important;
  }

  body.city-page.rich-city header.hero .hero-media{
    position:relative!important;
    width:100%!important;
    aspect-ratio:3 / 4!important;
    height:auto!important;
  }

  /* Generic city header uses a compact clear-image banner. */
  body.city-page:not(.rich-city) header.hero{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:auto!important;
    min-height:240px!important;
  }

  body.city-page:not(.rich-city) header.hero .hero-city-image{
    position:absolute!important;
    inset:0!important;
  }

  /* Generic universal info cards flow below the image. */
  body.city-page:not(.rich-city) header.hero .universal-city-info{
    margin-top:240px!important;
  }

  /* Keep event thumbnails readable and compact. */
  body.city-page .global-banner-events{
    max-height:none!important;
    overflow:visible!important;
  }

  body.city-page .global-banner-events-list{
    overflow-x:auto!important;
    flex-wrap:nowrap!important;
  }
}


/* v84 mobile dropdown visibility fix */
@media(max-width:700px){

  /* Hero/background must stay behind all interactive controls. */
  body.city-page header.hero{
    z-index:0!important;
  }

  body.city-page header.hero .hero-media,
  body.city-page header.hero .hero-city-image{
    z-index:0!important;
  }

  body.city-page header.hero::before{
    z-index:1!important;
  }

  /* Main city content must always sit above the hero/background. */
  body.city-page main.container{
    position:relative!important;
    z-index:50!important;
    isolation:isolate!important;
  }

  /* Explicitly keep location controls at the top of the stacking context. */
  body.city-page .location-controls{
    position:relative!important;
    z-index:100!important;
    display:grid!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    background:rgba(255,255,255,.94)!important;
    border:1px solid rgba(255,255,255,.8)!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }

  body.city-page .location-controls select,
  body.city-page .location-controls input,
  body.city-page .country-picker-button{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    background:#fff!important;
    color:#16263d!important;
    border:1px solid #d8d2c6!important;
  }

  /* Custom country dropdown menu must appear over everything. */
  body.city-page .country-picker-wrap{
    position:relative!important;
    z-index:120!important;
  }

  body.city-page .country-picker-menu{
    z-index:9999!important;
  }

  /* Keep Business / Events buttons below dropdowns, but still above background. */
  body.city-page .city-main-tabs,
  body.city-page .tabs{
    position:relative!important;
    z-index:90!important;
  }

  /* Information cards follow the controls rather than covering them. */
  body.city-page header.hero .hero-mobile-panels,
  body.city-page header.hero .universal-city-info{
    z-index:10!important;
  }
}


/* v85 mobile controls in normal document flow */
@media(max-width:700px){

  /* Reset previous fixed/fullscreen dashboard behavior. */
  body.city-page{
    min-height:100%;
    overflow-x:hidden;
    background:#f8f4e9!important;
  }

  body.city-page header.hero{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:auto!important;
    min-height:220px!important;
    max-height:none!important;
    z-index:1!important;
    overflow:hidden!important;
    margin:0!important;
  }

  body.city-page.rich-city header.hero .hero-media{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:3 / 4!important;
    z-index:0!important;
  }

  body.city-page:not(.rich-city) header.hero{
    min-height:240px!important;
  }

  body.city-page main.container{
    position:relative!important;
    z-index:10!important;
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:7px!important;
    overflow:visible!important;
    background:#f8f4e9!important;
  }

  /* Controls are ordinary content at the very top of main. */
  body.city-page main.container > .location-controls{
    position:relative!important;
    inset:auto!important;
    z-index:20!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    width:100%!important;
    height:auto!important;
    margin:0 0 7px 0!important;
    padding:6px!important;
    gap:5px!important;
    background:#ffffff!important;
    border:1px solid #ddd6c8!important;
    border-radius:10px!important;
    box-shadow:0 2px 8px rgba(0,0,0,.08)!important;
    opacity:1!important;
    visibility:visible!important;
  }

  body.city-page main.container > .location-controls select,
  body.city-page main.container > .location-controls input,
  body.city-page main.container > .location-controls .country-picker-button{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    height:38px!important;
    min-height:38px!important;
    padding:6px 8px!important;
    font-size:12px!important;
    color:#16263d!important;
    background:#fff!important;
    border:1px solid #cfc8bc!important;
    border-radius:7px!important;
    opacity:1!important;
    visibility:visible!important;
  }

  body.city-page main.container > .location-controls input#searchField{
    grid-column:1 / -1!important;
  }

  body.city-page .country-picker-wrap{
    display:block!important;
    width:100%!important;
    position:relative!important;
    z-index:50!important;
  }

  body.city-page .country-picker-menu{
    z-index:9999!important;
  }

  /* Tabs stay directly below controls. */
  body.city-page .city-main-tabs,
  body.city-page .tabs{
    position:relative!important;
    z-index:15!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:6px!important;
    margin:0 0 8px 0!important;
  }

  /* Info panels remain visible, but no fixed positioning. */
  body.city-page header.hero .hero-mobile-panels,
  body.city-page header.hero .universal-city-info{
    position:relative!important;
    inset:auto!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    width:100%!important;
    margin:0!important;
    padding:7px!important;
    gap:5px!important;
    z-index:5!important;
    background:transparent!important;
  }

  /* Restore normal content visibility. */
  body.city-page #businessSection,
  body.city-page #eventsSection,
  body.city-page .categories,
  body.city-page .empty-city-note,
  body.city-page .visitor-counter{
    display:block!important;
  }

  body.city-page #eventsSection[hidden]{
    display:none!important;
  }
}


/* v86 approved city front-page proportions */
@media(max-width:700px){
  body.city-page header.hero{
    position:relative!important;
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    overflow:visible!important;
    background:#062b57!important;
  }

  body.city-page header.hero .hero-media{
    position:relative!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:4 / 3!important;
    overflow:hidden!important;
    background:#062b57!important;
  }

  body.city-page header.hero .hero-media .hero-city-image,
  body.city-page header.hero > .hero-city-image{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
    filter:none!important;
    transform:none!important;
    opacity:1!important;
  }

  body.city-page header.hero::before{
    background:linear-gradient(180deg,rgba(3,15,30,.06),rgba(3,15,30,.20))!important;
  }

  /* Information panels sit immediately under image with screenshot-like compact spacing. */
  body.city-page header.hero .hero-mobile-panels,
  body.city-page header.hero .universal-city-info{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    display:flex!important;
    flex-direction:column!important;
    gap:5px!important;
    padding:7px!important;
    margin:0!important;
    background:#062b57!important;
  }

  body.city-page .city-live-panel,
  body.city-page .global-banner-events,
  body.city-page .city-info-panel,
  body.city-page .universal-info-card{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
  }

  /* Controls match screenshot: white card, 2 columns, search full width. */
  body.city-page main.container{
    background:#f8f4e9!important;
    padding:7px!important;
  }

  body.city-page main.container > .location-controls{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:6px!important;
    padding:7px!important;
    margin:0 0 7px 0!important;
    background:#fff!important;
    border:1px solid #ded7ca!important;
    border-radius:12px!important;
  }

  body.city-page main.container > .location-controls select,
  body.city-page main.container > .location-controls input,
  body.city-page main.container > .location-controls .country-picker-button{
    height:42px!important;
    min-height:42px!important;
    font-size:13px!important;
    padding:7px 9px!important;
  }

  body.city-page main.container > .location-controls input#searchField{
    grid-column:1 / -1!important;
  }

  body.city-page .city-main-tabs,
  body.city-page .tabs{
    margin:0 0 8px 0!important;
  }
}


/* v87 currency conversion panel */
.currency-panel{
  display:block;
  width:100%;
  padding:8px 10px;
  border-radius:10px;
  background:rgba(5,25,45,.52);
  border:1px solid rgba(255,255,255,.22);
  color:#fff;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  text-shadow:0 1px 2px rgba(0,0,0,.65);
}
.currency-panel-title{
  font-size:10px;
  font-weight:800;
  margin-bottom:3px;
}
.currency-main{
  font-size:13px;
  font-weight:800;
}
.currency-updated{
  font-size:9px;
  opacity:.85;
  margin-top:2px;
}
@media(max-width:700px){
  .currency-panel{
    padding:6px 8px;
    border-radius:8px;
  }
  .currency-main{font-size:11.5px}
  .currency-updated{font-size:8.5px}
}


/* v88 Sydney approved mobile screen format */
@media(max-width:700px){
  body.sydney-approved-layout{
    background:#f7f5ef!important;
  }

  body.sydney-approved-layout header.hero{
    background:#062b57!important;
    overflow:visible!important;
  }

  body.sydney-approved-layout .hero-media{
    position:relative!important;
    width:100%!important;
    aspect-ratio:4 / 3!important;
    overflow:hidden!important;
    background:#062b57!important;
  }

  body.sydney-approved-layout .hero-media .hero-city-image{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
    filter:none!important;
    transform:none!important;
  }

  body.sydney-approved-layout .sydney-hero-title{
    position:absolute!important;
    z-index:5!important;
    top:16px!important;
    left:16px!important;
    color:#fff!important;
    text-shadow:0 2px 5px rgba(0,0,0,.75)!important;
    display:flex!important;
    flex-direction:column!important;
    pointer-events:none!important;
  }

  body.sydney-approved-layout .sydney-hero-title strong{
    font-size:25px!important;
    line-height:1.05!important;
    font-weight:900!important;
  }

  body.sydney-approved-layout .sydney-hero-title span{
    font-size:12px!important;
    margin-top:5px!important;
  }

  /* Approved screen: local time + currency share first row. */
  body.sydney-approved-layout .hero-mobile-panels{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:5px!important;
    padding:7px!important;
    background:#062b57!important;
  }

  body.sydney-approved-layout .city-live-panel{
    grid-column:1!important;
    grid-row:1!important;
    min-width:0!important;
  }

  body.sydney-approved-layout #cityCurrencyPanel{
    grid-column:2!important;
    grid-row:1!important;
    min-width:0!important;
    margin:0!important;
  }

  body.sydney-approved-layout .global-banner-events{
    grid-column:1 / -1!important;
    grid-row:2!important;
  }

  body.sydney-approved-layout .city-info-panel{
    grid-column:1 / -1!important;
    grid-row:3!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:5px!important;
  }

  body.sydney-approved-layout .city-live-panel,
  body.sydney-approved-layout #cityCurrencyPanel,
  body.sydney-approved-layout .global-banner-events,
  body.sydney-approved-layout .city-info-card{
    background:rgba(2,25,45,.94)!important;
    border:1px solid rgba(210,225,235,.48)!important;
    border-radius:9px!important;
    color:#fff!important;
    box-shadow:none!important;
  }

  body.sydney-approved-layout .city-live-panel,
  body.sydney-approved-layout #cityCurrencyPanel{
    padding:8px!important;
    font-size:10px!important;
    line-height:1.28!important;
  }

  body.sydney-approved-layout #cityCurrencyPanel .currency-main{
    font-size:11px!important;
  }

  body.sydney-approved-layout .global-banner-events{
    padding:7px!important;
  }

  body.sydney-approved-layout .city-info-card{
    padding:7px 9px!important;
    font-size:10px!important;
  }

  /* Controls match approved cream/white bottom card. */
  body.sydney-approved-layout main.container{
    padding:8px!important;
    background:#f7f5ef!important;
  }

  body.sydney-approved-layout main.container > .location-controls{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
    padding:8px!important;
    margin:0!important;
    border-radius:0!important;
    background:#f7f5ef!important;
    border:0!important;
    box-shadow:none!important;
  }

  body.sydney-approved-layout main.container > .location-controls select,
  body.sydney-approved-layout main.container > .location-controls input,
  body.sydney-approved-layout main.container > .location-controls .country-picker-button{
    min-height:48px!important;
    height:48px!important;
    border:1px solid #ddd!important;
    border-radius:9px!important;
    background:#fff!important;
    font-size:13px!important;
  }

  body.sydney-approved-layout main.container > .location-controls input#searchField{
    grid-column:1 / -1!important;
  }
}


/* v90 unified currency position across all cities */
.global-city-panel-stack{
  position:absolute;
  left:12px;
  right:12px;
  bottom:12px;
  z-index:8;
  display:flex;
  flex-direction:column;
  gap:7px;
}
.global-city-top-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
}
.global-city-events-slot{
  width:100%;
}
.global-city-bottom-stack{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr;
  gap:7px;
}
.global-city-panel-stack .universal-info-card,
.global-city-panel-stack .currency-panel{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}
.global-city-panel-stack .global-banner-events{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  display:none;
}
.global-city-panel-stack .global-banner-events.show{
  display:block;
}

@media(max-width:700px){
  .global-city-panel-stack{
    position:relative!important;
    inset:auto!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    width:100%!important;
    padding:7px!important;
    gap:5px!important;
    background:#062b57!important;
  }

  .global-city-top-row{
    grid-template-columns:1fr 1fr!important;
    gap:5px!important;
  }

  .global-city-bottom-stack{
    grid-template-columns:1fr!important;
    gap:5px!important;
  }

  .global-city-panel-stack .universal-info-card,
  .global-city-panel-stack .currency-panel{
    background:rgba(2,25,45,.94)!important;
    border:1px solid rgba(210,225,235,.48)!important;
    border-radius:9px!important;
    color:#fff!important;
  }
}


/* v91 desktop/web landmark image proportion fix */
@media(min-width:701px){

  body.city-page header.hero{
    position:relative!important;
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow:hidden!important;
    background:#0b2236!important;
  }

  /* Give desktop hero a controlled visual height instead of stretching to panel height. */
  body.city-page header.hero .hero-media{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:clamp(300px,38vw,520px)!important;
    max-height:520px!important;
    background:#0b2236!important;
    overflow:hidden!important;
  }

  body.city-page header.hero .hero-city-image,
  body.city-page header.hero .hero-media .hero-city-image{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center center!important;
    transform:none!important;
    filter:none!important;
    background:#0b2236!important;
  }

  /* Generic city pages that do not have a hero-media wrapper. */
  body.city-page:not(.rich-city) header.hero{
    min-height:360px!important;
    height:clamp(360px,38vw,520px)!important;
  }

  body.city-page:not(.rich-city) header.hero > .hero-city-image{
    object-fit:contain!important;
    object-position:center center!important;
  }

  /* Keep overlays readable without changing image dimensions. */
  body.city-page header.hero::before{
    background:linear-gradient(
      180deg,
      rgba(3,15,30,.06),
      rgba(3,15,30,.18)
    )!important;
  }

  /* Panel stacks should overlay/flow without controlling the image's geometry. */
  body.city-page .global-city-panel-stack,
  body.city-page .hero-mobile-panels{
    max-width:calc(100% - 24px)!important;
  }
}


/* v92 compact content-sized top panels + overlap fix */

/* Shared: top informational cards should size to content rather than consume huge width. */
.city-live-panel,
.currency-panel,
.global-city-top-row .universal-info-card{
  width:max-content!important;
  max-width:min(360px,100%)!important;
}

/* Generic city top row */
.global-city-top-row{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}

.global-city-top-row .universal-info-card,
.global-city-top-row .currency-panel{
  flex:0 0 auto!important;
  min-width:210px!important;
}

/* Desktop: do not let compact panels overlap the image/panel stacks. */
@media(min-width:701px){
  .global-city-panel-stack{
    position:absolute!important;
    left:16px!important;
    right:16px!important;
    bottom:16px!important;
    display:flex!important;
    flex-direction:column!important;
    gap:8px!important;
    pointer-events:none!important;
  }

  .global-city-panel-stack > *{
    pointer-events:auto!important;
  }

  .global-city-top-row{
    width:auto!important;
    max-width:760px!important;
  }

  .global-city-events-slot{
    width:min(760px,100%)!important;
  }

  .global-city-bottom-stack{
    width:min(1000px,100%)!important;
  }

  /* Rich Sydney/Gilbert: replace conflicting absolute panel positioning with one controlled stack. */
  body.city-page.rich-city header.hero .hero-mobile-panels{
    position:absolute!important;
    left:16px!important;
    right:16px!important;
    bottom:16px!important;
    top:auto!important;
    display:grid!important;
    grid-template-columns:max-content max-content!important;
    grid-template-areas:
      "live currency"
      "events events"
      "info info"!important;
    justify-content:start!important;
    align-items:start!important;
    gap:8px!important;
    width:auto!important;
    max-width:none!important;
    padding:0!important;
    margin:0!important;
    z-index:8!important;
  }

  body.city-page.rich-city .city-live-panel{
    grid-area:live!important;
    position:relative!important;
    inset:auto!important;
    min-width:210px!important;
    width:max-content!important;
    max-width:330px!important;
    margin:0!important;
  }

  body.city-page.rich-city #cityCurrencyPanel{
    grid-area:currency!important;
    position:relative!important;
    inset:auto!important;
    min-width:210px!important;
    width:max-content!important;
    max-width:330px!important;
    margin:0!important;
  }

  body.city-page.rich-city .global-banner-events{
    grid-area:events!important;
    position:relative!important;
    inset:auto!important;
    width:min(720px,100%)!important;
    max-width:720px!important;
    margin:0!important;
  }

  body.city-page.rich-city .city-info-panel{
    grid-area:info!important;
    position:relative!important;
    inset:auto!important;
    width:min(900px,100%)!important;
    max-width:900px!important;
    margin:0!important;
    display:grid!important;
    grid-template-columns:1.5fr 1fr 1fr!important;
    gap:8px!important;
  }

  /* Avoid old individual absolute positions fighting this grid. */
  body.city-page.rich-city .city-live-panel,
  body.city-page.rich-city #cityCurrencyPanel,
  body.city-page.rich-city .global-banner-events,
  body.city-page.rich-city .city-info-panel{
    transform:none!important;
  }
}

/* Mobile: top pair compact but safe, never overlap. */
@media(max-width:700px){
  .global-city-top-row{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    width:100%!important;
    gap:5px!important;
  }

  .global-city-top-row .universal-info-card,
  .global-city-top-row .currency-panel{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
  }

  body.city-page.rich-city header.hero .hero-mobile-panels{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:5px!important;
    width:100%!important;
  }

  body.city-page.rich-city .city-live-panel,
  body.city-page.rich-city #cityCurrencyPanel{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    position:relative!important;
    inset:auto!important;
    margin:0!important;
  }

  body.city-page.rich-city .global-banner-events,
  body.city-page.rich-city .city-info-panel{
    grid-column:1 / -1!important;
    width:100%!important;
    max-width:none!important;
    position:relative!important;
    inset:auto!important;
    margin:0!important;
  }

  body.city-page.rich-city .city-info-panel{
    display:grid!important;
    grid-template-columns:1fr!important;
  }
}


/* v93 balanced symmetric city panels */

/* Currency is intrinsically compact everywhere. */
.currency-panel{
  width:max-content!important;
  min-width:0!important;
  max-width:260px!important;
  padding:7px 9px!important;
}
.currency-panel .currency-main{
  white-space:nowrap;
}
.currency-panel .currency-updated{
  white-space:nowrap;
}

/* GENERIC DESKTOP:
   left = time/weather + forecast
   center = tight currency
   right = public holiday + school holidays
   events = centered strip */
@media(min-width:701px){
  .global-city-panel-stack{
    position:absolute!important;
    left:16px!important;
    right:16px!important;
    bottom:16px!important;
    display:grid!important;
    grid-template-columns:minmax(220px,330px) max-content minmax(220px,330px)!important;
    grid-template-areas:
      "left currency right"
      "events events events"!important;
    justify-content:space-between!important;
    align-items:end!important;
    column-gap:12px!important;
    row-gap:10px!important;
    width:auto!important;
  }

  .global-city-top-row{
    display:contents!important;
  }

  .global-city-top-row .universal-time-weather-card{
    grid-area:left!important;
    width:100%!important;
    max-width:330px!important;
    margin:0!important;
  }

  .global-city-top-row .currency-panel{
    grid-area:currency!important;
    justify-self:center!important;
    align-self:end!important;
  }

  .global-city-bottom-stack{
    display:contents!important;
  }

  .global-city-bottom-stack .universal-forecast-card{
    grid-area:left!important;
    width:100%!important;
    max-width:330px!important;
    margin-top:92px!important;
  }

  .global-city-bottom-stack .universal-public-holiday-card,
  .global-city-bottom-stack .universal-school-holiday-card{
    grid-area:right!important;
    width:100%!important;
    max-width:330px!important;
  }

  .global-city-bottom-stack .universal-public-holiday-card{
    align-self:start!important;
    margin-bottom:64px!important;
  }

  .global-city-bottom-stack .universal-school-holiday-card{
    align-self:end!important;
  }

  .global-city-events-slot{
    grid-area:events!important;
    display:flex!important;
    justify-content:center!important;
    width:100%!important;
  }

  .global-city-events-slot .global-banner-events{
    width:max-content!important;
    max-width:min(760px,90vw)!important;
  }

  /* RICH DESKTOP (Sydney/Gilbert) */
  body.city-page.rich-city header.hero .hero-mobile-panels{
    position:absolute!important;
    left:16px!important;
    right:16px!important;
    bottom:16px!important;
    display:grid!important;
    grid-template-columns:minmax(220px,330px) max-content minmax(220px,330px)!important;
    grid-template-areas:
      "left currency right"
      "events events events"!important;
    justify-content:space-between!important;
    align-items:end!important;
    gap:10px 12px!important;
    width:auto!important;
    padding:0!important;
    z-index:10!important;
  }

  body.city-page.rich-city .city-live-panel{
    grid-area:left!important;
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-width:330px!important;
    margin:0!important;
  }

  body.city-page.rich-city #cityCurrencyPanel{
    grid-area:currency!important;
    position:relative!important;
    inset:auto!important;
    justify-self:center!important;
    align-self:end!important;
    width:max-content!important;
    max-width:260px!important;
    margin:0!important;
  }

  body.city-page.rich-city .city-info-panel{
    grid-area:right!important;
    position:relative!important;
    inset:auto!important;
    display:flex!important;
    flex-direction:column!important;
    gap:6px!important;
    width:100%!important;
    max-width:330px!important;
    margin:0!important;
    background:transparent!important;
    border:0!important;
    backdrop-filter:none!important;
  }

  body.city-page.rich-city .rich-forecast-card{
    /* forecast belongs visually with local time/weather */
    position:absolute!important;
    left:calc(-100vw + 362px)!important;
    bottom:0!important;
    width:330px!important;
    max-width:330px!important;
  }

  body.city-page.rich-city .rich-public-holiday-card,
  body.city-page.rich-city .rich-school-holiday-card{
    width:100%!important;
  }

  body.city-page.rich-city .global-banner-events{
    grid-area:events!important;
    position:relative!important;
    inset:auto!important;
    justify-self:center!important;
    width:max-content!important;
    max-width:min(760px,90vw)!important;
    margin:0!important;
  }
}

/* MOBILE:
   row 1 = time/weather + compact currency
   row 2 = 3-day forecast
   row 3 = public + school together
   row 4 = events */
@media(max-width:700px){
  .currency-panel{
    width:max-content!important;
    max-width:100%!important;
    justify-self:end!important;
  }

  .global-city-panel-stack{
    display:grid!important;
    grid-template-columns:1fr max-content!important;
    grid-template-areas:
      "time currency"
      "forecast forecast"
      "holiday holiday"
      "events events"!important;
    gap:5px!important;
    padding:7px!important;
  }

  .global-city-top-row{
    display:contents!important;
  }
  .global-city-top-row .universal-time-weather-card{grid-area:time!important;width:100%!important;min-width:0!important;}
  .global-city-top-row .currency-panel{grid-area:currency!important;}

  .global-city-bottom-stack{
    display:grid!important;
    grid-area:holiday!important;
    grid-template-columns:1fr 1fr!important;
    gap:5px!important;
  }
  .global-city-bottom-stack .universal-forecast-card{
    grid-column:1 / -1!important;
    grid-row:1!important;
    width:100%!important;
  }
  .global-city-bottom-stack .universal-public-holiday-card{
    grid-column:1!important;
    grid-row:2!important;
  }
  .global-city-bottom-stack .universal-school-holiday-card{
    grid-column:2!important;
    grid-row:2!important;
  }
  .global-city-events-slot{grid-area:events!important;}

  body.city-page.rich-city header.hero .hero-mobile-panels{
    display:grid!important;
    grid-template-columns:1fr max-content!important;
    grid-template-areas:
      "time currency"
      "forecast forecast"
      "holiday holiday"
      "events events"!important;
    gap:5px!important;
    width:100%!important;
    padding:7px!important;
  }

  body.city-page.rich-city .city-live-panel{
    grid-area:time!important;
    width:100%!important;
    min-width:0!important;
  }
  body.city-page.rich-city #cityCurrencyPanel{
    grid-area:currency!important;
    width:max-content!important;
    min-width:0!important;
    max-width:230px!important;
  }
  body.city-page.rich-city .city-info-panel{
    display:grid!important;
    grid-area:holiday!important;
    grid-template-columns:1fr 1fr!important;
    gap:5px!important;
    width:100%!important;
  }
  body.city-page.rich-city .rich-forecast-card{
    grid-column:1 / -1!important;
    grid-row:1!important;
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-width:none!important;
  }
  body.city-page.rich-city .rich-public-holiday-card{
    grid-column:1!important;
    grid-row:2!important;
  }
  body.city-page.rich-city .rich-school-holiday-card{
    grid-column:2!important;
    grid-row:2!important;
  }
  body.city-page.rich-city .global-banner-events{
    grid-area:events!important;
    width:100%!important;
    max-width:none!important;
  }
}


/* v94 strict symmetric side-panel layout for every city */

.hero-balanced-layout{
  position:relative!important;
  display:grid!important;
  grid-template-columns:260px minmax(360px,1fr) 260px!important;
  align-items:stretch!important;
  gap:12px!important;
  width:100%!important;
  min-height:430px!important;
  height:auto!important;
  padding:12px!important;
  overflow:visible!important;
  background:#0b2236!important;
}

.hero-balanced-layout::before{
  display:none!important;
}

.hero-balanced-layout .hero-center{
  min-width:0!important;
  min-height:0!important;
  display:flex!important;
}

.hero-balanced-layout .hero-media{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  height:100%!important;
  min-height:406px!important;
  overflow:hidden!important;
  border-radius:12px!important;
  background:#071b2e!important;
}

.hero-balanced-layout .hero-city-image{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  filter:none!important;
  transform:none!important;
  opacity:1!important;
  background:#071b2e!important;
}

.hero-balanced-layout .hero-city-title{
  position:absolute!important;
  top:14px!important;
  left:16px!important;
  z-index:4!important;
  display:flex!important;
  flex-direction:column!important;
  gap:2px!important;
  color:#fff!important;
  text-shadow:0 2px 5px rgba(0,0,0,.8)!important;
  pointer-events:none!important;
}

.hero-balanced-layout .hero-city-title strong{
  font-size:24px!important;
  line-height:1.05!important;
  font-weight:900!important;
}

.hero-balanced-layout .hero-city-title span{
  font-size:11px!important;
}

.hero-balanced-layout .hero-side{
  display:grid!important;
  grid-template-rows:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
  min-width:0!important;
  height:100%!important;
}

.hero-balanced-layout .hero-panel-wrap{
  position:relative!important;
  min-width:0!important;
  min-height:0!important;
  display:flex!important;
}

.hero-balanced-layout .hero-panel-wrap > *{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  height:100%!important;
  max-height:none!important;
  margin:0!important;
  padding:10px!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  border-radius:10px!important;
  background:rgba(2,25,45,.95)!important;
  border:1px solid rgba(210,225,235,.42)!important;
  color:#fff!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  text-shadow:0 1px 2px rgba(0,0,0,.7)!important;
}

/* Left side: Time/Weather, Forecast, Currency */
.hero-balanced-layout .hero-panel-time > *,
.hero-balanced-layout .hero-panel-forecast > *,
.hero-balanced-layout .hero-panel-currency > *{
  font-size:11px!important;
  line-height:1.3!important;
}

.hero-balanced-layout .hero-panel-time strong,
.hero-balanced-layout .hero-panel-forecast strong,
.hero-balanced-layout .hero-panel-currency .currency-panel-title,
.hero-balanced-layout .hero-panel-time .universal-info-title,
.hero-balanced-layout .hero-panel-forecast .universal-info-title{
  display:block!important;
  margin-bottom:5px!important;
  font-size:12px!important;
  line-height:1.2!important;
  font-weight:800!important;
}

.hero-balanced-layout .hero-panel-time .universal-time,
.hero-balanced-layout .hero-panel-time #cityLiveTime{
  font-size:18px!important;
  line-height:1.05!important;
  font-weight:800!important;
}

.hero-balanced-layout .hero-panel-currency .currency-main{
  white-space:normal!important;
  font-size:15px!important;
  line-height:1.2!important;
  font-weight:900!important;
}

.hero-balanced-layout .hero-panel-currency .currency-updated{
  white-space:normal!important;
  margin-top:5px!important;
  font-size:9.5px!important;
}

/* Right side: holiday, school holiday, event flyers */
.hero-balanced-layout .hero-panel-public > *,
.hero-balanced-layout .hero-panel-school > *{
  font-size:11px!important;
  line-height:1.32!important;
}

.hero-balanced-layout .hero-panel-public strong,
.hero-balanced-layout .hero-panel-school strong,
.hero-balanced-layout .hero-panel-public .universal-info-title,
.hero-balanced-layout .hero-panel-school .universal-info-title{
  display:block!important;
  margin-bottom:5px!important;
  font-size:12px!important;
  line-height:1.2!important;
  font-weight:800!important;
}

/* Events occupies exactly the third right-side slot when there are active flyers. */
.hero-balanced-layout .hero-panel-events .global-banner-events{
  display:none!important;
}

.hero-balanced-layout .hero-panel-events .global-banner-events.show{
  display:block!important;
}

.hero-balanced-layout .hero-panel-events .global-banner-events-list{
  display:flex!important;
  gap:5px!important;
  flex-wrap:wrap!important;
  overflow:hidden!important;
}

.hero-balanced-layout .hero-panel-events .global-banner-event-month{
  padding:4px!important;
  border-radius:6px!important;
}

.hero-balanced-layout .hero-panel-events .global-banner-event-month-title{
  font-size:8px!important;
  margin-bottom:3px!important;
}

.hero-balanced-layout .hero-panel-events .global-banner-event-thumb{
  width:34px!important;
  height:44px!important;
}

.hero-balanced-layout .hero-panel-events .global-banner-events-all-link{
  min-height:48px!important;
  font-size:8px!important;
  padding:3px 5px!important;
}

/* Remove all legacy grid/absolute positioning from normalized city heroes. */
.hero-balanced-layout .city-live-panel,
.hero-balanced-layout .city-info-panel,
.hero-balanced-layout .city-info-card,
.hero-balanced-layout .currency-panel,
.hero-balanced-layout .universal-info-card,
.hero-balanced-layout .global-banner-events{
  grid-area:auto!important;
  transform:none!important;
}

/* Tablet */
@media(max-width:1050px) and (min-width:701px){
  .hero-balanced-layout{
    grid-template-columns:220px minmax(300px,1fr) 220px!important;
    gap:8px!important;
    padding:8px!important;
  }
  .hero-balanced-layout .hero-panel-wrap > *{
    padding:8px!important;
    font-size:10px!important;
  }
  .hero-balanced-layout .hero-city-title strong{
    font-size:21px!important;
  }
}

/* Mobile: image first, then two clean 3-panel stacks. No overlays. */
@media(max-width:700px){
  .hero-balanced-layout{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    min-height:0!important;
    gap:7px!important;
    padding:7px!important;
    background:#062b57!important;
  }

  .hero-balanced-layout .hero-center{
    order:1!important;
    width:100%!important;
  }

  .hero-balanced-layout .hero-media{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:4 / 3!important;
    border-radius:10px!important;
  }

  .hero-balanced-layout .hero-city-image{
    object-fit:cover!important;
  }

  .hero-balanced-layout .hero-side-left{
    order:2!important;
  }

  .hero-balanced-layout .hero-side-right{
    order:3!important;
  }

  .hero-balanced-layout .hero-side{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:none!important;
    gap:5px!important;
    width:100%!important;
    height:auto!important;
  }

  .hero-balanced-layout .hero-panel-wrap{
    min-height:72px!important;
  }

  .hero-balanced-layout .hero-panel-wrap > *{
    min-height:72px!important;
    height:auto!important;
    padding:8px!important;
  }

  .hero-balanced-layout .hero-panel-events:has(.global-banner-events:not(.show)){
    display:none!important;
  }
}


/* v95 city overlay removal */
body.city-page .hero-city-title,
body.city-page .hero-label{
  display:none!important;
}


/* v96 strict landmark image proportion lock */

/* Never distort landmark images. */
body.city-page .hero-city-image{
  transform:none!important;
  filter:none!important;
  object-position:center center!important;
}

/* Desktop/tablet: preserve the complete image inside the center frame. */
@media(min-width:701px){
  body.city-page .hero-balanced-layout .hero-center{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:0!important;
    overflow:hidden!important;
  }

  body.city-page .hero-balanced-layout .hero-media{
    position:relative!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:16 / 9!important;
    max-height:none!important;
    overflow:hidden!important;
    background:#071b2e!important;
    border-radius:12px!important;
  }

  body.city-page .hero-balanced-layout .hero-city-image{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-width:100%!important;
    max-height:100%!important;
    object-fit:contain!important;
    object-position:center center!important;
    background:#071b2e!important;
  }
}

/* Mobile: fixed banner frame, with cover crop only — never stretching. */
@media(max-width:700px){
  body.city-page .hero-balanced-layout .hero-media{
    position:relative!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:4 / 3!important;
    overflow:hidden!important;
    background:#071b2e!important;
    border-radius:10px!important;
  }

  body.city-page .hero-balanced-layout .hero-city-image{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-width:100%!important;
    max-height:100%!important;
    object-fit:cover!important;
    object-position:center center!important;
    transform:none!important;
  }
}


/* v98 strict fixed-panel typography fit
   IMPORTANT: panel dimensions are intentionally NOT changed here. */

/* Default panel text sizing */
.hero-balanced-layout .hero-panel-wrap > *{
  font-size:12px!important;
  line-height:1.34!important;
}

/* Panel headings */
.hero-balanced-layout .hero-panel-wrap strong,
.hero-balanced-layout .hero-panel-wrap .universal-info-title,
.hero-balanced-layout .hero-panel-wrap .currency-panel-title,
.hero-balanced-layout .hero-panel-wrap .global-banner-events-title{
  font-size:13px!important;
  line-height:1.22!important;
  font-weight:800!important;
  margin-bottom:6px!important;
}

/* Local time/weather: use more of the panel */
.hero-balanced-layout .hero-panel-time #cityLiveTime,
.hero-balanced-layout .hero-panel-time .universal-time{
  font-size:22px!important;
  line-height:1.02!important;
  font-weight:900!important;
  margin-bottom:4px!important;
}

.hero-balanced-layout .hero-panel-time #cityLiveDate,
.hero-balanced-layout .hero-panel-time .universal-muted{
  font-size:11px!important;
  line-height:1.25!important;
}

.hero-balanced-layout .hero-panel-time #cityWeatherMain,
.hero-balanced-layout .hero-panel-time #cityWeatherExtra,
.hero-balanced-layout .hero-panel-time #universalCurrentWeather{
  font-size:12px!important;
  line-height:1.3!important;
}

/* 3-day forecast */
.hero-balanced-layout .hero-panel-forecast > *,
.hero-balanced-layout .hero-panel-forecast #cityForecastSummary,
.hero-balanced-layout .hero-panel-forecast #universalForecast{
  font-size:12.5px!important;
  line-height:1.36!important;
}

/* Currency: compact panel, but larger actual rate */
.hero-balanced-layout .hero-panel-currency .currency-main{
  font-size:19px!important;
  line-height:1.1!important;
  font-weight:900!important;
  white-space:normal!important;
}

.hero-balanced-layout .hero-panel-currency .currency-updated{
  font-size:10.5px!important;
  line-height:1.25!important;
  margin-top:6px!important;
}

/* Public holiday + school holiday */
.hero-balanced-layout .hero-panel-public > *,
.hero-balanced-layout .hero-panel-public #cityPublicHoliday,
.hero-balanced-layout .hero-panel-public #universalPublicHoliday,
.hero-balanced-layout .hero-panel-school > *,
.hero-balanced-layout .hero-panel-school #citySchoolHoliday,
.hero-balanced-layout .hero-panel-school #universalSchoolHoliday{
  font-size:13px!important;
  line-height:1.38!important;
}

/* Event flyer panel */
.hero-balanced-layout .hero-panel-events .global-banner-events-title{
  font-size:12px!important;
}

.hero-balanced-layout .hero-panel-events .global-banner-event-month-title{
  font-size:9px!important;
  line-height:1.15!important;
}

.hero-balanced-layout .hero-panel-events .global-banner-events-all-link{
  font-size:9px!important;
  line-height:1.15!important;
}

/* Tablet: scale typography only, not panel geometry */
@media(max-width:1050px) and (min-width:701px){
  .hero-balanced-layout .hero-panel-wrap > *{
    font-size:10.5px!important;
    line-height:1.28!important;
  }

  .hero-balanced-layout .hero-panel-wrap strong,
  .hero-balanced-layout .hero-panel-wrap .universal-info-title,
  .hero-balanced-layout .hero-panel-wrap .currency-panel-title,
  .hero-balanced-layout .hero-panel-wrap .global-banner-events-title{
    font-size:11.5px!important;
  }

  .hero-balanced-layout .hero-panel-time #cityLiveTime,
  .hero-balanced-layout .hero-panel-time .universal-time{
    font-size:18px!important;
  }

  .hero-balanced-layout .hero-panel-currency .currency-main{
    font-size:16px!important;
  }

  .hero-balanced-layout .hero-panel-public > *,
  .hero-balanced-layout .hero-panel-public #cityPublicHoliday,
  .hero-balanced-layout .hero-panel-public #universalPublicHoliday,
  .hero-balanced-layout .hero-panel-school > *,
  .hero-balanced-layout .hero-panel-school #citySchoolHoliday,
  .hero-balanced-layout .hero-panel-school #universalSchoolHoliday{
    font-size:11.5px!important;
  }
}

/* Mobile: typography only; preserve v97/v96 panel sizes */
@media(max-width:700px){
  .hero-balanced-layout .hero-panel-wrap > *{
    font-size:11px!important;
    line-height:1.28!important;
  }

  .hero-balanced-layout .hero-panel-wrap strong,
  .hero-balanced-layout .hero-panel-wrap .universal-info-title,
  .hero-balanced-layout .hero-panel-wrap .currency-panel-title,
  .hero-balanced-layout .hero-panel-wrap .global-banner-events-title{
    font-size:12px!important;
    margin-bottom:4px!important;
  }

  .hero-balanced-layout .hero-panel-time #cityLiveTime,
  .hero-balanced-layout .hero-panel-time .universal-time{
    font-size:19px!important;
  }

  .hero-balanced-layout .hero-panel-currency .currency-main{
    font-size:16px!important;
  }

  .hero-balanced-layout .hero-panel-currency .currency-updated{
    font-size:9.5px!important;
  }

  .hero-balanced-layout .hero-panel-public > *,
  .hero-balanced-layout .hero-panel-public #cityPublicHoliday,
  .hero-balanced-layout .hero-panel-public #universalPublicHoliday,
  .hero-balanced-layout .hero-panel-school > *,
  .hero-balanced-layout .hero-panel-school #citySchoolHoliday,
  .hero-balanced-layout .hero-panel-school #universalSchoolHoliday{
    font-size:11.5px!important;
    line-height:1.32!important;
  }
}

/* Safety: keep text inside the existing panel boxes. */
.hero-balanced-layout .hero-panel-wrap,
.hero-balanced-layout .hero-panel-wrap > *{
  overflow:hidden!important;
}

.hero-balanced-layout .hero-panel-wrap *{
  overflow-wrap:anywhere;
  word-break:normal;
}


/* v100 strict panel content/alignment fix
   PANEL GEOMETRY IS NOT CHANGED. */

/* Ensure the 3-day forecast slot is always visible on web. */
.hero-balanced-layout .hero-panel-forecast{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
}

.hero-balanced-layout .hero-panel-forecast > *{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
}

/* Local Time/Weather and Currency occupy the exact same EXISTING slot width.
   The parent slot dimensions are untouched. */
.hero-balanced-layout .hero-panel-time > *,
.hero-balanced-layout .hero-panel-currency > *{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  margin:0!important;
  box-sizing:border-box!important;
}

/* Do not allow legacy max-content currency rules to shrink/expand the card. */
.hero-balanced-layout .hero-panel-currency .currency-panel{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
}

/* Center all informational text without altering panel sizes. */
.hero-balanced-layout .hero-panel-time > *,
.hero-balanced-layout .hero-panel-forecast > *,
.hero-balanced-layout .hero-panel-currency > *,
.hero-balanced-layout .hero-panel-public > *,
.hero-balanced-layout .hero-panel-school > *,
.hero-balanced-layout .hero-panel-events > *{
  text-align:center!important;
}

.hero-balanced-layout .hero-panel-time *,
.hero-balanced-layout .hero-panel-forecast *,
.hero-balanced-layout .hero-panel-currency *,
.hero-balanced-layout .hero-panel-public *,
.hero-balanced-layout .hero-panel-school *{
  text-align:center!important;
}

/* Forecast values may have inherited hidden/absolute rules from older versions. */
.hero-balanced-layout #cityForecastSummary,
.hero-balanced-layout #universalForecast{
  position:relative!important;
  inset:auto!important;
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  width:100%!important;
  height:auto!important;
  max-height:none!important;
  overflow:visible!important;
}

/* Rich and generic forecast cards fill their pre-existing forecast slot. */
.hero-balanced-layout .rich-forecast-card,
.hero-balanced-layout .universal-forecast-card{
  position:relative!important;
  inset:auto!important;
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  height:100%!important;
  margin:0!important;
  transform:none!important;
}

/* Keep panel content vertically balanced within its locked panel area. */
.hero-balanced-layout .hero-panel-time > *,
.hero-balanced-layout .hero-panel-forecast > *,
.hero-balanced-layout .hero-panel-currency > *,
.hero-balanced-layout .hero-panel-public > *,
.hero-balanced-layout .hero-panel-school > *{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:stretch!important;
}

/* Event panel keeps its own flyer layout while heading is centered. */
.hero-balanced-layout .hero-panel-events .global-banner-events-title{
  text-align:center!important;
}

/* Desktop-specific safeguard: forecast cannot be removed by old desktop rules. */
@media(min-width:701px){
  .hero-balanced-layout .hero-panel-forecast,
  .hero-balanced-layout .hero-panel-forecast > *,
  .hero-balanced-layout .rich-forecast-card,
  .hero-balanced-layout .universal-forecast-card,
  .hero-balanced-layout #cityForecastSummary,
  .hero-balanced-layout #universalForecast{
    display:flex!important;
  }

  .hero-balanced-layout #cityForecastSummary,
  .hero-balanced-layout #universalForecast{
    flex-direction:column!important;
    justify-content:center!important;
  }

  /* Equal card width within the already-equal left-side slot geometry. */
  .hero-balanced-layout .hero-panel-time > *,
  .hero-balanced-layout .hero-panel-currency > *{
    inline-size:100%!important;
  }
}




/* v105 global Call + WhatsApp phone actions */
.phone-number-link{
  white-space:nowrap;
}
.phone-action-buttons{
  display:inline-flex;
  align-items:center;
  gap:5px;
  margin-left:7px;
  vertical-align:middle;
}
.phone-action-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:25px;
  padding:3px 7px;
  border-radius:6px;
  border:1px solid var(--border);
  background:#fff;
  color:#062b57!important;
  text-decoration:none!important;
  font-size:10px;
  line-height:1;
  font-weight:800;
  white-space:nowrap;
}
.phone-action-btn:hover{
  text-decoration:none!important;
  filter:brightness(.97);
}
.phone-whatsapp-btn{
  border-color:#8bcf9b;
}
@media(max-width:700px){
  .phone-action-buttons{
    gap:4px;
    margin-left:5px;
  }
  .phone-action-btn{
    min-height:27px;
    padding:4px 7px;
    font-size:10px;
  }
}


/* v106 compact phone/WhatsApp icons */
.phone-action-buttons{
  gap:6px!important;
}
.phone-action-btn{
  width:28px!important;
  height:28px!important;
  min-width:28px!important;
  min-height:28px!important;
  padding:5px!important;
  border-radius:50%!important;
  line-height:1!important;
}
.phone-action-icon{
  display:block;
  width:16px;
  height:16px;
  fill:currentColor;
}
.phone-call-btn{
  color:#145a86!important;
}
.phone-whatsapp-btn{
  color:#128c3e!important;
  border-color:#8bcf9b!important;
}
@media(max-width:700px){
  .phone-action-btn{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
  }
  .phone-action-icon{
    width:17px;
    height:17px;
  }
}


/* v115 search input focus/typing hardening */
body.city-page main.container > .location-controls input#searchField{
  position:relative!important;
  z-index:500!important;
  pointer-events:auto!important;
  touch-action:manipulation!important;
  user-select:text!important;
  -webkit-user-select:text!important;
  caret-color:auto!important;
  opacity:1!important;
  visibility:visible!important;
  cursor:text!important;
  background:#fff!important;
}

body.city-page main.container > .location-controls input#searchField:focus{
  z-index:10001!important;
  outline:2px solid rgba(25,95,170,.38)!important;
  outline-offset:1px!important;
}

/* A closed custom country menu must never intercept taps over other controls. */
body.city-page .country-picker-menu:not(.open){
  display:none!important;
  pointer-events:none!important;
}

body.city-page .country-picker-menu.open{
  pointer-events:auto!important;
}

@media(max-width:700px){
  body.city-page main.container > .location-controls input#searchField{
    position:relative!important;
    z-index:10000!important;
    pointer-events:auto!important;
    -webkit-appearance:textfield!important;
  }
}

/* v122 Pure Vegetarian marker */
.pure-veg-mark{display:inline-flex;width:15px;height:15px;margin-left:6px;border:2px solid #138808;border-radius:2px;align-items:center;justify-content:center;vertical-align:-2px;box-sizing:border-box;background:#fff}
.pure-veg-mark>span{display:block;width:7px;height:7px;border-radius:50%;background:#138808}

/* v124: dedicated vegetarian-symbol column is column 1 on every rich-city listing. */
.business-listing.business-listing-with-veg{
  grid-template-columns:30px minmax(180px,1.5fr) minmax(120px,.8fr) minmax(120px,.8fr) minmax(90px,.65fr) minmax(140px,1fr)!important;
}
.business-listing.business-listing-with-veg>.veg-symbol-col{
  width:30px!important;
  min-width:30px!important;
  max-width:30px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 4px!important;
  box-sizing:border-box!important;
}
.business-listing.business-listing-with-veg>.veg-symbol-col .pure-veg-mark{
  margin:0!important;
}
@media(max-width:700px){
  .business-listing.business-listing-with-veg{
    grid-template-columns:26px minmax(0,1fr)!important;
  }
  .business-listing.business-listing-with-veg>.veg-symbol-col{
    grid-column:1!important;
    grid-row:1 / span 5!important;
    width:26px!important;
    min-width:26px!important;
    max-width:26px!important;
    align-self:stretch!important;
    padding:4px 2px!important;
  }
  .business-listing.business-listing-with-veg>.business-name-col{
    grid-column:2!important;
    grid-row:1!important;
  }
  .business-listing.business-listing-with-veg>div:nth-child(n+3){
    grid-column:2!important;
  }
}

/* v125 category/listing serials */
.business-category>h2 .category-serial{
  display:inline-block;
  min-width:24px;
  font-weight:800;
  text-align:right;
  margin-right:4px;
}

.business-listing.business-listing-with-veg{
  grid-template-columns:
    28px
    30px
    minmax(180px,1.5fr)
    minmax(120px,.8fr)
    minmax(120px,.8fr)
    minmax(90px,.65fr)
    minmax(140px,1fr)!important;
}

.business-listing.business-listing-with-veg>.listing-alpha-col{
  width:28px!important;
  min-width:28px!important;
  max-width:28px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  padding-right:4px!important;
  box-sizing:border-box!important;
  font-weight:800!important;
  text-transform:lowercase!important;
}

@media(max-width:700px){
  .business-listing.business-listing-with-veg{
    grid-template-columns:24px 26px minmax(0,1fr)!important;
  }

  .business-listing.business-listing-with-veg>.listing-alpha-col{
    grid-column:1!important;
    grid-row:1 / span 5!important;
    width:24px!important;
    min-width:24px!important;
    max-width:24px!important;
    align-self:stretch!important;
    align-items:flex-start!important;
    justify-content:flex-end!important;
    padding:5px 3px 0 0!important;
  }

  .business-listing.business-listing-with-veg>.veg-symbol-col{
    grid-column:2!important;
    grid-row:1 / span 5!important;
  }

  .business-listing.business-listing-with-veg>.business-name-col{
    grid-column:3!important;
    grid-row:1!important;
  }

  .business-listing.business-listing-with-veg>div:nth-child(n+4){
    grid-column:3!important;
  }

  .business-category>h2 .category-serial{
    min-width:20px;
  }
}

/* v126 listing column spacing and mobile fit hardening */

/* Desktop/tablet: give business name more room and prevent text collision. */
.business-listing.business-listing-with-veg{
  display:grid!important;
  grid-template-columns:
    28px
    30px
    minmax(220px,1.7fr)
    minmax(145px,.9fr)
    minmax(145px,.9fr)
    minmax(110px,.7fr)
    minmax(170px,1.1fr)!important;
  column-gap:12px!important;
  row-gap:4px!important;
  align-items:start!important;
  width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}

.business-listing.business-listing-with-veg>div{
  min-width:0!important;
  max-width:100%!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  white-space:normal!important;
  box-sizing:border-box!important;
}

.business-listing.business-listing-with-veg>.listing-alpha-col{
  padding-right:5px!important;
  text-align:right!important;
}

.business-listing.business-listing-with-veg>.veg-symbol-col{
  padding-left:2px!important;
  padding-right:2px!important;
}

.business-listing.business-listing-with-veg>.business-name-col{
  padding-right:4px!important;
}

.business-listing.business-listing-with-veg a{
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}

/* Avoid category-heading number/icon/name crowding. */
.business-category>h2{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  flex-wrap:wrap!important;
}
.business-category>h2 .category-serial{
  flex:0 0 auto!important;
  margin-right:0!important;
}

/* Mobile: everything must fit inside viewport with no horizontal overflow.
   Serial + veg stay as two narrow columns; ALL other content stays in one flexible column. */
@media(max-width:700px){
  .business-listing.business-listing-with-veg{
    grid-template-columns:22px 24px minmax(0,1fr)!important;
    column-gap:6px!important;
    row-gap:4px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    padding:9px 7px!important;
    overflow:hidden!important;
  }

  .business-listing.business-listing-with-veg>.listing-alpha-col{
    grid-column:1!important;
    grid-row:1 / span 6!important;
    width:22px!important;
    min-width:22px!important;
    max-width:22px!important;
    align-self:stretch!important;
    justify-content:flex-end!important;
    align-items:flex-start!important;
    padding:3px 2px 0 0!important;
    font-size:11px!important;
  }

  .business-listing.business-listing-with-veg>.veg-symbol-col{
    grid-column:2!important;
    grid-row:1 / span 6!important;
    width:24px!important;
    min-width:24px!important;
    max-width:24px!important;
    align-self:stretch!important;
    padding:3px 1px!important;
  }

  .business-listing.business-listing-with-veg>.business-name-col{
    grid-column:3!important;
    grid-row:1!important;
    padding-right:0!important;
  }

  .business-listing.business-listing-with-veg>div:nth-child(n+4){
    grid-column:3!important;
    width:100%!important;
    min-width:0!important;
  }

  .business-listing.business-listing-with-veg>div{
    font-size:12px!important;
    line-height:1.35!important;
  }

  .business-listing.business-listing-with-veg>.business-name-col strong{
    font-size:13px!important;
    line-height:1.3!important;
  }

  .business-listing.business-listing-with-veg a{
    display:inline-block!important;
    max-width:100%!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }

  .business-listing.business-listing-with-veg>.veg-symbol-col .pure-veg-mark{
    width:13px!important;
    height:13px!important;
  }

  .business-listing.business-listing-with-veg>.veg-symbol-col .pure-veg-mark>span{
    width:6px!important;
    height:6px!important;
  }

  .business-category{
    width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
  }

  .business-category>h2{
    font-size:14px!important;
    line-height:1.3!important;
    gap:4px!important;
  }

  .business-category>h2 .category-serial{
    min-width:18px!important;
    text-align:right!important;
  }

  #businessDirectory,
  #businessSection,
  main.container{
    max-width:100%!important;
    overflow-x:hidden!important;
  }
}

/* Mid-width tablets: reduce columns gracefully before mobile stack. */
@media(min-width:701px) and (max-width:1100px){
  .business-listing.business-listing-with-veg{
    grid-template-columns:
      26px
      28px
      minmax(190px,1.6fr)
      minmax(130px,.85fr)
      minmax(130px,.85fr)
      minmax(100px,.7fr)
      minmax(150px,1fr)!important;
    column-gap:9px!important;
  }
}

/* v127: Business / Contact and Phone use equal width. */
.business-listing.business-listing-with-veg{
  grid-template-columns:28px 30px minmax(170px,1.15fr) minmax(170px,1.15fr) minmax(130px,.85fr) minmax(100px,.65fr) minmax(150px,1fr)!important;
  column-gap:12px!important;
}
@media(min-width:701px) and (max-width:1100px){
  .business-listing.business-listing-with-veg{
    grid-template-columns:26px 28px minmax(155px,1.1fr) minmax(155px,1.1fr) minmax(120px,.8fr) minmax(95px,.65fr) minmax(135px,.95fr)!important;
    column-gap:9px!important;
  }
}
@media(max-width:700px){
  .business-listing.business-listing-with-veg{
    grid-template-columns:22px 24px minmax(0,1fr)!important;
  }
  .business-listing.business-listing-with-veg>.business-name-col,
  .business-listing.business-listing-with-veg>div:nth-child(n+4){
    grid-column:3!important;width:100%!important;min-width:0!important;max-width:100%!important;
  }
}

/* v128 STRICT MOBILE LISTING WIDTH
   This block is intentionally last and authoritative. */
@media(max-width:700px){

  body.city-page.rich-city #businessDirectory{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:hidden!important;
    box-sizing:border-box!important;
  }

  body.city-page.rich-city .business-category{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  body.city-page.rich-city .business-listing.business-listing-with-veg{
    display:grid!important;

    /* STRICT: serial 18px + veg 18px + ALL REMAINING WIDTH for listing content */
    grid-template-columns:18px 18px minmax(0,1fr)!important;
    grid-auto-columns:minmax(0,1fr)!important;

    width:100%!important;
    max-width:100%!important;
    min-width:0!important;

    margin:0!important;
    padding:8px 5px!important;
    gap:0 4px!important;

    overflow:hidden!important;
    box-sizing:border-box!important;
    align-items:start!important;
  }

  /* Column 1: listing letter only */
  body.city-page.rich-city .business-listing.business-listing-with-veg > .listing-alpha-col{
    grid-column:1!important;
    grid-row:1 / span 6!important;

    width:18px!important;
    min-width:18px!important;
    max-width:18px!important;

    padding:3px 1px 0 0!important;
    margin:0!important;

    display:flex!important;
    align-items:flex-start!important;
    justify-content:flex-end!important;

    font-size:10px!important;
    line-height:1.2!important;
    box-sizing:border-box!important;
  }

  /* Column 2: vegetarian marker only */
  body.city-page.rich-city .business-listing.business-listing-with-veg > .veg-symbol-col{
    grid-column:2!important;
    grid-row:1 / span 6!important;

    width:18px!important;
    min-width:18px!important;
    max-width:18px!important;

    padding:2px 0!important;
    margin:0!important;

    display:flex!important;
    align-items:flex-start!important;
    justify-content:center!important;

    box-sizing:border-box!important;
  }

  body.city-page.rich-city .business-listing.business-listing-with-veg > .veg-symbol-col .pure-veg-mark{
    width:13px!important;
    height:13px!important;
    min-width:13px!important;
    max-width:13px!important;
    margin:0!important;
  }

  /* Column 3: Business / Contact gets the ENTIRE remaining width. */
  body.city-page.rich-city .business-listing.business-listing-with-veg > .business-name-col{
    grid-column:3 / -1!important;
    grid-row:1!important;

    display:block!important;
    justify-self:stretch!important;
    align-self:start!important;

    width:100%!important;
    max-width:none!important;
    min-width:0!important;

    margin:0!important;
    padding:0 0 5px 0!important;

    overflow:visible!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;

    box-sizing:border-box!important;
  }

  body.city-page.rich-city .business-listing.business-listing-with-veg > .business-name-col strong{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;

    font-size:13px!important;
    line-height:1.35!important;

    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }

  body.city-page.rich-city .business-listing.business-listing-with-veg > .business-name-col > div{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;

    margin-top:2px!important;

    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }

  /* Phone, Suburb, Website and Email use EXACTLY the same content width as Business/Contact. */
  body.city-page.rich-city .business-listing.business-listing-with-veg > div:nth-child(n+4){
    grid-column:3 / -1!important;

    display:block!important;
    justify-self:stretch!important;

    width:100%!important;
    max-width:none!important;
    min-width:0!important;

    margin:0!important;
    padding:2px 0!important;

    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;

    box-sizing:border-box!important;
  }

  body.city-page.rich-city .business-listing.business-listing-with-veg > div:nth-child(n+4) a{
    display:inline!important;
    width:auto!important;
    max-width:100%!important;

    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }

  /* Remove any child-level max-width inherited from earlier versions. */
  body.city-page.rich-city .business-listing.business-listing-with-veg > *{
    min-width:0!important;
    box-sizing:border-box!important;
  }
}

/* v135 event flyer link visibility */
.event-flyer-actions{
  display:flex;
  align-items:flex-start;
  gap:9px;
  flex-wrap:wrap;
  margin-top:8px;
}
.event-flyer-link{
  display:inline-block;
  padding:6px 9px;
  border-radius:7px;
  background:#062b57;
  color:#fff!important;
  text-decoration:none!important;
  font-size:12px;
  font-weight:800;
}
@media(max-width:700px){
  .event-flyer-actions{
    width:100%;
  }
  .event-flyer-link{
    font-size:12px;
  }
}

/* v138 authoritative Businesses / Events tab visibility */
body.city-page.rich-city #businessSection.tab-panel-hidden,
body.city-page.rich-city #eventsSection.tab-panel-hidden,
body.city-page.rich-city #businessSection[hidden],
body.city-page.rich-city #eventsSection[hidden]{
  display:none!important;
}

body.city-page.rich-city #businessSection.tab-panel-active:not([hidden]),
body.city-page.rich-city #eventsSection.tab-panel-active:not([hidden]){
  display:block!important;
}

/* v139 STAGED ONLY — desktop right-side panel rebalance.
   Mobile layout <=700px remains unchanged. */
@media(min-width:701px){

  body.city-page.rich-city header.hero.hero-balanced-layout .hero-side-right{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    grid-template-rows:1fr 2fr!important;
    gap:8px!important;
    height:100%!important;
    min-height:0!important;
    align-content:stretch!important;
  }

  /* Top one-third: two equal horizontal cards */
  body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-public{
    grid-column:1!important;
    grid-row:1!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
  }

  body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-school{
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
  }

  /* Lower two-thirds: Upcoming Events spans full right-side width */
  body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-events{
    grid-column:1 / -1!important;
    grid-row:2!important;
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
  }

  body.city-page.rich-city header.hero.hero-balanced-layout .hero-side-right .hero-panel-wrap{
    margin:0!important;
    padding:0!important;
    max-width:none!important;
    max-height:none!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  body.city-page.rich-city header.hero.hero-balanced-layout .hero-side-right .hero-panel-wrap > *{
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    box-sizing:border-box!important;
  }

  body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-events .global-banner-events{
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-start!important;
    overflow:hidden!important;
  }

  body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-events .global-banner-events-list{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow:auto!important;
  }
}

/* v140 city Events page grouped by month */
.city-events-month{
  margin:0 0 22px;
}
.city-events-month-title{
  margin:0 0 10px;
  padding:8px 11px;
  border-radius:9px;
  background:#062b57;
  color:#fff;
  font-size:17px;
  line-height:1.2;
}
.city-events-month .city-events-grid{
  margin:0;
}
.city-events-month .city-event-card h3{
  margin:0 0 7px;
  font-size:16px;
}
@media(max-width:700px){
  .city-events-month{
    margin-bottom:18px;
  }
  .city-events-month-title{
    font-size:15px;
    padding:7px 9px;
  }
}

/* v141 STRICT month grouping: Events tab + standalone Events page */
.events-month-group,.city-events-month{
  display:block!important;
  width:100%!important;
  margin:0 0 24px!important;
}
.events-month-heading,.city-events-month-title{
  display:block!important;
  width:100%!important;
  margin:0 0 10px!important;
  padding:10px 12px!important;
  border-radius:10px!important;
  background:#062b57!important;
  color:#fff!important;
  font-size:18px!important;
  font-weight:900!important;
  line-height:1.2!important;
  box-sizing:border-box!important;
}
.events-month-grid,.city-events-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
  width:100%!important;
}
#eventsDirectory.events-grid{display:block!important;}
@media(max-width:700px){
  .events-month-heading,.city-events-month-title{
    font-size:16px!important;
    padding:9px 10px!important;
  }
  .events-month-grid,.city-events-grid{
    grid-template-columns:1fr!important;
  }
}

/* v141 staged — rolling Upcoming Events ticker */
.global-banner-events-list{
  min-width:0!important;
  width:100%!important;
}

.event-ticker{
  display:grid;
  grid-template-columns:24px minmax(0,1fr) 24px;
  grid-template-rows:minmax(0,1fr) auto;
  gap:5px;
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  align-items:center;
}

.event-ticker-viewport{
  grid-column:2;
  grid-row:1;
  width:100%;
  min-width:0;
  overflow:hidden;
}

.event-ticker-track{
  display:flex;
  width:100%;
  min-width:0;
  transition:transform .45s ease;
  will-change:transform;
}

.event-ticker-slide{
  flex:0 0 100%;
  min-width:0;
  width:100%;
  padding:3px;
  box-sizing:border-box;
}

.event-ticker-month{
  margin-bottom:4px;
  font-size:11px;
  line-height:1.15;
  font-weight:900;
  text-align:center;
  text-transform:uppercase;
  letter-spacing:.03em;
}

.event-ticker-body{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:8px;
  align-items:center;
  min-width:0;
}

.event-ticker-flyer{
  display:block;
  width:48px;
  height:62px;
  overflow:hidden;
  border-radius:6px;
  border:1px solid rgba(255,255,255,.45);
  flex:none;
}

.event-ticker-flyer img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.event-ticker-copy{
  min-width:0;
}

.event-ticker-name{
  font-size:12px;
  line-height:1.25;
  font-weight:900;
  overflow-wrap:anywhere;
}

.event-ticker-date{
  margin-top:4px;
  font-size:10px;
  line-height:1.2;
  opacity:.92;
  overflow-wrap:anywhere;
}

.event-ticker-nav{
  width:24px;
  height:32px;
  min-width:24px;
  padding:0;
  border:0;
  border-radius:6px;
  background:rgba(255,255,255,.16);
  color:#fff;
  font-size:22px;
  line-height:1;
  cursor:pointer;
}

.event-ticker-prev{
  grid-column:1;
  grid-row:1;
}

.event-ticker-next{
  grid-column:3;
  grid-row:1;
}

.event-ticker-dots{
  grid-column:1 / -1;
  grid-row:2;
  display:flex;
  justify-content:center;
  gap:4px;
  flex-wrap:wrap;
  min-height:8px;
}

.event-ticker-dot{
  width:7px;
  height:7px;
  min-width:7px;
  padding:0;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.38);
  cursor:pointer;
}

.event-ticker-dot.active{
  background:#fff;
}

@media(prefers-reduced-motion:reduce){
  .event-ticker-track{
    transition:none;
  }
}

@media(max-width:700px){
  .event-ticker{
    grid-template-columns:20px minmax(0,1fr) 20px;
  }
  .event-ticker-nav{
    width:20px;
    min-width:20px;
    height:28px;
    font-size:18px;
  }
  .event-ticker-flyer{
    width:40px;
    height:52px;
  }
  .event-ticker-name{
    font-size:11px;
  }
  .event-ticker-date,
  .event-ticker-month{
    font-size:9px;
  }
}

/* v143 Gilbert image + strict hero panel boundary guard */
body.city-page.rich-city header.hero.hero-balanced-layout .hero-side-left,
body.city-page.rich-city header.hero.hero-balanced-layout .hero-side-right,
body.city-page.rich-city header.hero.hero-balanced-layout .hero-center,
body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-wrap{
  box-sizing:border-box!important;
  min-width:0!important;
  min-height:0!important;
  overflow:hidden!important;
}

body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-wrap > *{
  max-width:100%!important;
  max-height:100%!important;
  box-sizing:border-box!important;
}

body.city-page.rich-city header.hero.hero-balanced-layout .hero-center,
body.city-page.rich-city header.hero.hero-balanced-layout .hero-center .hero-media{
  overflow:hidden!important;
}

body.city-page.rich-city header.hero.hero-balanced-layout .hero-center .hero-city-image{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
}

/* v145 City/Suburb selected-state visibility */
#city:not(:disabled),
#suburb:not(:disabled),
#suburb.location-select-active{
  background:#fff!important;
  color:var(--text)!important;
  opacity:1!important;
  -webkit-text-fill-color:var(--text)!important;
}

/* Safety fallback: if browser momentarily retains disabled during a cascade,
   selected City/Suburb values must not look greyed out. */
#city:disabled:not([value=""]),
#suburb:disabled:not([value=""]){
  opacity:1!important;
}

/* Modern browsers: normalize disabled styling when a real option is selected. */
#city:disabled:has(option:checked:not([value=""])),
#suburb:disabled:has(option:checked:not([value=""])){
  background:#fff!important;
  color:var(--text)!important;
  opacity:1!important;
  -webkit-text-fill-color:var(--text)!important;
}

/* v146 strict dropdown state */
#continentFilter:not(:disabled),
#countryFilter:not(:disabled),
#stateFilter:not(:disabled),
#cityFilter:not(:disabled),
#suburbFilter:not(:disabled){
  background:#fff!important;
  color:var(--text)!important;
  opacity:1!important;
  -webkit-text-fill-color:var(--text)!important;
  cursor:pointer!important;
}

/* v150 panel width + 3-day forecast layout */

/* Currency must occupy exactly the same available width as the other
   left-side hero panels. Do not use intrinsic/max-content width here. */
body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-currency{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  justify-self:stretch!important;
  align-self:stretch!important;
}

body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-currency > *,
body.city-page.rich-city header.hero.hero-balanced-layout #cityCurrencyPanel{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  height:100%!important;
  margin:0!important;
  justify-self:stretch!important;
  box-sizing:border-box!important;
}

/* 3-day forecast: one full-width line per day, centred.
   Support the different forecast item class names used by current renderers. */
body.city-page.rich-city .hero-panel-forecast #universalForecast,
body.city-page.rich-city .hero-panel-forecast #cityForecast,
body.city-page.rich-city .hero-panel-forecast .forecast-list,
body.city-page.rich-city .hero-panel-forecast .universal-forecast-list{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:center!important;
  gap:3px!important;
  width:100%!important;
  min-width:0!important;
  text-align:center!important;
}

body.city-page.rich-city .hero-panel-forecast #universalForecast > *,
body.city-page.rich-city .hero-panel-forecast #cityForecast > *,
body.city-page.rich-city .hero-panel-forecast .forecast-day,
body.city-page.rich-city .hero-panel-forecast .forecast-item,
body.city-page.rich-city .hero-panel-forecast .universal-forecast-day,
body.city-page.rich-city .hero-panel-forecast .rich-forecast-day{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  margin:0!important;
  padding:1px 2px!important;
  text-align:center!important;
  box-sizing:border-box!important;
  white-space:normal!important;
}

/* If the renderer uses nested spans/divs, keep each day's contents centred. */
body.city-page.rich-city .hero-panel-forecast #universalForecast > * *,
body.city-page.rich-city .hero-panel-forecast #cityForecast > * *{
  text-align:center!important;
}

/* Mobile uses the same one-day-per-line presentation and full currency width. */
@media(max-width:700px){
  body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-currency,
  body.city-page.rich-city header.hero.hero-balanced-layout #cityCurrencyPanel{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
  }

  body.city-page.rich-city .hero-panel-forecast #universalForecast,
  body.city-page.rich-city .hero-panel-forecast #cityForecast{
    display:flex!important;
    flex-direction:column!important;
    gap:2px!important;
    text-align:center!important;
  }
}

/* v151 Upcoming Events: same panel size, no scrollbar, View all always visible */
body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-events{
  overflow:hidden!important;
}

body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-events .global-banner-events{
  display:flex!important;
  flex-direction:column!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}

body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-events .global-banner-events-title{
  flex:0 0 auto!important;
}

body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-events .global-banner-events-list{
  display:flex!important;
  flex-direction:column!important;
  flex:1 1 auto!important;
  min-height:0!important;
  width:100%!important;
  overflow:hidden!important;
  scrollbar-width:none!important;
  box-sizing:border-box!important;
}

body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-events .global-banner-events-list::-webkit-scrollbar{
  display:none!important;
  width:0!important;
  height:0!important;
}

body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-events .event-ticker{
  flex:1 1 auto!important;
  min-height:0!important;
  height:auto!important;
  overflow:hidden!important;
}

body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-events .event-ticker-viewport{
  min-height:0!important;
  overflow:hidden!important;
}

body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-events .global-banner-events-all-link{
  display:block!important;
  flex:0 0 auto!important;
  position:relative!important;
  inset:auto!important;
  width:max-content!important;
  max-width:100%!important;
  margin:4px auto 0!important;
  padding:4px 8px!important;
  z-index:2!important;
  text-align:center!important;
  white-space:nowrap!important;
}

/* Remove any old event-list scrolling without changing the outer panel dimensions. */
body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-events .global-banner-events-list,
body.city-page.rich-city header.hero.hero-balanced-layout .hero-panel-events .event-ticker-track{
  overflow-y:hidden!important;
}

/* v152 STRICT forecast rows + complete event ticker */

/* Forecast renderer now emits exactly one .forecast-day-line per day. */
body.city-page.rich-city .hero-panel-forecast #universalForecast,
body.city-page.rich-city .hero-panel-forecast #cityForecastSummary{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:stretch!important;
  width:100%!important;
  min-width:0!important;
  gap:2px!important;
  text-align:center!important;
}

body.city-page.rich-city .hero-panel-forecast .forecast-day-line{
  display:block!important;
  flex:0 0 auto!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  padding:2px 1px!important;
  text-align:center!important;
  line-height:1.25!important;
  white-space:normal!important;
  box-sizing:border-box!important;
}

/* Event ticker must display one complete event inside the existing fixed panel. */
body.city-page.rich-city .hero-panel-events .event-ticker,
body.city-page.rich-city .hero-panel-events .event-ticker-viewport,
body.city-page.rich-city .hero-panel-events .event-ticker-track,
body.city-page.rich-city .hero-panel-events .event-ticker-slide{
  min-width:0!important;
  min-height:0!important;
  max-height:100%!important;
  box-sizing:border-box!important;
}

body.city-page.rich-city .hero-panel-events .event-ticker-slide{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  overflow:hidden!important;
}

body.city-page.rich-city .hero-panel-events .event-ticker-body{
  display:grid!important;
  grid-template-columns:52px minmax(0,1fr)!important;
  gap:7px!important;
  align-items:center!important;
  width:100%!important;
  min-width:0!important;
}

body.city-page.rich-city .hero-panel-events .event-ticker-flyer{
  display:block!important;
  width:52px!important;
  height:66px!important;
  min-width:52px!important;
  max-width:52px!important;
  overflow:hidden!important;
}

body.city-page.rich-city .hero-panel-events .event-ticker-flyer img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}

body.city-page.rich-city .hero-panel-events .event-ticker-copy{
  min-width:0!important;
  overflow:hidden!important;
}

body.city-page.rich-city .hero-panel-events .event-ticker-name{
  display:block!important;
  font-size:11px!important;
  line-height:1.18!important;
  font-weight:900!important;
  max-height:2.4em!important;
  overflow:hidden!important;
}

body.city-page.rich-city .hero-panel-events .event-ticker-date,
body.city-page.rich-city .hero-panel-events .event-ticker-venue{
  display:block!important;
  margin-top:2px!important;
  font-size:9px!important;
  line-height:1.15!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  max-height:2.3em!important;
  overflow:hidden!important;
}

body.city-page.rich-city .hero-panel-events .global-banner-events-all-link{
  flex:0 0 auto!important;
  margin-top:3px!important;
}

@media(max-width:700px){
  body.city-page.rich-city .hero-panel-forecast .forecast-day-line{
    padding:1px 0!important;
    line-height:1.2!important;
  }

  body.city-page.rich-city .hero-panel-events .event-ticker-body{
    grid-template-columns:44px minmax(0,1fr)!important;
    gap:5px!important;
  }

  body.city-page.rich-city .hero-panel-events .event-ticker-flyer{
    width:44px!important;
    height:56px!important;
    min-width:44px!important;
    max-width:44px!important;
  }

  body.city-page.rich-city .hero-panel-events .event-ticker-name{
    font-size:10px!important;
  }

  body.city-page.rich-city .hero-panel-events .event-ticker-date,
  body.city-page.rich-city .hero-panel-events .event-ticker-venue{
    font-size:8.5px!important;
  }
}

/* v153 real country flag in Local Time title */
.local-time-title{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:6px!important;
  min-width:0!important;
}

.local-time-country-flag{
  display:inline-block!important;
  width:22px!important;
  height:15px!important;
  min-width:22px!important;
  max-width:22px!important;
  object-fit:cover!important;
  border-radius:2px!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.25)!important;
  flex:0 0 22px!important;
}

@media(max-width:700px){
  .local-time-country-flag{
    width:20px!important;
    height:14px!important;
    min-width:20px!important;
    max-width:20px!important;
    flex-basis:20px!important;
  }
}

/* v154 deterministic Upcoming Events slides.
   Keep outer panel dimensions unchanged. */
body.city-page.rich-city .hero-panel-events .event-ticker-track{
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  transform:none!important;
  transition:none!important;
  overflow:hidden!important;
}

body.city-page.rich-city .hero-panel-events .event-ticker-slide{
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  padding:2px!important;
  box-sizing:border-box!important;
}

body.city-page.rich-city .hero-panel-events .event-ticker-slide[hidden]{
  display:none!important;
}

body.city-page.rich-city .hero-panel-events .event-ticker-slide:not([hidden]){
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
}

body.city-page.rich-city .hero-panel-events .event-ticker-viewport{
  height:100%!important;
  min-height:0!important;
}

body.city-page.rich-city .hero-panel-events .event-ticker-body{
  flex:1 1 auto!important;
  min-height:0!important;
}

/* Make complete flyer visible rather than cropping it. */
body.city-page.rich-city .hero-panel-events .event-ticker-flyer img{
  object-fit:contain!important;
  background:rgba(255,255,255,.08)!important;
}

/* v155 Sydney/Melbourne city-state label safe area */
.safe-city-image-label{
  position:absolute!important;
  z-index:6!important;
  top:16px!important;
  left:18px!important;
  right:18px!important;
  width:auto!important;
  max-width:calc(100% - 36px)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  pointer-events:none!important;
  color:#fff!important;
  text-shadow:0 2px 5px rgba(0,0,0,.92),0 0 3px rgba(0,0,0,.9)!important;
  box-sizing:border-box!important;
  overflow:visible!important;
}
.safe-city-image-label strong{
  display:block!important;
  max-width:100%!important;
  font-size:clamp(22px,3vw,38px)!important;
  line-height:1.05!important;
  font-weight:900!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
.safe-city-image-label span{
  display:block!important;
  max-width:100%!important;
  margin-top:5px!important;
  font-size:clamp(12px,1.45vw,18px)!important;
  line-height:1.15!important;
  font-weight:700!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
@media(max-width:700px){
  .safe-city-image-label{display:none!important;}
}

/* v158: no city/state text overlays on any city hero picture */
.safe-city-image-label,
.hero-city-label,
.hero-location-overlay,
.city-state-overlay{
  display:none!important;
}

/* v161 mobile Country dropdown: use native phone/browser selector */
@media(max-width:700px){
  .country-picker-wrap{
    display:block!important;
    position:relative!important;
    width:100%!important;
    min-width:0!important;
  }

  .country-picker-wrap .country-picker-native{
    position:static!important;
    width:100%!important;
    height:48px!important;
    min-height:48px!important;
    overflow:visible!important;
    clip:auto!important;
    clip-path:none!important;
    white-space:normal!important;
    opacity:1!important;
    pointer-events:auto!important;
    border:1px solid #ddd!important;
    border-radius:8px!important;
    padding:7px 9px!important;
    background:#fff!important;
    color:var(--text)!important;
    -webkit-text-fill-color:var(--text)!important;
    font:inherit!important;
    font-size:14px!important;
  }

  .country-picker-wrap .country-picker-button,
  .country-picker-wrap .country-picker-menu{
    display:none!important;
  }
}

/* v162: Public Holiday + DST text alignment. Panel geometry is unchanged. */
#universalPublicHoliday{
  width:100%;
  text-align:center;
}
#universalPublicHoliday .public-holiday-line,
#universalPublicHoliday .public-dst-line,
#universalPublicHoliday .public-dst-move{
  display:block;
  width:100%;
  text-align:center;
  line-height:1.25;
  overflow-wrap:anywhere;
}
#universalPublicHoliday .public-dst-line{
  margin-top:5px;
  padding-top:5px;
  border-top:1px solid rgba(255,255,255,.28);
  font-size:.88em;
}
#universalPublicHoliday .public-dst-move{
  margin-top:2px;
  font-size:.84em;
}
#universalPublicHoliday .public-dst-none{
  font-size:.84em;
}

/* v164 timezone + DST alignment */
.timezone-info-line{
  width:100%!important;
  margin-top:2px!important;
  font-size:9px!important;
  line-height:1.2!important;
  text-align:center!important;
  opacity:.92!important;
  overflow-wrap:anywhere!important;
}
#cityPublicHoliday,#universalPublicHoliday{width:100%!important;text-align:center!important;}
#cityPublicHoliday .public-holiday-line,#cityPublicHoliday .public-dst-line,#cityPublicHoliday .public-dst-move,
#universalPublicHoliday .public-holiday-line,#universalPublicHoliday .public-dst-line,#universalPublicHoliday .public-dst-move{
  display:block!important;width:100%!important;text-align:center!important;line-height:1.2!important;overflow-wrap:anywhere!important;
}
#cityPublicHoliday .public-dst-line,#universalPublicHoliday .public-dst-line{
  margin-top:4px!important;padding-top:4px!important;border-top:1px solid rgba(255,255,255,.25)!important;font-size:.86em!important;
}
#cityPublicHoliday .public-dst-move,#universalPublicHoliday .public-dst-move{
  margin-top:2px!important;font-size:.82em!important;
}

/* v174 Dubai listing columns exactly match Sydney.
   Scoped only to Dubai's listing directory; hero/info panels are untouched. */
@media(max-width:700px){
  body.city-page.dubai-sydney-listing-columns #businessDirectory{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:hidden!important;
    box-sizing:border-box!important;
  }

  body.city-page.dubai-sydney-listing-columns .business-category{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  body.city-page.dubai-sydney-listing-columns .business-listing.business-listing-with-veg{
    display:grid!important;
    grid-template-columns:18px 18px minmax(0,1fr)!important;
    grid-auto-columns:minmax(0,1fr)!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:8px 5px!important;
    gap:0 4px!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    align-items:start!important;
  }

  body.city-page.dubai-sydney-listing-columns .business-listing.business-listing-with-veg > .listing-alpha-col{
    grid-column:1!important;
    grid-row:1 / span 6!important;
    width:18px!important;
    min-width:18px!important;
    max-width:18px!important;
    padding:3px 1px 0 0!important;
    margin:0!important;
    display:flex!important;
    align-items:flex-start!important;
    justify-content:flex-end!important;
    font-size:10px!important;
    line-height:1.2!important;
    box-sizing:border-box!important;
  }

  body.city-page.dubai-sydney-listing-columns .business-listing.business-listing-with-veg > .veg-symbol-col{
    grid-column:2!important;
    grid-row:1 / span 6!important;
    width:18px!important;
    min-width:18px!important;
    max-width:18px!important;
    padding:2px 0!important;
    margin:0!important;
    display:flex!important;
    align-items:flex-start!important;
    justify-content:center!important;
    box-sizing:border-box!important;
  }

  body.city-page.dubai-sydney-listing-columns .business-listing.business-listing-with-veg > .veg-symbol-col .pure-veg-mark{
    width:13px!important;
    height:13px!important;
    min-width:13px!important;
    max-width:13px!important;
    margin:0!important;
  }

  body.city-page.dubai-sydney-listing-columns .business-listing.business-listing-with-veg > .business-name-col{
    grid-column:3 / -1!important;
    grid-row:1!important;
    display:block!important;
    justify-self:stretch!important;
    align-self:start!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin:0!important;
    padding:0 0 5px 0!important;
    overflow:visible!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    box-sizing:border-box!important;
  }

  body.city-page.dubai-sydney-listing-columns .business-listing.business-listing-with-veg > .business-name-col strong{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    font-size:13px!important;
    line-height:1.35!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }

  body.city-page.dubai-sydney-listing-columns .business-listing.business-listing-with-veg > .business-name-col > div{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin-top:2px!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }

  body.city-page.dubai-sydney-listing-columns .business-listing.business-listing-with-veg > div:nth-child(n+4){
    grid-column:3 / -1!important;
    display:block!important;
    justify-self:stretch!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin:0!important;
    padding:2px 0!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    box-sizing:border-box!important;
  }

  body.city-page.dubai-sydney-listing-columns .business-listing.business-listing-with-veg > div:nth-child(n+4) a{
    display:inline!important;
    width:auto!important;
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }

  body.city-page.dubai-sydney-listing-columns .business-listing.business-listing-with-veg > *{
    min-width:0!important;
    box-sizing:border-box!important;
  }
}

/* v179 View all events link clickability */
.global-banner-events-all-link{
  position:relative!important;
  z-index:20!important;
  pointer-events:auto!important;
  cursor:pointer!important;
}

/* v180 Mobile Upcoming Events: keep View all events visible */
@media(max-width:700px){
  body.city-page .global-banner-events{
    display:flex!important;
    flex-direction:column!important;
    min-height:0!important;
    overflow:hidden!important;
  }

  body.city-page .global-banner-events-title{
    flex:0 0 auto!important;
  }

  body.city-page .global-banner-events-list{
    display:flex!important;
    flex-direction:column!important;
    flex:1 1 auto!important;
    min-height:0!important;
    overflow:hidden!important;
  }

  body.city-page .global-banner-events-list > .event-ticker{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow:hidden!important;
  }

  body.city-page .global-banner-events-all-link{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    position:relative!important;
    flex:0 0 auto!important;
    width:max-content!important;
    max-width:100%!important;
    min-height:0!important;
    height:auto!important;
    margin:4px auto 0!important;
    padding:4px 8px!important;
    z-index:50!important;
    pointer-events:auto!important;
    overflow:visible!important;
    white-space:nowrap!important;
  }
}

/* v181 strict hero alignment guard
   Side-panel content, including Upcoming Events, must never determine the
   desktop/tablet hero row height. The landmark image track remains the
   sizing authority; every side panel is contained inside that geometry. */
@media(min-width:701px){
  body.city-page header.hero.hero-balanced-layout .hero-side{
    min-height:0!important;
    max-height:100%!important;
    overflow:hidden!important;
    contain:size!important;
  }

  body.city-page header.hero.hero-balanced-layout .hero-side .hero-panel-wrap{
    min-height:0!important;
    max-height:100%!important;
    overflow:hidden!important;
  }

  body.city-page header.hero.hero-balanced-layout .hero-panel-events,
  body.city-page header.hero.hero-balanced-layout .hero-panel-events .global-banner-events,
  body.city-page header.hero.hero-balanced-layout .hero-panel-events .global-banner-events-list,
  body.city-page header.hero.hero-balanced-layout .hero-panel-events .event-ticker,
  body.city-page header.hero.hero-balanced-layout .hero-panel-events .event-ticker-viewport,
  body.city-page header.hero.hero-balanced-layout .hero-panel-events .event-ticker-track,
  body.city-page header.hero.hero-balanced-layout .hero-panel-events .event-ticker-slide{
    min-height:0!important;
    max-height:100%!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
}
/* end v181 strict hero alignment guard */

/* v187 — small business social/web link icons */
.business-listing.business-listing-with-veg a.business-web-link-with-icon{
  display:inline-flex!important;
  align-items:center!important;
  gap:4px!important;
  width:auto!important;
  max-width:100%!important;
  vertical-align:middle!important;
}
.business-web-link-with-icon .listing-link-icon{
  flex:0 0 13px!important;
  width:13px!important;
  height:13px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.business-web-link-with-icon .listing-link-icon .icon-fill-dot,
.business-web-link-with-icon .listing-link-icon .icon-fill-shape{
  fill:currentColor!important;
  stroke:none!important;
}
.business-web-link-with-icon .listing-link-icon-facebook{
  stroke:none!important;
}
@media(max-width:700px){
  .business-web-link-with-icon .listing-link-icon{
    flex-basis:12px!important;
    width:12px!important;
    height:12px!important;
  }
}
/* end v187 business link icons */

/* v187 — email icon support */
.business-listing.business-listing-with-veg a.business-email-link{
  display:inline-flex!important;
  align-items:center!important;
  gap:4px!important;
  width:auto!important;
  max-width:100%!important;
  vertical-align:middle!important;
}
.business-email-link .listing-link-icon-email{
  flex:0 0 13px!important;
  width:13px!important;
  height:13px!important;
}
@media(max-width:700px){
  .business-listing.business-listing-with-veg a.business-email-link{
    display:inline-flex!important;
    align-items:center!important;
    gap:4px!important;
  }
  .business-email-link .listing-link-icon-email{
    flex-basis:12px!important;
    width:12px!important;
    height:12px!important;
  }
}
/* end v187 email icon support */

/* v194 text-only event detail links */
.event-ticker-detail-link{
  color:inherit!important;
  text-decoration:none!important;
  min-width:0!important;
  max-width:100%!important;
}
.event-ticker-detail-link:hover .event-ticker-name,
.event-ticker-detail-link:focus-visible .event-ticker-name{
  text-decoration:underline;
}
.city-event-card{
  scroll-margin-top:16px;
}
/* end v194 text-only event detail links */

/* v196 landscape event flyer preservation */
.city-event-flyer.city-event-flyer-landscape{
  display:block!important;
  width:min(100%,560px)!important;
  height:auto!important;
  aspect-ratio:834 / 356!important;
  margin-top:12px!important;
  overflow:hidden!important;
  background:#fff!important;
}
.city-event-flyer.city-event-flyer-landscape img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
}
.event-flyer.event-flyer-landscape{
  display:block!important;
  width:min(100%,520px)!important;
  height:auto!important;
  aspect-ratio:834 / 356!important;
  background:#fff!important;
}
.event-flyer.event-flyer-landscape img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
}
@media(max-width:700px){
  .city-event-flyer.city-event-flyer-landscape,
  .event-flyer.event-flyer-landscape{
    width:100%!important;
    max-width:100%!important;
  }
}
/* end v196 landscape event flyer preservation */

/* generic v4 empty upcoming-events state */
.event-ticker-empty{
  min-width:0;
  padding:8px 4px 10px;
}
.event-ticker-empty-title{
  font-weight:800;
  line-height:1.25;
}
.event-ticker-empty-copy{
  margin-top:3px;
  font-size:.86rem;
  opacity:.78;
  line-height:1.3;
}
/* end generic v4 empty upcoming-events state */
