/* StratMap reports on a phone (01/11/2026).
   James: "we need to be making all the reports (LGA reports, suburb reports and top location reports) super mobile-friendly ... people will probably land on these reports on their phone."
   One stylesheet and one script (stratmap-report-mobile.js) for every report page. The chrome block (scripts/apply_stratmap_chrome.py) loads both, so a fix here reaches every report at once.
   The rules are phone only. Nothing on a wider screen changes. */

:root{--smr-card:var(--ui-card,#fff);--smr-ink:var(--ui-ink,#14201b);--smr-ink2:var(--ui-ink2,#56645d);--smr-line:var(--ui-line,rgba(20,32,27,.12));--smr-sunk:var(--ui-sunk,#e8ebe6);--smr-accent:var(--ui-accent,#1D9E75);--smr-accent-ink:var(--ui-accent-ink,#085041);--smr-accent-bg:var(--ui-accent-bg,#E1F5EE)}

/* Scroll shadows on a table that is wider than the screen. The script wraps such a table in .sm-tscroll. */
.sm-tscroll,.sm-shadow{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;
  background:linear-gradient(to right,var(--sm-stick,var(--smr-card)) 30%,rgba(255,255,255,0)) 0 0,linear-gradient(to left,var(--sm-stick,var(--smr-card)) 30%,rgba(255,255,255,0)) 100% 0,radial-gradient(farthest-side at 0 50%,rgba(0,0,0,.2),rgba(0,0,0,0)) 0 0,radial-gradient(farthest-side at 100% 50%,rgba(0,0,0,.2),rgba(0,0,0,0)) 100% 0;
  background-repeat:no-repeat;background-size:40px 100%,40px 100%,14px 100%,14px 100%;background-attachment:local,local,scroll,scroll}
.sm-tscroll>table{margin:0}
.sm-swipe{font:600 12px/1.2 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--smr-ink2);margin:6px 2px;display:flex;align-items:center;gap:6px}
.sm-swipe::before{content:"\2194";font-size:14px}
.sm-swipe.gone{display:none}
/* the first column (the suburb) stays put while the rest scrolls */
.sm-stickfirst table th:first-child,.sm-stickfirst table td:first-child{position:sticky;left:0;z-index:2;background:var(--sm-stick,var(--smr-card))}

@media (max-width:760px){
  html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
  body{overflow-wrap:break-word}
  img,video,canvas,iframe{max-width:100%}
  pre,code{white-space:pre-wrap;word-break:break-word}

  /* The empty podcast and video boxes are two tall blank cards on a phone. The request button stays. */
  .sm-media-compact .sm-media-grid{display:none}
  .sm-media-compact h2{font-size:16px;margin-bottom:8px}
  .sm-media-compact .sm-media-request{margin-top:0}

  /* Long method text sits behind one tap (the script wraps the section in <details class="sm-fold">). */
  details.sm-fold{margin:18px 0;background:var(--smr-card);border:1px solid var(--smr-line);border-radius:14px;overflow:hidden}
  details.sm-fold>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;min-height:48px}
  details.sm-fold>summary::-webkit-details-marker{display:none}
  details.sm-fold>summary h2{margin:0!important;font-size:16px!important}
  details.sm-fold>summary::after{content:"";width:9px;height:9px;border-right:2px solid var(--smr-ink2);border-bottom:2px solid var(--smr-ink2);transform:rotate(45deg);margin-right:4px;flex:0 0 auto;transition:transform .15s}
  details.sm-fold[open]>summary::after{transform:rotate(-135deg)}
  details.sm-fold>.sm-fold-body{padding:0 16px 16px}
  details.sm-fold .sm-fold-t{font-size:15px;font-weight:700;color:var(--smr-ink)}
  /* the page's own in-page contents list says the same as the chips */
  html.sm-hasjump nav.toc{display:none}
  /* a fold inside a dark panel (the market rail of a ranked edition) */
  details.sm-fold.sm-dark{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.22);grid-column:1/-1;margin:14px 0 0}
  details.sm-fold.sm-dark .sm-fold-t{color:#fff}
  details.sm-fold.sm-dark>summary::after{border-color:rgba(255,255,255,.85)}
  details.sm-fold.sm-dark>.sm-fold-body{display:grid;grid-template-columns:1fr 1fr;column-gap:18px;padding:0 14px 12px}
  details.sm-fold.sm-dark>.sm-fold-body>.rail-h,details.sm-fold.sm-dark>.sm-fold-body>.hl-chip.wide,details.sm-fold.sm-dark>.sm-fold-body>.rail-src{grid-column:1/-1}
  /* a report section: the heading and one line about what is inside, a tap opens it */
  details.sm-sec{margin:12px 0}
  details.sm-sec>summary{align-items:center;padding:12px 16px}
  details.sm-sec .sm-sec-h{flex:1 1 auto;min-width:0}
  details.sm-sec .sm-sec-h>*:first-child{margin:0!important}
  details.sm-sec .sm-sec-h h2,details.sm-sec .sm-sec-h h3{font-size:17px!important;margin:0!important}
  details.sm-sec .sm-peek{margin:3px 0 0;font-size:13px;line-height:1.4;color:var(--smr-ink2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  details.sm-sec[open] .sm-peek{display:none}
  details.sm-sec[open]>summary{border-bottom:1px solid var(--smr-line)}
  details.sm-sec>.sm-fold-body{padding-top:14px}

  /* The jump bar: the sections of a long report as chips, pinned under the top bar. */
  .sm-jump{position:sticky;top:54px;z-index:90;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:8px 14px;background:var(--smr-card);border-bottom:1px solid var(--smr-line)}
  .sm-jump::-webkit-scrollbar{display:none}
  .sm-jump a{flex:0 0 auto;display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--smr-line);background:var(--smr-sunk);color:var(--smr-ink2);font:600 13px/1 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;text-decoration:none;white-space:nowrap}
  .sm-jump a.on{background:var(--smr-accent-bg);border-color:transparent;color:var(--smr-accent-ink)}
  html.sm-framed .sm-jump{top:0}
  h2[id].sm-jumped,section[id]{scroll-margin-top:112px}
  html.sm-framed h2[id].sm-jumped,html.sm-framed section[id]{scroll-margin-top:60px}

  /* the editions' price-band chart: name and range on one line, the bar on the full width under it */
  .sm-bc-row{display:block!important;margin:12px 0!important}
  .sm-bc-row .sm-bc-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:4px}
  .sm-bc-row .bc-name{text-align:left;font-size:13.5px;overflow:visible;white-space:normal}
  .sm-bc-row .sm-bc-lab{font-size:12.5px;font-weight:700;color:var(--smr-ink2);font-variant-numeric:tabular-nums;white-space:nowrap}
  .sm-bc-row .bc-track{height:16px}
  .sm-bc-row .bc-bar{font-size:0;top:2px;bottom:2px}
  /* the media box, moved up: tighter than at the foot */
  .sm-media[data-smup]{margin:16px 0}
  .sm-media[data-smup] h2{font-size:16px}
  /* Cards and callouts get a little more room to breathe against the screen edge. */
  .sm-cta,.sm-gate-wrap{margin-left:0;margin-right:0}
}

@media print{.sm-jump{display:none!important}.sm-tscroll{overflow:visible!important;background:none!important}}
@media (max-width:760px){ .card[id].sm-jumped{scroll-margin-top:112px} html.sm-framed .card[id].sm-jumped{scroll-margin-top:60px} }