/* ==========================================================================
   Town of Lisbon, Maine — Property Tax & Assessment Lookup
   Design language after the Kennebunk, ME municipal site:
     deep navy masthead, mid-blue title band, cream page ground,
     white surfaces on soft shadow, pill-shaped controls,
     one geometric sans (Outfit) carrying every level of hierarchy.

   Single light theme on purpose: a public town service should look the same
   for every resident, so the page does not follow the viewer's OS dark mode.
   Every colour is painted explicitly so the page holds on any host background.
   ========================================================================== */

/* Outfit, self-hosted — no third-party request from a resident's browser. */
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/outfit-400.woff2") format("woff2"); }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/outfit-500.woff2") format("woff2"); }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/outfit-600.woff2") format("woff2"); }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/outfit-700.woff2") format("woff2"); }

:root {
  color-scheme: light;

  /* Brand blues, sampled from the reference site */
  --navy:       #043454;
  --navy-2:     #0A4368;
  --navy-3:     #12587F;
  --blue:       #1D5B82;
  --blue-light: #B0D3EB;
  --blue-pale:  #E6F1F8;

  /* Neutrals, warmed very slightly so they sit on the cream ground */
  --ink:      #10222E;
  --ink-2:    #2C3E49;
  --slate:    #566671;
  --slate-2:  #7C8B95;
  --line:     #DED7C9;
  --line-2:   #EDE7DB;

  --cream:     #F8F1E6;
  --cream-2:   #FCF8F1;
  --surface:   #FFFFFF;
  --surface-2: #FAFCFD;

  /* Semantic — held apart from the brand blues on purpose */
  --rise:    #96570F;
  --rise-bg: #FAEFDD;
  --fall:    #14634A;
  --fall-bg: #E4F1EB;

  --focus: #12587F;

  --r-sm: 6px;
  --r:    10px;
  --r-lg: 14px;
  --pill: 999px;

  --shadow-1: 0 1px 2px rgba(4, 52, 84, .07), 0 2px 6px rgba(4, 52, 84, .06);
  --shadow-2: 0 4px 14px rgba(4, 52, 84, .11), 0 2px 5px rgba(4, 52, 84, .06);
  --shadow-3: 0 22px 60px rgba(4, 52, 84, .30);

  --sans: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

* { box-sizing: border-box; }

/* An author `display` rule outranks the UA's [hidden] rule, so elements toggled
   with .hidden = true (the results bar) would otherwise stay visible. */
[hidden] { display: none !important; }

/* App shell: masthead pinned to the top of the window, footer pinned to the
   bottom, and everything between scrolls in the middle band. Flex column rather
   than position:fixed, so the bands can never overlap the scrolling content. */
html { height: 100%; }

body {
  margin: 0;
  background: var(--cream);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;

  display: flex;
  flex-direction: column;
  height: 100vh;
  height: 100dvh;      /* keeps the footer put when mobile browser chrome slides */
  overflow: hidden;
}

.masthead, footer { flex: 0 0 auto; }

.appscroll {
  flex: 1 1 auto;
  min-height: 0;       /* without this a flex child refuses to shrink and scroll */
  overflow-y: auto;
  overscroll-behavior: contain;
}

h1, h2, h3 { margin: 0; font-weight: 600; text-wrap: balance; }
a { color: var(--navy-3); }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; border-radius: 4px; }

.wrap { width: min(1180px, 100% - 2.5rem); margin-inline: auto; }

