/* 28 October 2026. Section 4 sits on the page's black with no card and no fill behind the equation, so the chrome
   pieces carry on behind it (Annie: "a big black seamless thing where the blobs kind of keep going"). Further
   information opens one level only, as slide-downs of dense text at 13 px, about 10 pt (Annie: "slide-downs of dense
   information so that people can read it if they want. Maybe even in size 10 font"). The archive of earlier maps and
   equations follows the same rule: its dated rows slide down, and everything inside them shows open.
   Rules that compete with the annie-roles layer sit in that layer with more specific selectors. */

:root{--slide-text:13px;--slide-line:1.5;--slide-ease:cubic-bezier(.22,.61,.36,1)}

/* ---------------------------------------------------------------- section 4, open on the page */
.open-sec{position:relative;z-index:2;min-width:0;scroll-margin-top:24px;--indent:44px}
.open-sec .sec-title{margin:0;font:inherit;position:relative;padding-left:var(--indent)}
.open-lead{margin:22px 0 0 var(--indent);max-width:68ch}
.open-lead p{margin:0 0 12px}
.open-lead a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
/* the revision capabilities table: plain on the black, no fill, thin rules between rows */
.lead-table{margin:2px 0 14px;overflow-x:auto}
.lead-table table{border-collapse:collapse;width:100%}
.open-body{margin:0}
.open-sec #formula-construction{margin:64px 0 18px;text-align:center;overflow-x:auto;overflow-y:hidden}
.open-sec #evidence-standard{margin:0 auto 56px;max-width:60ch;text-align:center}

/* rows: the label in the section colour, the page's arrow after it; open turns the arrow up, as on the cards */
.slides{margin:0 0 0 var(--indent);max-width:860px}
.slide-head{margin:0}
.slide-toggle{all:unset;box-sizing:border-box;display:flex;align-items:baseline;gap:12px;width:100%;padding:9px 0;cursor:pointer;
  font-family:var(--role-font,var(--font));-webkit-tap-highlight-color:transparent}
.slide-letter{flex:0 0 1.1em;font-size:18px;font-weight:700;line-height:1.35;
  background:linear-gradient(90deg,var(--c1),var(--c2));-webkit-background-clip:text;background-clip:text;color:transparent}
.slide-label{font-size:18px;line-height:1.35;color:var(--c2);transition:color .25s}
.slide-toggle .arrow,.slide-fold .arrow,#iterations .arch-arrow{position:static}
.slide-toggle .arrow{flex:0 0 auto;width:var(--arrow,9px);height:var(--arrow,9px);fill:var(--c1);align-self:center;
  transition:transform .42s var(--slide-ease)}
.slide-toggle:hover .slide-label{color:var(--c1)}
.slide-toggle:hover .arrow{transform:translateX(2px)}
.slide-toggle[aria-expanded="true"] .arrow{transform:rotate(-90deg)}
.slide-toggle[aria-expanded="true"]:hover .arrow{transform:rotate(-90deg) translateY(-2px)}
.slide-toggle:focus-visible{outline:1px solid var(--c1);outline-offset:4px}
.slide-body{overflow:hidden}
.slide-body[hidden]{display:none}
.slide-inner{padding:4px 0 22px calc(1.1em + 12px);max-width:92ch}
.slide-fold{all:unset;display:block;width:var(--arrow,9px);height:var(--arrow,9px);padding:10px 10px 0 0;cursor:pointer}
.slide-fold .arrow{display:block;width:100%;height:100%;fill:var(--c1);transform:rotate(-90deg);transition:transform .25s}
.slide-fold:hover .arrow{transform:rotate(-90deg) translateY(-2px)}
.slide-fold:focus-visible{outline:1px solid var(--c1);outline-offset:4px}

@layer annie-roles{
  /* the equation and the ones inside the rows: no box, no fill, no line beside them */
  #measurement-development #approved-equation-copy .equation-panel,
  #measurement-development #formula-construction.equation-panel{
    background:none !important;border:0 !important;box-shadow:none !important;border-radius:0 !important;
    padding:0 !important;min-height:0 !important;height:auto !important;
    -webkit-backdrop-filter:none !important;backdrop-filter:none !important;
  }
  #measurement-development #approved-equation-copy .slide-inner .equation-panel{margin:14px 0 !important}
  #measurement-development #approved-equation-copy .slide-inner .equation{font-size:22px !important;line-height:1.3 !important}

  /* dense text inside the rows, about 10 pt */
  #measurement-development #approved-equation-copy .slide-inner :is(p, li, td, dd, dt, blockquote){
    font-size:var(--slide-text) !important;line-height:var(--slide-line) !important;
  }
  #measurement-development #approved-equation-copy .slide-inner :is(p, ul, ol){margin:0 0 9px !important}
  #measurement-development #approved-equation-copy .slide-inner :is(h3, h4){
    font-size:14px !important;line-height:1.35 !important;margin:16px 0 6px !important;
    background:none !important;color:var(--c1) !important;-webkit-text-fill-color:var(--c1) !important;
  }
  #measurement-development #approved-equation-copy .slide-inner th{font-size:11px !important}
  #measurement-development #approved-equation-copy .slide-inner tbody th{font-size:var(--slide-text) !important}
  #measurement-development #approved-equation-copy .slide-inner :is(th, td){padding:7px 12px 7px 0 !important}
  #measurement-development #approved-equation-copy .slide-inner :is(.math-table-wrap, .twrap){margin:8px 0 12px !important}
  #measurement-development #approved-equation-copy .slide-inner :is(.term-reference, .calculation-reference){
    margin:0 !important;padding:0 !important;background:none !important;border:0 !important;
  }

  #measurement-development #approved-equation-copy .lead-table :is(table, thead, tbody, tr, th, td){background:none !important;box-shadow:none !important}
  #measurement-development #approved-equation-copy .lead-table :is(th, td){
    text-align:left !important;vertical-align:top !important;padding:8px 16px 8px 0 !important;
    border:0 !important;border-bottom:1px solid rgba(255,255,255,.14) !important;
    font-size:var(--slide-text) !important;line-height:var(--slide-line) !important;
  }
  #measurement-development #approved-equation-copy .lead-table thead th{
    font-size:11px !important;font-weight:700 !important;color:var(--c1) !important;-webkit-text-fill-color:var(--c1) !important;
  }
  #measurement-development #approved-equation-copy .lead-table tbody th{font-weight:700 !important;color:var(--c2) !important;-webkit-text-fill-color:var(--c2) !important;width:32%;
    text-transform:none !important;letter-spacing:normal !important}
}

