/* Mockup D. Header, scorecards, panels and end matter from mockup B; Show selector, the large month chart,
   the every-month grid and the per-market rules from mockup C; the running total from mockup A. */
:root{
  --paper:#F4EEE3;--paper-card:#FAF5EB;--ink:#1B1813;--ink-soft:#4A4239;--ink-mute:#6A5F4E;
  --accent:#2C4A3C;--accent-soft:#6B8678;--warn:#9C5A3C;--warn-soft:#B07C5C;
  --rule:rgba(27,24,19,0.10);--rule-strong:rgba(27,24,19,0.22);--series-prev:#8A7E6E;
  --mono:'IBM Plex Mono',ui-monospace,Consolas,monospace;
  --serif:'Source Serif 4',Georgia,serif;
  --display:'Fraunces',Georgia,serif;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{background:var(--paper);}
body{font-family:var(--serif);color:var(--ink);background:var(--paper);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;}
a{color:var(--ink);text-decoration:underline;text-underline-offset:2px;}
a:hover{color:var(--accent);}
[hidden]{display:none !important;}
select:focus-visible,input:focus-visible,button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

/* shared masthead */
.masthead{max-width:1080px;margin:0 auto;padding:28px 32px;border-bottom:1px solid var(--rule);}
.masthead-grid{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:24px;}
.wordmark{font-family:var(--display);font-weight:400;font-size:30px;letter-spacing:-0.008em;color:var(--ink);
  text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;justify-self:start;font-variation-settings:"opsz" 72,"SOFT" 50;}
.masthead .dateline{font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:0.22em;text-transform:uppercase;color:var(--ink-soft);justify-self:center;text-align:center;}
.masthead-back{font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-soft);
  text-decoration:underline;text-decoration-thickness:0.5px;text-underline-offset:5px;justify-self:end;white-space:nowrap;}

/* header (mockup B) */
.wrap{max-width:1080px;margin:0 auto;padding:0 32px;}
.top{padding:20px 0 0;}
.hrow{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 24px;margin-bottom:6px;}
h1{font-family:var(--display);font-weight:300;font-size:36px;line-height:1.1;letter-spacing:-0.018em;font-variation-settings:"opsz" 144,"SOFT" 50;}
.dek{font-size:16px;line-height:1.5;color:var(--ink-soft);hyphens:auto;}
.byline{font-family:var(--mono);font-size:11.5px;letter-spacing:0.04em;color:var(--ink-mute);}
.byline a{color:var(--ink-mute);text-decoration:none;border-bottom:0.5px solid var(--ink-mute);}

/* filter bar: not sticky */
.filters{display:flex;flex-wrap:wrap;align-items:center;gap:12px 30px;margin-top:16px;padding:14px 0;border-top:1px solid var(--rule-strong);border-bottom:1px solid var(--rule-strong);background:var(--paper);}
/* Sticky only on a laptop or tablet tall enough for it: on a phone the bar is about 226 px (a third of the screen),
   and a landscape phone is under 600 px high (the September audit). */
@media (min-width:721px) and (min-height:600px){.filters{position:sticky;top:0;z-index:20;}}
.f{display:flex;align-items:center;gap:8px;min-width:0;}
.f-l{font-family:var(--mono);font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ink-mute);white-space:nowrap;}
select,input[type="search"]{font-family:var(--mono);font-size:13px;color:var(--ink);background:var(--paper-card);border:1px solid var(--rule-strong);
  border-radius:2px;padding:7px 10px;min-height:36px;max-width:100%;}
#show{width:230px;font-weight:500;border-color:var(--ink-soft);}
#find{width:150px;}
#find.nomatch{border-color:var(--warn);}
.tabs{display:inline-flex;border:1px solid var(--rule-strong);border-radius:2px;background:var(--paper-card);flex:none;}
.tabs button{font-family:var(--mono);font-size:12.5px;color:var(--ink-soft);background:none;border:0;padding:7px 12px;min-height:34px;cursor:pointer;white-space:nowrap;}
.tabs button + button{border-left:1px solid var(--rule-strong);}
.tabs button[aria-pressed="true"]{background:var(--accent);color:var(--paper);}
.tabs button:disabled{color:var(--ink-mute);opacity:0.55;cursor:default;}
.pfix{font-family:var(--mono);font-size:12.5px;color:var(--ink-soft);white-space:nowrap;}

/* scorecards */
.sc{margin-top:28px;}
.sc-h{font-family:var(--display);font-weight:400;font-size:24px;line-height:1.2;letter-spacing:-0.01em;font-variation-settings:"opsz" 72,"SOFT" 50;}
.sc-sub{font-family:var(--mono);font-size:12px;line-height:1.5;color:var(--ink-soft);margin:4px 0 12px;}
.kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px 24px;padding:16px 0;border-top:1px solid var(--rule-strong);border-bottom:1px solid var(--rule-strong);}
.kpis.n4{grid-template-columns:repeat(4,minmax(0,1fr));}
.kpis.n3{grid-template-columns:repeat(3,minmax(0,1fr));}
.kpi{min-width:0;}
.kpi-l{font-family:var(--mono);font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:4px;line-height:1.45;}
.kpi-n{font-family:var(--display);font-weight:300;font-size:32px;line-height:1.05;letter-spacing:-0.02em;font-variation-settings:"opsz" 144,"SOFT" 30;margin-bottom:4px;white-space:nowrap;}
.kpi-n.t{white-space:normal;font-size:27px;}
.kpi-n.up{color:var(--accent);}.kpi-n.down{color:var(--warn);}.kpi-n.na{color:var(--ink-mute);font-size:26px;}
.kpi-c{font-size:13px;line-height:1.38;color:var(--ink-soft);}
.caveat{font-family:var(--mono);font-size:11.5px;line-height:1.55;color:var(--ink-soft);background:var(--paper-card);
  border-left:2px solid var(--accent-soft);padding:6px 10px;margin:10px 0 0;max-width:760px;}

