/* #report: the sample report viewer. */
/* ---------- 6b. full quarterly reporting: a page at a time ---------- */
.rep{min-height:100vh;display:flex;align-items:center;padding-top:calc(var(--hh) + 20px);padding-bottom:30px}
.rep-in{width:100%;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:center}
.rep-tx{grid-column:1/5}
.rep-tx .lede{margin-top:16px}
.rep-r{grid-column:6/13;display:flex;flex-direction:column;height:min(780px,calc(100vh - var(--hh) - 90px));min-height:480px}
.rep-lk{display:flex;align-items:center;justify-content:flex-start;gap:clamp(14px,1.6vw,22px);height:44px;margin-bottom:clamp(18px,3vh,30px)}
.rep-lk .lk-ra{height:23px;width:auto}
.rep-lk .lk-x{font:400 24px/1 var(--disp);color:var(--grey)}
.rep-lk .lk-c{display:block;height:30px}
.rep-lk .lk-c .an-logo{height:100%;width:auto;max-width:14vw}
.rep-lk .lk-c .an-t{font:700 22px/1 var(--disp);color:var(--brand)}
.rep-v{flex:1;min-height:0;position:relative}
.rep-v:focus-visible{outline:2px solid var(--red);outline-offset:4px}
.rep-st{position:absolute;left:78px;right:78px;top:6px;bottom:40px;--brand:#2F4B6E}
.rep-pg{position:absolute;inset:0;margin:auto;background:#fff;overflow:hidden;box-shadow:0 1px 3px rgba(20,22,26,.18),0 12px 32px rgba(20,22,26,.14)}
.rep-sc{position:absolute;left:0;top:0;width:794px;height:1123px;transform-origin:0 0}
.rep-pg{visibility:hidden}
.rep-pg:first-child{visibility:visible}
.rep-v.pg .rep-pg{visibility:hidden}
.rep-v.pg .rep-pg.on{visibility:visible}   /* once the viewer is in use (reporting.js) the page showing is the one marked `on`, not the first */
.rb{all:unset;box-sizing:border-box;position:absolute;top:50%;margin-top:-23px;width:46px;height:46px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px var(--line),0 6px 16px rgba(20,22,26,.1);color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:color .18s var(--e),box-shadow .18s var(--e),opacity .2s}
.rb:hover{color:var(--red);box-shadow:0 0 0 1px var(--red),0 6px 16px rgba(20,22,26,.12)}
.rb:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.rb.prev{left:16px}
.rb.next{right:16px}
.rb[disabled]{opacity:.3;cursor:default;pointer-events:none}
.rep-bar{position:absolute;left:0;right:0;bottom:6px;text-align:center;font:500 15px var(--sans);color:var(--grey);font-variant-numeric:tabular-nums}
.rep-bar b{color:var(--ink);font-weight:650}
@media (max-width:959px){
  .rep{min-height:0;display:block;padding-top:calc(var(--hh) + 14px);padding-bottom:20px}
  .rep-in{display:block}
  .rep-r{display:block;height:auto;min-height:0;margin-top:28px}
  .rep-lk{margin-bottom:14px}
  .rep-lk .lk-c .an-logo{max-width:46vw}
  .rep-v{height:min(150vw,640px)}
  .rep-st{left:14px;right:14px;top:6px;bottom:64px}
  .rb{top:auto;bottom:8px;margin-top:0;width:42px;height:42px}
  .rb.prev{left:calc(50% - 96px)}
  .rb.next{left:auto;right:calc(50% - 96px)}
  .rep-bar{bottom:20px}
}

/* the page count sits over the pager buttons on a phone; it must never take their taps */
.rep-bar{pointer-events:none}
/* touch: the swipe is the script's (only the vertical pan is the browser's); the phone's pager buttons are 44x44 */
@media (pointer:coarse){.rep-v{touch-action:pan-y}}
@media (pointer:coarse) and (max-width:959px){.rb{width:44px;height:44px}}
@media (min-width:960px){@supports (height:100dvh){
  .rep{min-height:100dvh}
  .rep-r{height:min(780px,calc(100dvh - var(--hh) - 90px))}
}}
@media (min-width:960px) and (max-height:699px){
  .rep{padding-top:calc(var(--hh) + 10px);padding-bottom:12px}
  .rep-r{min-height:0;height:calc(100vh - var(--hh) - 30px)}
}
@media (min-width:960px) and (max-height:699px){@supports (height:100dvh){.rep-r{height:calc(100dvh - var(--hh) - 30px)}}}