@media(max-width:760px){
  #root > .open-sec{grid-column:2 / 4 !important;grid-row:auto !important;width:100% !important;max-width:100%;
    margin:var(--space-between,56px) 0 0 !important;--indent:var(--mobile-number-gap,28px)}
  .open-sec .num{left:0}
  .slides{margin-left:0}
  .open-sec #formula-construction{margin:40px 0 14px}
  .open-sec #evidence-standard{margin-bottom:36px}
  .slide-inner{padding-left:0}
}

/* ---------------------------------------------------------------- earlier maps and equations, one level */
#iterations.arch-open > summary{list-style:none;cursor:default;pointer-events:none}
#iterations.arch-open > summary::-webkit-details-marker{display:none}
#iterations details.arch-row > summary{list-style:none;cursor:pointer;display:flex;align-items:baseline;gap:12px}
#iterations details.arch-row > summary::-webkit-details-marker{display:none}
#iterations details.arch-row > summary > .arch-arrow{flex:0 0 auto;width:var(--arrow,9px);height:var(--arrow,9px);fill:var(--c1);
  align-self:center;transition:transform .42s var(--slide-ease)}
#iterations details.arch-row > summary:hover > .arch-arrow{transform:translateX(2px)}
#iterations details.arch-row[open] > summary > .arch-arrow{transform:rotate(-90deg)}
#iterations details.arch-row{overflow:hidden}
#iterations details.arch-row > .slide-fold{margin:4px 0 18px}
#iterations :is(#xOpenAll, #xCloseAll){display:none !important}
/* the 399 operations under "Browse operations by X value": one dense line each */
#iterations #xList button.row{font-size:var(--slide-text) !important;line-height:1.35 !important;padding:3px 0 !important}
#iterations #xList button.row > *{font-size:inherit !important;line-height:inherit !important}

@layer annie-roles{
  /* the page's preview lines, triangles and close buttons give way to the one arrow */
  #inference-resolution-map #iterations :is(details.arch-row, details.arch-flat) > summary :is(.peek, .disclosure-icon),
  #inference-resolution-map #iterations :is(details.arch-row, details.arch-flat) > .peek-close,
  #inference-resolution-map #iterations.arch-open > summary :is(.peek, .disclosure-icon),
  #inference-resolution-map #iterations.arch-open > .peek-close{display:none !important}
  #inference-resolution-map #iterations.arch-open > summary{
    font-size:20px !important;font-weight:700 !important;line-height:1.25 !important;margin:0 0 6px !important;padding:0 !important;
    background:linear-gradient(90deg,var(--c1),var(--c2)) !important;-webkit-background-clip:text !important;background-clip:text !important;
    color:transparent !important;-webkit-text-fill-color:transparent !important;width:fit-content !important;
  }
  #inference-resolution-map #iterations details.arch-row > summary{padding-block:9px !important;margin:0 !important;min-height:0 !important}
  #inference-resolution-map #iterations details.arch-row[open] > summary{margin-bottom:6px !important}
  #inference-resolution-map #iterations > details.arch-row,
  #inference-resolution-map #iterations details.arch-row{margin-block:0 !important;padding:0 !important;border:0 !important;background:none !important}
  #inference-resolution-map #iterations details.arch-flat{margin:14px 0 0 !important;padding:0 !important;border:0 !important;background:none !important}

  /* dense text inside the rows */
  #inference-resolution-map #iterations details.arch-row :is(p, li, td, dd, dt, blockquote){
    font-size:var(--slide-text) !important;line-height:var(--slide-line) !important;
  }
  #inference-resolution-map #iterations details.arch-row :is(h3, h4, details.arch-flat > summary){
    font-size:14px !important;line-height:1.35 !important;font-weight:700 !important;
    background:none !important;color:var(--c1) !important;-webkit-text-fill-color:var(--c1) !important;
    pointer-events:none !important;padding:0 !important;margin:0 0 6px !important;
  }
  #inference-resolution-map #iterations details.arch-row th{font-size:11px !important}
  #inference-resolution-map #iterations details.arch-row tbody th{font-size:var(--slide-text) !important}
  /* equations in the archive: no box behind them either */
  #inference-resolution-map #iterations .equation-panel{
    background:none !important;border:0 !important;box-shadow:none !important;border-radius:0 !important;padding:0 !important;
    -webkit-backdrop-filter:none !important;backdrop-filter:none !important;margin:12px 0 !important;
  }
}

@media (prefers-reduced-motion: reduce){
  .slide-toggle .arrow,#iterations details.arch-row > summary > .arch-arrow{transition:none}
}