/* groups and panels */
.group{margin-top:60px;}
.group-h{font-family:var(--display);font-weight:400;font-size:26px;line-height:1.2;letter-spacing:-0.01em;font-variation-settings:"opsz" 72,"SOFT" 50;}
.group-h .gs{font-family:var(--mono);font-size:12px;letter-spacing:0.04em;color:var(--ink-mute);font-weight:400;}
.group-h .gs span{white-space:nowrap;}
.group .grid{margin-top:14px;}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 40px;margin-top:36px;}
.panel{display:flex;flex-direction:column;min-width:0;border-top:1px solid var(--rule-strong);padding-top:12px;}
.panel.full{grid-column:1 / -1;}
/* Hotels and rooms: the long category list and the shorter district map each take a full row (list, then map), so neither leaves empty space beside it */
#p-acccat,#p-prov{grid-column:1 / -1;}
.p-h{display:flex;align-items:baseline;gap:10px;margin-bottom:4px;}
.p-n{font-family:var(--mono);font-size:11.5px;color:var(--ink-mute);flex:none;}
.p-t{font-family:var(--display);font-weight:500;font-size:18px;line-height:1.3;font-variation-settings:"opsz" 30,"SOFT" 50;}
.panel.big .p-t{font-size:21px;}
.p-sub{font-family:var(--mono);font-size:11.5px;line-height:1.5;color:var(--ink-soft);margin:2px 0 8px 31px;}
.p-body{margin-top:6px;}
.p-f{margin-top:auto;padding-top:12px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 16px;}
.src{font-family:var(--mono);font-size:11px;line-height:1.55;color:var(--ink-soft);min-width:0;}
.src a{color:var(--ink-soft);}
.csv{font-family:var(--mono);font-size:11.5px;color:var(--ink-soft);text-decoration:none;border-bottom:0.5px solid var(--ink-mute);white-space:nowrap;}
.csv:hover{color:var(--accent);border-color:var(--accent);}
.note{font-family:var(--mono);font-size:11px;line-height:1.5;color:var(--ink-soft);margin-top:8px;}
.legend{display:flex;flex-wrap:wrap;gap:4px 16px;font-family:var(--mono);font-size:11px;color:var(--ink-soft);margin:2px 0 6px 31px;}
.legend span{display:inline-flex;align-items:center;gap:6px;}
.legend i{display:inline-block;width:11px;height:11px;}
.legend i.shade{background:rgba(44,74,60,0.10);border:1px solid rgba(44,74,60,0.25);}
.legend i.line{height:2.5px;width:16px;}
.legend i.rng{background:rgba(107,134,120,0.38);}
.legend i.hatch{background:repeating-linear-gradient(45deg,var(--series-prev) 0 1.4px,transparent 1.4px 4px);border:1px solid var(--rule-strong);}
.legend i.outl{border:1px solid var(--accent);background:transparent;}
.legend i.box1{border:1.5px solid var(--accent);background:transparent;width:16px;}
.legend i.box2{border:1px solid var(--ink);background:transparent;width:16px;}
.chart{position:relative;width:100%;}
.chart svg{display:block;}
svg .grid{stroke:rgba(27,24,19,0.10);stroke-width:1;}
svg .base{stroke:var(--ink);stroke-width:1;}
svg .axm{font-family:var(--mono);font-size:10.5px;fill:var(--ink-mute);}
svg .lbl{font-family:var(--mono);font-size:11px;fill:var(--ink-soft);}
svg .lbl.b{fill:var(--ink);font-weight:500;}
svg .val{font-family:var(--mono);font-size:11px;font-weight:500;fill:var(--ink);}
svg .hm-y{font-family:var(--mono);font-size:9.5px;fill:var(--ink-mute);}
svg .hm-y.on{fill:var(--ink);font-weight:500;}
svg .hm-v{font-family:var(--mono);font-size:9px;}
svg .hm-v.sm{font-size:8px;}
svg .hm-t{font-family:var(--mono);font-size:9.5px;fill:var(--ink-soft);}
svg .tag{font-family:var(--mono);font-size:9.5px;fill:var(--ink-mute);}
.empty{font-family:var(--mono);font-size:12px;color:var(--ink-soft);padding:10px 0;}

/* top ten as a ranked bar list (mockup B) */
.tt{font-family:var(--mono);font-size:12px;font-variant-numeric:tabular-nums;}
.tt-r{display:grid;grid-template-columns:22px minmax(0,1.5fr) minmax(48px,1fr) 66px 50px 62px;column-gap:8px;align-items:center;
  padding:4px 0;line-height:1.35;border-bottom:1px solid var(--rule);}