/* ------------------------------------------------------------- masthead --- */
.masthead { background: var(--navy); color: #fff; }
.masthead a { color: #fff; }

.masthead-top { display: flex; align-items: center; gap: 1rem; padding: .9rem 0; flex-wrap: wrap; }

.seal { height: 54px; width: auto; flex: none; display: block; }
.wordmark { display: flex; flex-direction: column; line-height: 1.2; }
.wordmark b { font-size: 1.2rem; font-weight: 600; letter-spacing: .015em; }
.wordmark span {
  font-size: .66rem; font-weight: 500; letter-spacing: .17em;
  text-transform: uppercase; color: var(--blue-light);
}
.masthead-links {
  margin-left: auto; display: flex; gap: 1.6rem;
  font-size: .8rem; font-weight: 500; letter-spacing: .07em; text-transform: uppercase;
}
.masthead-links a { text-decoration: none; opacity: .88; }
.masthead-links a:hover { opacity: 1; text-decoration: underline; text-underline-offset: 4px; }

/* Title band — the reference's mid-blue stripe. */
.titlebar { background: var(--blue); }
.titlebar .wrap { padding: 1.9rem 0 2.5rem; }
.titlebar h1 {
  color: #fff; font-weight: 700; letter-spacing: .015em; text-transform: uppercase;
  font-size: clamp(1.5rem, 3.6vw, 2.15rem); line-height: 1.12;
}
.titlebar p { color: #CFE4F2; margin: .45rem 0 0; max-width: 60ch; font-size: .97rem; }

/* --------------------------------------------------------------- search --- */
.console {
  background: var(--surface); border-radius: var(--r-lg); box-shadow: var(--shadow-2);
  margin-top: -1.4rem; position: relative; z-index: 2;
  padding: 1.4rem 1.6rem 1.45rem;
}

.searchrow { display: flex; gap: .65rem; align-items: stretch; }
.searchfield { position: relative; flex: 1; display: flex; }
#q {
  width: 100%; font: inherit; font-size: 1.05rem; color: var(--ink);
  padding: .8rem 1.25rem .8rem 1.35rem;
  border: 1.5px solid var(--line); border-radius: var(--pill);
  background: var(--cream-2);
}
#q::placeholder { color: var(--slate-2); }
#q:focus { border-color: var(--blue); background: var(--surface); outline: none; box-shadow: 0 0 0 3px var(--blue-pale); }

.btn {
  font: inherit; font-weight: 600; cursor: pointer;
  border-radius: var(--pill); border: 1.5px solid transparent;
  padding: .6rem 1.15rem; display: inline-flex; align-items: center; gap: .5rem;
  white-space: nowrap; transition: background-color .13s ease, border-color .13s ease;
}
.btn-primary { background: var(--navy); color: #fff; padding-inline: 1.7rem; }
.btn-primary:hover { background: var(--navy-2); }
.btn-ghost { background: var(--surface); color: var(--ink-2); border-color: var(--line); font-weight: 500; font-size: .88rem; }
.btn-ghost:hover { border-color: var(--blue); color: var(--navy-3); }
@media (prefers-reduced-motion: reduce) { .btn { transition: none; } }

.searchbtns { display: flex; gap: .65rem; }

.facets {
  display: flex; gap: 1.9rem; flex-wrap: wrap;
  margin-top: 1.15rem; padding-top: 1.1rem; border-top: 1px solid var(--line-2);
}
.facet { display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; }
.facet > .lbl {
  font-size: .68rem; font-weight: 700; letter-spacing: .13em;
  text-transform: uppercase; color: var(--slate);
}

.chips { display: flex; flex-wrap: wrap; gap: .25rem; background: var(--cream); padding: .25rem; border-radius: var(--pill); }
.chips input { position: absolute; opacity: 0; width: 0; height: 0; }
.chips label {
  font-size: .84rem; font-weight: 500; padding: .34rem .85rem; border-radius: var(--pill);
  cursor: pointer; color: var(--slate); white-space: nowrap;
}
.chips input:checked + label { background: var(--navy); color: #fff; font-weight: 600; }
.chips input:focus-visible + label { outline: 3px solid var(--focus); outline-offset: 2px; }

.years { display: flex; gap: .4rem; flex-wrap: wrap; }
.years input { position: absolute; opacity: 0; width: 0; height: 0; }
.years label {
  font-size: .84rem; font-weight: 500; font-variant-numeric: tabular-nums;
  padding: .34rem .8rem; border: 1.5px solid var(--line); border-radius: var(--pill);
  cursor: pointer; color: var(--slate); background: var(--surface);
}
.years label:hover { border-color: var(--blue); color: var(--navy-3); }
.years input:checked + label { background: var(--blue-pale); border-color: var(--navy-3); color: var(--navy); font-weight: 600; }
.years input:focus-visible + label { outline: 3px solid var(--focus); outline-offset: 2px; }

/* -------------------------------------------------------------- results --- */
.appscroll > main { padding-bottom: 2.2rem; }
.resultbar { display: flex; align-items: baseline; gap: 1rem; flex-wrap: wrap; margin: 2rem 0 .95rem; }
.resultbar h2 { font-size: .82rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: var(--slate); }
.resultbar .count { color: var(--ink-2); font-size: .92rem; font-weight: 500; }
.resultbar .actions { margin-left: auto; display: flex; gap: .5rem; }

.tablecard {
  background: var(--surface); border-radius: var(--r); box-shadow: var(--shadow-1);
  overflow: hidden; position: relative;
}
.tablescroll { overflow-x: auto; }

/* Soft edge showing the table still has columns off-screen in that direction. */
.tablecard::before, .tablecard::after {
  content: ""; position: absolute; top: 0; bottom: 0; width: 26px;
  pointer-events: none; opacity: 0; transition: opacity .15s ease; z-index: 3;
}
.tablecard::before { left: 0;  background: linear-gradient(to right, rgba(4,52,84,.13), rgba(4,52,84,0)); }
.tablecard::after  { right: 0; background: linear-gradient(to left,  rgba(4,52,84,.13), rgba(4,52,84,0)); }
.tablecard.scroll-l::before, .tablecard.scroll-r::after { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .tablecard::before, .tablecard::after { transition: none; } }

table.results {
  border-collapse: separate; border-spacing: 0; width: 100%;
  font-variant-numeric: tabular-nums; font-size: .92rem;
  /* Fixed layout so columns stay put between searches instead of resizing to
     whatever the current result set happens to contain. */
  table-layout: fixed;
}

table.results thead th {
  background: var(--cream); color: var(--slate);
  font-size: .66rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  text-align: left; white-space: nowrap; padding: .6rem .9rem;
  border-bottom: 1px solid var(--line);
}
table.results th.num, table.results td.num { text-align: right; }

/* Sortable headers */
table.results th.sortable { cursor: pointer; user-select: none; }
table.results th.sortable:hover { color: var(--navy-3); }
table.results th .arrow { opacity: 0; margin-left: .3rem; font-size: .8em; }
table.results th[aria-sort] .arrow { opacity: 1; }
table.results th[aria-sort] { color: var(--navy); }

/* One tbody per property. Rows inside a group are separated by a hairline; the
   group itself closes with a full rule, so a property reads as a single block. */
table.results tbody.pgroup { cursor: pointer; }
table.results tbody.pgroup td {
  padding: .55rem .9rem; white-space: nowrap; vertical-align: top;
  border-bottom: 1px solid var(--line-2);
}
table.results tbody.pgroup tr.yr:not(:last-child) td { border-bottom: 1px dotted var(--line-2); }
table.results tbody.pgroup tr:last-child td { border-bottom: 1px solid var(--line); }
table.results tbody.pgroup:last-child tr:last-child td { border-bottom: 0; }

table.results tbody.pgroup:hover td { background: var(--blue-pale); }
table.results tbody.pgroup tr:focus-visible { outline: 3px solid var(--focus); outline-offset: -3px; }
table.results tbody.pgroup:focus-within td { background: var(--blue-pale); }

/* Property row, then one indented row per fiscal year. */
tr.phead td { border-bottom: 0; padding-bottom: .3rem; }
tr.yr td.indent { border-bottom: 0; }
tr.phead + tr.yr td { padding-top: .1rem; }
tr.yr:not(.solo) td.fy { padding-left: 0; }

td.addr { font-weight: 600; color: var(--heading); }
td.addr .addr-line { display: block; overflow: hidden; text-overflow: ellipsis; }
td.addr .addr-sub {
  display: block; font-weight: 400; font-size: .8rem; color: var(--slate);
  margin-top: .1rem; white-space: normal;
}
td.owner { color: var(--ink-2); font-weight: 400; overflow: hidden; text-overflow: ellipsis; }
td.parcel { color: var(--slate); font-size: .86rem; font-weight: 400; overflow: hidden; text-overflow: ellipsis; }

td.fy { font-size: .8rem; font-weight: 600; color: var(--slate); letter-spacing: .03em; }
td.fy.current { color: var(--navy); }
tr.yr:not(.solo) td.fy, tr.yr:not(.solo) td.num { color: var(--slate); }
tr.yr:not(.solo) td.fy.current, tr.yr:not(.solo):first-of-type td.num { color: var(--ink-2); }
tr.yr:not(.solo) td.tax .amount { font-weight: 700; color: var(--ink); }

td.tax { font-weight: 700; }
.taxwrap { display: flex; justify-content: flex-end; align-items: baseline; gap: .4rem; }
.taxwrap .amount { white-space: nowrap; }
.taxwrap .delta { min-width: 3.6rem; text-align: center; flex: none; }
td.dash { color: var(--slate-2); font-weight: 400; font-size: .86rem; }
/* Beats `tbody.pgroup td { white-space: nowrap }` so this phrase can wrap. */
table.results tbody.pgroup td.dash { white-space: normal; }

.chev { color: var(--slate-2); text-align: right; }
table.results tbody.pgroup:hover .chev { color: var(--navy-3); }

col.c-addr   { width: 23%; }
col.c-owner  { width: 21%; }
col.c-parcel { width: 12%; }
col.c-fy     { width: 8%;  }
col.c-num    { width: 16%; }
col.c-chev   { width: 3%;  }

.delta { font-size: .73rem; font-weight: 600; padding: .1rem .38rem; border-radius: var(--pill); }
.delta.up { color: var(--rise); background: var(--rise-bg); }
.delta.down { color: var(--fall); background: var(--fall-bg); }

.morenote {
  padding: .7rem .9rem; font-size: .84rem; color: var(--slate);
  background: var(--cream-2); border-top: 1px solid var(--line-2); text-align: center;
}

.empty, .loading {
  background: var(--surface); border-radius: var(--r); box-shadow: var(--shadow-1);
  padding: 3.2rem 1.5rem; text-align: center; color: var(--slate);
}
.empty strong { display: block; font-size: 1.18rem; font-weight: 600; color: var(--navy); margin-bottom: .4rem; }

/* --------------------------------------------------------------- detail --- */
.scrim {
  position: fixed; inset: 0; background: rgba(4, 24, 38, .58);
  display: none; z-index: 50; padding: 2.5rem 1.25rem; overflow-y: auto;
}
.scrim.open { display: block; }
.sheet {
  background: var(--surface); border-radius: var(--r-lg); box-shadow: var(--shadow-3);
  width: min(880px, 100%); margin-inline: auto; overflow: hidden;
}
.sheet-head {
  background: var(--navy); color: #fff; padding: 1.25rem 1.6rem;
  display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem;
}
.sheet-head h2 { font-size: 1.35rem; font-weight: 600; color: #fff; }
.sheet-head .sub { color: var(--blue-light); font-size: .87rem; margin-top: .22rem; }
.x {
  background: rgba(255,255,255,.15); border: 0; color: #fff; cursor: pointer;
  width: 34px; height: 34px; border-radius: 50%; font-size: 1.15rem; line-height: 1; flex: none;
}
.x:hover { background: rgba(255,255,255,.3); }

.sheet-body { padding: 1.5rem 1.6rem 1.7rem; display: flex; flex-direction: column; gap: 1.7rem; }

.section-label {
  font-size: .68rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase;
  color: var(--slate); margin-bottom: .6rem;
}

.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)); gap: .1rem 1.6rem; }
.fact { padding: .55rem 0; border-top: 1px solid var(--line-2); }
.fact dt { font-size: .77rem; color: var(--slate); }
.fact dd { margin: .12rem 0 0; font-weight: 600; font-variant-numeric: tabular-nums; }

.tablewrap { overflow-x: auto; border-radius: var(--r-sm); box-shadow: inset 0 0 0 1px var(--line-2); }
table.hist { border-collapse: collapse; width: 100%; font-variant-numeric: tabular-nums; font-size: .89rem; }
table.hist th, table.hist td { padding: .58rem .85rem; text-align: right; white-space: nowrap; }
table.hist th:first-child, table.hist td:first-child { text-align: left; }
table.hist thead th {
  background: var(--cream); border-bottom: 1px solid var(--line);
  font-size: .67rem; letter-spacing: .1em; text-transform: uppercase; color: var(--slate); font-weight: 700;
}
table.hist tbody tr + tr td { border-top: 1px solid var(--line-2); }
table.hist tbody tr:hover td { background: var(--surface-2); }
table.hist td.money { font-weight: 700; }
table.hist tr.current td { background: var(--blue-pale); }
table.hist tr.current:hover td { background: var(--blue-pale); }

.charthead { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .55rem; flex-wrap: wrap; }
.chartbox { border-radius: var(--r-sm); background: var(--surface); box-shadow: inset 0 0 0 1px var(--line-2); padding: .95rem .6rem .35rem; }
.chart { width: 100%; height: auto; display: block; overflow: visible; }
.chart .grid-line { stroke: var(--line); stroke-width: 1; }
.chart .axis-text { fill: var(--slate); font-size: 11px; font-family: var(--sans); font-variant-numeric: tabular-nums; }
.chart .series-area { fill: var(--blue); opacity: .15; }
.chart .series-line { fill: none; stroke: var(--blue); stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.chart .dot { fill: var(--surface); stroke: var(--blue); stroke-width: 2.5; }
.chart .dot-last { fill: var(--navy); stroke: var(--surface); stroke-width: 2.5; }
.chart .val-text { fill: var(--ink-2); font-size: 11px; font-weight: 700; font-family: var(--sans); font-variant-numeric: tabular-nums; }

.note {
  font-size: .83rem; color: var(--slate); background: var(--blue-pale);
  border-left: 3px solid var(--blue-light); padding: .7rem .95rem; border-radius: 0 var(--r-sm) var(--r-sm) 0;
}

/* --------------------------------------------------------------- footer --- */
footer { background: var(--navy); color: #BFD2DF; padding: 1.35rem 0 1.45rem; font-size: .84rem; box-shadow: 0 -6px 18px rgba(4,52,84,.18); }
footer .wrap { display: flex; gap: 2.5rem; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; }
footer b {
  color: #fff; font-size: .7rem; font-weight: 700; letter-spacing: .13em;
  text-transform: uppercase; display: block; margin-bottom: .5rem;
}
footer a { color: #fff; }
footer .disclaimer { max-width: 52ch; line-height: 1.5; }
footer b { margin-bottom: .35rem; }

.toast {
  position: fixed; left: 50%; bottom: calc(var(--footer-h, 5rem) + 1rem); transform: translateX(-50%);
  background: var(--navy); color: #fff; padding: .75rem 1.2rem; border-radius: var(--pill);
  border: 1px solid var(--blue-light);
  box-shadow: var(--shadow-3); font-size: .88rem; z-index: 100; max-width: min(32rem, calc(100% - 2rem));
}

/* Narrow screens: app.js omits the owner, parcel and chevron cells entirely and
   folds owner+parcel under the address, so only sizing is left to do here. */
@media screen and (max-width: 860px) {
  table.results { font-size: .84rem; }
  table.results thead th { white-space: normal; }
  col.c-addr { width: 34%; }
  col.c-fy   { width: 18%; }
  col.c-num  { width: 24%; }
  /* Too narrow for the figure and its badge side by side — let the badge wrap. */
  .taxwrap { flex-wrap: wrap; row-gap: .12rem; }
  .taxwrap .delta { min-width: 0; }
  table.results tbody.pgroup td { padding-inline: .5rem; }
  table.results thead th { padding-inline: .5rem; }
}

/* Phone widths: tighten type and padding so the year labels and dollar figures
   are never clipped, and the table still needs no sideways scrolling. */
@media screen and (max-width: 460px) {
  table.results { font-size: .78rem; }
  table.results tbody.pgroup td, table.results thead th { padding-inline: .35rem; }
  col.c-addr { width: 30%; }
  col.c-fy   { width: 19%; }
  col.c-num  { width: 25.5%; }
}

/* On a phone a permanently pinned footer costs too much of the screen, so the
   shell relaxes back into a normally scrolling page. */
@media screen and (max-width: 760px) {
  body { height: auto; min-height: 100dvh; overflow: visible; display: block; }
  .appscroll { overflow: visible; }
  .appscroll > main { padding-bottom: 1rem; }
  footer { margin-top: 2rem; box-shadow: none; }
  .toast { bottom: 1.5rem; }
}

@media screen and (max-width: 620px) {
  .wrap { width: calc(100% - 1.75rem); }
  .console { padding: 1.15rem; }
  .searchrow { flex-direction: column; }
  .searchbtns > .btn { flex: 1; justify-content: center; }
  .masthead-links { display: none; }
  .facets { gap: 1.1rem; flex-direction: column; align-items: flex-start; }
  .chips { width: 100%; }
  .chips label { flex: 1; text-align: center; }
  .resultbar .actions { margin-left: 0; }
  .scrim { padding: 0; }
  .sheet { border-radius: 0; min-height: 100vh; }
}

.printhead { display: none; }

@media print {
  @page { margin: 0.5in; }

  /* The shell clips to the viewport on screen; on paper it has to flow. */
  html, body { height: auto; overflow: visible; display: block; }
  .appscroll { overflow: visible; min-height: 0; }
  .appscroll > main { padding-bottom: 0; }
  body { background: #fff; color: #000; font-size: 9.5pt; }
  .wrap { width: 100%; }

  .masthead, .titlebar, .console, .resultbar .actions,
  .x, #toast, footer, .charthead .chips, .chev, .morenote,
  .sheet-body > div:last-child { display: none !important; }

  .printhead {
    display: block !important;
    border-bottom: 2.5px solid var(--navy);
    padding-bottom: .35rem; margin-bottom: 1rem;
  }
  .printhead .ph-town { font-size: 14pt; font-weight: 700; letter-spacing: .01em; color: var(--navy); }
  .printhead .ph-sub  { font-size: 9pt; color: #444; margin-top: .12rem; }

  /* ---- search-results printout ---- */
  body[data-print="results"] .scrim { display: none !important; }
  .resultbar { margin: 0 0 .5rem; }
  .tablecard { box-shadow: none; border-radius: 0; }
  .tablescroll { overflow: visible; }
  table.results { width: 100%; font-size: 8.5pt; }
  table.results thead { display: table-header-group; }
  table.results thead th { background: none; border-bottom: 1.2px solid #000; color: #333; padding: .28rem .4rem; }
  table.results tbody.pgroup { break-inside: avoid; page-break-inside: avoid; }
  table.results tbody.pgroup td { padding: .26rem .45rem; border-bottom: 1px solid #EEE; }
  /* Paper is narrower than a desktop window: give the figures more of it. */
  col.c-addr   { width: 20%; }
  col.c-owner  { width: 19%; }
  col.c-parcel { width: 11%; }
  col.c-fy     { width: 9%;  }
  col.c-num    { width: 20%; }
  col.c-chev   { width: 1%;  }
  table.results tbody.pgroup tr:last-child td { border-bottom: 1px solid #BBB; }
  table.results tbody.pgroup:hover td { background: none; }
  td.addr { color: #000; }
  td.addr .addr-sub {
  display: block; font-weight: 400; font-size: .8rem; color: var(--slate);
  margin-top: .1rem; white-space: normal;
}
  .delta { background: none !important; padding: 0; }

  /* ---- single-property printout ---- */
  body[data-print="detail"] main,
  body[data-print="detail"] .resultbar { display: none !important; }
  body[data-print="detail"] .scrim {
    display: block !important; position: static; inset: auto;
    background: none; padding: 0; overflow: visible;
  }
  .sheet { width: 100%; border-radius: 0; box-shadow: none; overflow: visible; }
  .sheet-head {
    background: none !important; color: #000; padding: 0 0 .5rem;
    border-bottom: 1px solid #CFCFCF; margin-bottom: .9rem;
  }
  .sheet-head h2 { color: var(--navy); font-size: 15pt; }
  .sheet-head .sub { color: #444; }
  .sheet-body { padding: 0; gap: 1.1rem; }
  .chartbox { box-shadow: inset 0 0 0 1px #CFCFCF; background: none; break-inside: avoid; }
  table.hist { font-size: 9pt; }
  table.hist thead th { background: none; border-bottom: 1.5px solid #000; }
  table.hist tr.current td { background: none; font-weight: 700; }
  .tablewrap { box-shadow: none; overflow: visible; }
  .note { background: none; border-left: 2px solid #9A9A9A; font-size: 8.5pt; }
  section { break-inside: avoid; }
}