.tt-r.hd{color:var(--ink-mute);font-size:10.5px;align-items:end;border-bottom:1px solid var(--rule-strong);padding-top:0;}
.tt-r.hd .ar{grid-column:3 / 5;}
.tt-r .rk{color:var(--ink-mute);text-align:right;}
.tt-r .nm{font-family:var(--serif);font-size:14px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tt-r .br{height:9px;background:var(--rule);}
.tt-r .br i{display:block;height:9px;background:var(--accent);}
.tt-r .v,.tt-r .sh,.tt-r .pr{text-align:right;}
.tt-r .pr{color:var(--ink-soft);}
.tt-r.cur{background:var(--paper-card);box-shadow:inset 0 1px 0 var(--accent),inset 0 -1px 0 var(--accent);}
.tt-r.cur .nm{font-weight:600;}
.tt-r.out{margin-top:6px;border-top:1px dotted var(--rule-strong);}

/* regions as rows of small multiples (mockup B) */
.rg-r{display:grid;grid-template-columns:minmax(0,1fr) 190px;column-gap:16px;align-items:center;padding:8px 0;border-bottom:1px solid var(--rule);}
.rg-r:first-child{border-top:1px solid var(--rule-strong);}
.rg-r.cur{background:var(--paper-card);box-shadow:inset 2px 0 0 var(--accent);padding-left:8px;}
.rg-n{display:flex;justify-content:space-between;gap:8px;align-items:baseline;line-height:1.3;margin-bottom:2px;}
.rg-n b{font-family:var(--display);font-size:16px;font-weight:500;font-variation-settings:"opsz" 24,"SOFT" 50;min-width:0;overflow-wrap:break-word;hyphens:auto;}
.rg-n b a{text-decoration:underline dotted;text-decoration-color:var(--ink-mute);text-underline-offset:3px;}
.rg-n span{font-family:var(--mono);font-size:12.5px;white-space:nowrap;}
.rg-d{font-family:var(--mono);font-size:11px;color:var(--ink-soft);line-height:1.45;}
.up{color:var(--accent);}.down{color:var(--warn);}

/* airports and airlines share lists (mockup B) */
.sl{font-family:var(--mono);font-size:12px;font-variant-numeric:tabular-nums;}
/* Fix-up 2 (V2): the change column holds 10 characters of the 12 px mono (72 px; D has 66), so a two-digit range fits.
   The name column keeps D's width, 1.25/2.25 of what D's three fixed columns and four gaps leave (100% - 218px), so the bar column alone gives up the 6 px. */
.sl-r{display:grid;grid-template-columns:minmax(0,calc((100% - 218px) * 5 / 9)) minmax(56px,1fr) 60px 60px 72px;column-gap:8px;align-items:center;padding:4px 0;border-bottom:1px solid var(--rule);}
.sl-r.hd{color:var(--ink-mute);font-size:10.5px;align-items:end;border-bottom:1px solid var(--rule-strong);padding-top:0;}
.sl-r.hd .v{white-space:normal;}
.sl-r .nm{font-family:var(--serif);font-size:14px;line-height:1.3;}
.sl-r .v{text-align:right;white-space:nowrap;}
.sl-r .v2{text-align:right;color:var(--ink-soft);white-space:nowrap;}
.sl-b{grid-column:2;grid-row:1;position:relative;height:13px;}
.sl-m{grid-column:1 / -1;font-family:var(--mono);font-size:10.5px;line-height:1.45;color:var(--ink-mute);margin:1px 0 1px;}
.sl-b span{position:absolute;left:0;display:block;}
.sl-b .a1{top:0;height:7px;background:var(--accent);}
.sl-b .r1{top:0;height:7px;background:rgba(107,134,120,0.38);}
.sl-b .a2{top:9px;height:4px;background:var(--series-prev);}
.sl-b .r2{top:9px;height:4px;background:rgba(138,126,110,0.35);}

/* a market's airports and airlines (mockup C) */
.blist{list-style:none;font-family:var(--mono);font-size:11.5px;font-variant-numeric:tabular-nums;}
.blist li{display:grid;grid-template-columns:minmax(0,1fr) 92px;gap:10px;align-items:center;padding:3px 0;}
.blist .bl{display:flex;flex-direction:column;gap:3px;min-width:0;}
.blist .bn{color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--serif);font-size:13.5px;}
.blist .bt{height:7px;background:var(--rule);}
.blist .bt i{display:block;height:7px;background:var(--accent);}
.blist .bt.c{height:3px;background:transparent;}
.blist .bt.c i{height:3px;background:var(--series-prev);}
.blist .bv{text-align:right;color:var(--ink);line-height:1.3;}
.blist .bv small{display:block;color:var(--ink-mute);font-size:10.5px;}
.blist li.rest .bn{font-style:italic;}
.marklinks{font-family:var(--mono);font-size:12px;color:var(--ink-soft);margin-top:10px;line-height:1.8;}
.marklinks a{margin-right:14px;font-family:var(--serif);font-size:14px;}

/* arrivals by sea */
.sea-f{display:flex;flex-wrap:wrap;gap:8px 40px;font-family:var(--mono);font-size:12px;color:var(--ink-soft);margin-bottom:8px;}
.sea-f b{font-family:var(--display);font-weight:300;font-size:26px;color:var(--ink);display:block;line-height:1.1;font-variation-settings:"opsz" 144,"SOFT" 30;}
.sea-f .c b{color:var(--series-prev);}

/* every market (mockup B) */
.tbox{max-height:540px;overflow:auto;border-bottom:1px solid var(--rule-strong);margin-top:4px;}
table.dt{border-collapse:collapse;width:100%;font-family:var(--mono);font-size:12px;font-variant-numeric:tabular-nums;}
table.dt th,table.dt td{padding:5px 10px;text-align:right;border-bottom:1px solid var(--rule);white-space:nowrap;}
table.dt th{position:sticky;top:0;z-index:1;background:var(--paper);font-weight:500;color:var(--ink-mute);font-size:11px;border-bottom:1px solid var(--rule-strong);vertical-align:bottom;}
table.dt th:first-child,table.dt td:first-child{text-align:left;}
table.dt td:first-child{font-family:var(--serif);font-size:14px;}
table.dt td:first-child a{text-decoration:underline dotted;text-decoration-color:var(--ink-mute);text-underline-offset:3px;}
table.dt td.rg{text-align:left;color:var(--ink-soft);}
table.dt td.na{color:var(--ink-mute);}
table.dt tr.tot td{font-weight:500;background:var(--paper-card);}
table.dt tr.oth td{color:var(--ink-soft);}
table.dt tr.oth1 td{border-top:1px solid var(--rule-strong);}
table.dt tr.cur td{background:var(--paper-card);box-shadow:inset 0 1px 0 var(--accent),inset 0 -1px 0 var(--accent);}
table.dt tr.cur td:first-child{font-weight:600;}
table.dt td.sp{padding-top:2px;padding-bottom:2px;}
table.dt td.sp svg{display:block;margin-left:auto;}

/* end matter and footer (mockup B) */
.endmatter{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:0 36px;margin-top:56px;padding-top:20px;border-top:1px solid var(--rule-strong);}
.furn-hed{font-family:var(--mono);font-size:11px;letter-spacing:0.16em;text-transform:uppercase;color:var(--ink-mute);margin:0 0 10px;font-weight:500;}
.furn p,.furn li{font-size:14px;line-height:1.6;color:var(--ink-soft);}
.furn p{margin-bottom:10px;hyphens:auto;}
.furn ul{list-style:none;}
.furn li{margin-bottom:8px;}
details{margin-bottom:10px;}
details summary{font-family:var(--mono);font-size:11.5px;color:var(--ink-soft);cursor:pointer;display:inline-block;padding:3px 0;border-bottom:0.5px solid var(--ink-mute);}
details ul{margin-top:10px;}
details li{font-size:13.5px;}
footer.footer{background:#2A2620;color:var(--paper);padding:56px 32px 64px;margin-top:64px;}
.footer-grid{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:1.8fr 1fr;gap:48px;}
.footer-label{font-family:var(--mono);font-size:10.5px;letter-spacing:0.2em;text-transform:uppercase;color:rgba(244,238,227,0.55);margin:0 0 22px;font-weight:500;}
.footer-body{font-size:14px;line-height:1.6;color:rgba(244,238,227,0.86);}
.footer-body p{margin-bottom:8px;}
.author-name{font-weight:600;color:var(--paper);font-size:16px;margin-bottom:14px;}
.footer-link{color:var(--paper);text-decoration:underline;text-decoration-thickness:0.5px;text-underline-offset:4px;}
.footer-colophon{max-width:1080px;margin:38px auto 0;padding-top:20px;border-top:0.5px solid rgba(244,238,227,0.18);
  font-family:var(--mono);font-size:11px;letter-spacing:0.08em;color:rgba(244,238,227,0.55);}
.footer-colophon a{color:rgba(244,238,227,0.72);}

@media(max-width:1000px){.kpis,.kpis.n4{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:820px){
  .grid{grid-template-columns:minmax(0,1fr);gap:36px;}
  .endmatter{grid-template-columns:minmax(0,1fr);}
}
@media(max-width:720px){
  .masthead{padding:18px 24px;}
  .masthead-grid{grid-template-columns:1fr;gap:10px;}
  .wordmark,.masthead-back{justify-self:center;}
  .masthead .dateline{display:none;}
  .wrap{padding:0 16px;}
  body{font-size:16px;}
  h1{font-size:30px;}
  .dek{font-size:15.5px;}
  .filters{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;padding:12px 0;}
  .f{display:grid;grid-template-columns:92px minmax(0,1fr);column-gap:8px;row-gap:8px;}
  #show{width:100%;min-width:0;}
  #find{width:100%;min-width:0;grid-column:2;}
  .f-per .tabs{width:100%;}
  .tabs button{flex:1 1 auto;padding:7px 6px;}
  .f-per .pm{grid-column:2;}
  .f select{width:100%;}
  .kpis,.kpis.n4,.kpis.n3{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 18px;}
  .kpi-n{font-size:28px;}
  .kpi-n.t{font-size:23px;}
  .kpi-n.na{font-size:22px;}
  .group-h{font-size:23px;}
  .p-sub,.legend{margin-left:0;}
  .tt-r{grid-template-columns:20px minmax(0,112px) minmax(10px,1fr) 56px 44px;column-gap:6px;}
  .tt-r .sh{display:none;}
  .tt-r .nm{font-size:13px;white-space:normal;line-height:1.25;}
  .rg-r{grid-template-columns:minmax(0,1fr) 128px;column-gap:10px;}
  /* Fix-up 2 (V2): change column 66 px (D 60) for a two-digit range; the gaps give up the 6 px (4 px, D 6), so the name column keeps D's width and no name wraps further. */
  .sl-r{grid-template-columns:minmax(0,1fr) 56px 56px 66px;column-gap:4px;font-size:11px;align-items:baseline;}
  .sl-b{grid-column:1 / -1;grid-row:2;margin-top:3px;}
  .sl-r.hd .sl-b{display:none;}
  .blist li{grid-template-columns:minmax(0,1fr) 84px;}
  table.dt{font-size:11.5px;}
  table.dt th,table.dt td{padding:5px 5px;}
  table.dt td:first-child{white-space:normal;font-size:13px;line-height:1.3;min-width:92px;}
  table.dt .hs{display:none;}
  .tbox{max-height:480px;}
  footer.footer{padding:40px 24px 48px;}
  .footer-grid{grid-template-columns:1fr;gap:30px;}
}
@media(max-width:340px){.tabs button{padding:7px 4px;}}

/* ======================================================================
   Production deltas (SPEC-V3). Everything above is mockup D's <style> block verbatim.
   ====================================================================== */

/* 1.2: skip link, visible only on keyboard focus (v1's rule) */
.skip{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.skip:focus{position:fixed;top:8px;left:8px;width:auto;height:auto;clip:auto;overflow:visible;z-index:60;
  background:var(--paper-card);color:var(--ink);padding:10px 14px;font-family:var(--mono);font-size:12.5px;
  outline:2px solid var(--accent);outline-offset:0;}

/* 8.1: visually hidden text (hidden tables, live region) */
.sr-only{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* 8.1: the Period control is a fieldset of native radios, styled as D's tabs */
fieldset.f{border:0;padding:0;margin:0;min-width:0;}
fieldset.f > legend.f-l{float:left;padding:0;}
.tabs label{position:relative;display:flex;flex:none;}
/* D draws the divider on the button, so a selected tab's accent paints under it: the divider sits on the span here */
.tabs label + label span{border-left:1px solid var(--rule-strong);}
.tabs input{position:absolute;left:0;top:0;width:1px;height:1px;margin:0;opacity:0;pointer-events:none;}
.tabs label span{display:flex;align-items:center;justify-content:center;flex:1 1 auto;font-family:var(--mono);font-size:12.5px;line-height:normal;
  color:var(--ink-soft);padding:7px 12px;min-height:34px;cursor:pointer;white-space:nowrap;}
.tabs input:checked + span{background:var(--accent);color:var(--paper);}
.tabs input:focus-visible + span{outline:2px solid var(--accent);outline-offset:2px;}
.tabs input:disabled + span{color:var(--ink-mute);opacity:0.55;cursor:default;}
@media(max-width:720px){.tabs label{flex:1 1 auto;}.tabs label span{padding:7px 6px;}}
@media(max-width:340px){.tabs label span{padding:7px 4px;}}

/* Section 6: "Download CSV" is a button that looks exactly like D's link */
button.csv{background:none;border:0;border-bottom:0.5px solid var(--ink-mute);border-radius:0;padding:0;margin:0;line-height:inherit;cursor:pointer;text-align:left;}
/* 9.6: a 24 px hit area with a mouse above 720 px that moves nothing; the 44 px rule below wins on phones and touch */
button.csv{position:relative;}
button.csv::before{content:'';position:absolute;left:-2px;right:-2px;top:50%;height:24px;transform:translateY(-50%);}

/* 1.2: end-matter headings are h2 with the look of D's p.furn-hed. In D, ".furn p" outranks ".furn-hed", so the
   approved headings are 14 px, ink-soft, line-height 1.6; the h2 copies that computed style. */
.furn h2.furn-hed{font-size:14px;line-height:1.6;color:var(--ink-soft);hyphens:auto;}

/* 8.1: tap targets on D's phone layout or a coarse pointer only; the CSV buttons and summaries get a 44 px hit area
   that moves nothing */
@media (max-width:720px),(pointer:coarse){
  select,input[type="search"]{min-height:44px;}
  .tabs label span{min-height:44px;}
  button.csv,details summary{position:relative;}
  button.csv::before,details summary::before{content:'';position:absolute;left:-2px;right:-2px;top:50%;height:44px;transform:translateY(-50%);}
}

/* 8.1: scroll targets clear the sticky filter bar; JS sets --stick to its height (0 when static) */
:root{--stick:0px;}
.sc,#sources-section,.panel{scroll-margin-top:calc(var(--stick) + 8px);}
#sc-h:focus{outline:none;}
#sc-h:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

/* 8.2: print */
@media print{
  @page{margin:16mm;}
  body{font-size:11pt;}
  .filters{position:static !important;}
  #find,.tabs input,button.csv,.skip{display:none !important;}
  .tbox{max-height:none !important;overflow:visible !important;}
  svg,svg *,.tt-r .br,.tt-r .br i,.sl-b span,.blist .bt,.blist .bt i,.legend i,.tabs label span,.tt-r.cur,table.dt tr.tot td,table.dt tr.cur td,.caveat,footer.footer{
    -webkit-print-color-adjust:exact;print-color-adjust:exact;}
  .panel{break-inside:avoid;}
  #p-markets,#p-heat{break-inside:auto;}
}

/* Section 6: a panel with no figures keeps the box of its CSV button, so the footer keeps D's height */
button.csv.off{visibility:hidden;}

/* 8.3: the hidden chart tables cost layout only when on screen, and never measure their cells (fixed layout);
   content-visibility:auto keeps them in the accessibility tree */
.sr-tw{content-visibility:auto;contain-intrinsic-size:1px 1px;}
.sr-tw table{table-layout:fixed;width:1px;}

/* ---------- build 2: yearly sections ----------
   Ported from mockup G (ranked rows, small multiples, sex bars, year bars, heat table, type switch) and options H (age Option A,
   the rooms map). Colours: the house palette plus a darkened gold from the CBSL page (#B8852E to #A9792A so lines and bars reach
   3:1 on the paper), a yellow highlight for the shown row, and two tints. Gold is never used for text. */
:root{--gold:#A9792A;--highlight:rgba(240,215,122,0.45);--ramp-lo:#D3DDD4;--map-fill:rgba(44,74,60,0.42);}
/* section index, inside the filter bar: sticky with the bar on laptop and tablet, static on a phone */
.filters .jump{flex:1 0 100%;margin:0;padding-top:8px;border-top:1px solid var(--rule);display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;font-family:var(--mono);font-size:11.5px;letter-spacing:0.12em;text-transform:uppercase;color:var(--ink-mute);}
.jump a{color:var(--ink-soft);text-decoration:none;border-bottom:0.5px solid var(--ink-mute);}
.jump a:hover{color:var(--accent);border-color:var(--accent);}
.jump a{position:relative;}
.jump a::before{content:'';position:absolute;left:-4px;right:-4px;top:-4px;bottom:-4px;}
.jump a[aria-current]{color:var(--ink);border-bottom:1.5px solid var(--accent);}
@media (max-width:720px),(pointer:coarse){.filters .jump{gap:18px 14px;}.jump a::before{top:-11px;bottom:-11px;}}
@media (min-width:721px){.filters .jump{flex:0 0 auto;margin-left:auto;border-top:0;padding-top:0;}}
.jump .lbl{letter-spacing:0.14em;font-size:10.5px;}
.group-h:focus{outline:none;}
.group-h:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.group-h{scroll-margin-top:calc(var(--stick) + 12px);}
.legend i.dash{height:0;width:16px;border-top:2.5px dashed var(--ink-mute);background:none !important;}
.legend i.hair{height:12px;width:0;border-left:1px dashed var(--ink-mute);background:none !important;}
.legend i.tick{width:2px;height:12px;background:var(--ink);}
.legend i.ring{width:9px;height:9px;border:2px solid var(--ink-soft);border-radius:50%;background:var(--paper) !important;}
.legend i.bar2{height:6px;}
svg .halo{paint-order:stroke;stroke:#F4EEE3;stroke-width:3px;stroke-linejoin:round;}
svg .mk{font-family:var(--mono);font-size:11px;font-weight:500;paint-order:stroke;stroke:#F4EEE3;stroke-width:3px;stroke-linejoin:round;}
.sl.cap{max-width:760px;}
.sl-r.rest .nm{font-style:italic;}
.sub-block{margin-top:26px;padding-top:12px;border-top:1px dotted var(--rule-strong);}
.sub-t{font-family:var(--display);font-weight:500;font-size:16px;line-height:1.3;font-variation-settings:"opsz" 24,"SOFT" 50;}
.sub-t.sub-s{margin-top:14px;}
.sub-block .p-sub,.sub-block .legend{margin-left:0;}
.yk{margin-top:18px;}
.yk .kpis{border-bottom:1px solid var(--rule-strong);}
.kpi-n.na.t2{font-size:22px;white-space:normal;}
.how{font-family:var(--mono);font-size:11.5px;line-height:1.55;color:var(--ink-soft);margin-top:10px;max-width:820px;}
.panel .how{margin-top:12px;}
/* ranked rows with a compare-year tick */
.rk{font-family:var(--mono);font-size:12px;font-variant-numeric:tabular-nums;}
.rk-r{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(70px,1.5fr) 64px 64px;column-gap:10px;align-items:center;padding:4px 0;border-bottom:1px solid var(--rule);}
.rk.k1 .rk-r{grid-template-columns:minmax(0,1.25fr) minmax(70px,1.5fr) 64px;}
.rk.k3 .rk-r{grid-template-columns:minmax(0,1.3fr) minmax(70px,1.4fr) 70px 70px 74px;}
.rk-r.hd{color:var(--ink-mute);font-size:10.5px;align-items:end;border-bottom:1px solid var(--rule-strong);padding-top:0;}
.rk-r .nm{font-family:var(--serif);font-size:14px;line-height:1.3;min-width:0;overflow-wrap:break-word;}
.rk-r .nm a{text-decoration:underline dotted;text-decoration-color:var(--ink-mute);text-underline-offset:3px;}
.rk-r .nm em{font-family:var(--mono);font-style:normal;font-size:10.5px;color:var(--ink-mute);margin-left:6px;white-space:nowrap;}
.rk-r .v{text-align:right;white-space:nowrap;}
.rk-r .v2{text-align:right;color:var(--ink-soft);white-space:nowrap;}
.rk-r.hd .v,.rk-r.hd .v2{white-space:normal;line-height:1.3;}
.rk-b{grid-column:2;grid-row:1;position:relative;height:14px;}
.rk-b i{position:absolute;top:3px;height:8px;background:var(--accent);}
.rk-b i.l{background:var(--gold);}
.rk-b b{position:absolute;top:0;width:2px;height:14px;background:var(--ink);}
.rk-r.hd .rk-b{height:auto;}
.rk-r.sub .nm{padding-left:18px;font-size:13px;color:var(--ink-soft);}
.rk-r.sub .rk-b i{background:var(--accent-soft);}
.rk-r.cur{background:var(--highlight);box-shadow:inset 0 1px 0 var(--accent),inset 0 -1px 0 var(--accent);}
.rk-r.cur .nm{font-weight:600;}
.tbox.rkbox{max-height:470px;border-bottom:1px solid var(--rule-strong);}
/* small multiples */
.sm{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 28px;}
.sm.s5{grid-template-columns:repeat(5,minmax(0,1fr));gap:18px 18px;}
.sm-c{min-width:0;}
.sm-t{font-family:var(--display);font-weight:500;font-size:15px;line-height:1.25;font-variation-settings:"opsz" 24,"SOFT" 50;}
.sm-v{font-family:var(--mono);font-size:11px;line-height:1.45;color:var(--ink-soft);margin:1px 0 2px;min-height:16px;}
.sm-v b{font-weight:500;color:var(--ink);}
.sm-v .ff{color:var(--accent);}.sm-v .fl{color:var(--ink-soft);}
.sm-g{width:100%;}
.sm-g svg{display:block;}
/* age, Option A: one row per band, youngest at the top */
.al{font-family:var(--mono);font-size:12px;font-variant-numeric:tabular-nums;}
.al-g{padding:6px 0 7px;border-bottom:1px solid var(--rule);}
.al-r{display:grid;grid-template-columns:minmax(0,112px) minmax(0,1fr) 40px;column-gap:10px;align-items:center;}
.al-n{font-family:var(--serif);font-size:14px;line-height:1.3;}
.al-b{position:relative;height:14px;}
.al-b i{position:absolute;left:0;top:1px;height:12px;background:var(--accent);}
.al-v{text-align:right;font-weight:500;}
.al-r.y2 .al-n{font-family:var(--mono);font-size:10.5px;color:var(--ink-mute);line-height:1.4;}
.al-r.y2 .al-b{height:10px;}
.al-r.y2 .al-b i{top:2px;height:6px;background:var(--series-prev);}
.al-r.y2 .al-v{color:var(--ink-soft);font-size:11px;font-weight:400;}
/* male and female, split bars */
.sx{font-family:var(--mono);font-size:12px;font-variant-numeric:tabular-nums;}
.sx-r{display:grid;grid-template-columns:40px minmax(60px,1fr) 52px 52px;column-gap:10px;align-items:center;padding:3px 0;border-bottom:1px solid var(--rule);}
.sx-r.hd{color:var(--ink-mute);font-size:10.5px;border-bottom:1px solid var(--rule-strong);}
.sx-r .y{color:var(--ink-soft);}
.sx-r .v{text-align:right;}
.sx-b{display:flex;height:12px;}
.sx-b i.m{background:var(--accent);}
.sx-b i.f{background:var(--gold);}
.sx-b.na{background:repeating-linear-gradient(45deg,rgba(138,126,110,0.55) 0 1px,transparent 1px 5px);height:12px;}
.sx-r.gap .v,.sx-r.gap .y{color:var(--ink-mute);}
.sx-r.cur{background:var(--paper-card);box-shadow:inset 0 1px 0 var(--accent),inset 0 -1px 0 var(--accent);}
.sx-r.cur .y{color:var(--ink);font-weight:500;}
.sx-r.cmp .y{color:var(--ink);}
.sx-r.hd .sx-b{height:auto;}
/* year bars: establishments and rooms */
.acc2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 24px;}
.acc2 > div{min-width:0;}
.yb{font-family:var(--mono);font-size:12px;font-variant-numeric:tabular-nums;}
.yb-h{font-size:10.5px;color:var(--ink-mute);border-bottom:1px solid var(--rule-strong);padding-bottom:4px;}
.yb-r{display:grid;grid-template-columns:62px minmax(20px,1fr) 58px;column-gap:8px;align-items:center;padding:4px 0;border-bottom:1px solid var(--rule);}
.yb-r .y{color:var(--ink-soft);}
.yb-r .bt{height:9px;background:var(--rule);}
.yb-r .bt i{display:block;height:9px;background:var(--accent);}
.yb-r .v{text-align:right;}
.yb-r.cur{background:var(--highlight);box-shadow:inset 0 1px 0 var(--accent),inset 0 -1px 0 var(--accent);}
.yb-r.cur .y{color:var(--ink);font-weight:500;}
/* the shown market's row in the profile table */
#p-profile table.dt tr.cur td{background:var(--highlight);}
/* rooms by district: circles on a schematic outline */
.isl{display:block;width:100%;max-width:480px;height:auto;margin-left:auto;margin-right:auto;} /* centred in its full-width panel; a no-op below 480 px */
.isl text{font-size:9px;fill:var(--ink-soft);paint-order:stroke;stroke:var(--paper);stroke-width:2.6px;stroke-linejoin:round;}
.isl .n{font-family:var(--serif);font-weight:500;fill:var(--ink);}
.isl .v{font-family:var(--mono);font-size:8.5px;fill:var(--ink-soft);}
.isl .lg{font-family:var(--mono);font-size:8px;fill:var(--ink-mute);}
.isl line{stroke:var(--ink-mute);stroke-width:0.6;}
.isl.nar text{font-size:12px;}
@media (max-width:340px){ .isl.nar text{font-size:12.5px;} } /* keeps district labels at 9 px or more on a 320 px screen (map is 288 px wide for a 395-unit viewBox) */
.isl.nar .v{font-size:11.5px;}
.isl.nar .lg{font-size:10.5px;}
/* classified hotels, heat table */
table.ht{border-collapse:collapse;width:100%;font-family:var(--mono);font-size:12px;font-variant-numeric:tabular-nums;}
table.ht th,table.ht td{padding:6px 6px;text-align:right;border-bottom:1px solid var(--paper);}
table.ht th{font-weight:500;color:var(--ink-mute);font-size:10.5px;border-bottom:1px solid var(--rule-strong);vertical-align:bottom;}
table.ht th:first-child,table.ht td:first-child{text-align:left;font-family:var(--serif);font-size:13.5px;color:var(--ink);}
table.ht th:first-child{font-family:var(--mono);font-size:10.5px;color:var(--ink-mute);}
table.ht td.t{font-weight:500;background:var(--paper-card);}
table.ht tr.tot td{font-weight:500;background:var(--paper-card);border-top:1px solid var(--rule-strong);}
table.ht td.dk{color:var(--paper);}
/* type of attraction: v3's radio tabs, wrapping */
.tabs.tw{display:inline-flex;flex-wrap:wrap;margin:2px 0 10px 31px;max-width:100%;align-self:flex-start;}
table.dt.tk th{white-space:normal;}
table.dt.tk td:first-child{white-space:normal;}
/* load-in motion: bars grow from the left, circles from their centre */
.rk-b i,.al-b i,.bt i,.br i,.sl-b span,.sx-b i{transform-origin:0 50%;}
svg rect[data-bar],svg rect[data-id],svg rect[data-k]{transform-box:fill-box;transform-origin:0 50%;}
.isl .dcirc{transform-box:fill-box;transform-origin:center;}
@media(max-width:820px){.sm.s5{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:720px){
  .filters .jump{padding-top:6px;}
  .sm,.sm.s5{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px;}
  .rk-r,.rk.k3 .rk-r{grid-template-columns:minmax(0,1fr) 62px 62px;column-gap:6px;font-size:11px;align-items:baseline;}
  .rk.k3 .rk-r{grid-template-columns:minmax(0,1fr) 58px 58px 58px;}
  .rk-b{grid-column:1 / -1;grid-row:2;margin-top:3px;}
  .rk-r.hd .rk-b{display:none;}
  .rk-r .nm{font-size:13px;}
  .tabs.tw{margin-left:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));}
  .tabs.tw label span{white-space:normal;line-height:1.2;border-top:1px solid var(--rule-strong);border-left:1px solid var(--rule-strong);}
  .tabs.tw label:nth-child(-n+3) span{border-top:0;}
  .tabs.tw label:nth-child(3n+1) span{border-left:0;}
  .acc2{gap:16px 14px;}
  .yb-r{grid-template-columns:52px minmax(16px,1fr) 52px;column-gap:6px;font-size:11px;}
  table.ht th,table.ht td{padding:5px 3px;font-size:11px;}
  table.ht td:first-child{font-size:12.5px;}
  .al-r{grid-template-columns:minmax(0,92px) minmax(0,1fr) 36px;column-gap:8px;}
  .al-n{font-size:13px;}
  .sx-r{grid-template-columns:36px minmax(40px,1fr) 46px 46px;column-gap:8px;}
  .kpis.n3,.yk .kpis{grid-template-columns:minmax(0,1fr);}
}
@media print{
  .filters .jump{display:none;}
  .rk-r.cur,.yb-r.cur,#p-profile table.dt tr.cur td,.isl,.isl *,.sx-b,.sx-b i,.rk-b i,.al-b i{-webkit-print-color-adjust:exact;print-color-adjust:exact;}
}
/* the yearly headings' scope phrase may wrap on a phone ("All of Sri Lanka; not printed by market" is 300 px of mono) */
#g-vis-s span,#g-att-s span,#g-acc-s span{white-space:normal;}
.sm-v{overflow-wrap:anywhere;}
