@font-face{font-family:OverpassRoboto;src:url(roboto-latin.woff2) format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:OverpassInter;src:url(inter-latin.woff2) format('woff2');font-weight:100 900;font-display:swap}
overpass-broker-demo{display:flex;flex-direction:column;container-type:inline-size;min-width:0;color:#3a403e;font:400 .875rem/1.45 OverpassRoboto,Arial,sans-serif;font-variant-numeric:tabular-nums;text-align:left}
overpass-broker-demo *{box-sizing:border-box}
overpass-broker-demo .op-stage{position:relative;min-width:0}
overpass-broker-demo .op-card{position:relative;width:100%;background:#fff;border:1px solid #cfcfcf;border-radius:9px;box-shadow:0 14px 32px rgba(34,40,37,.12);overflow:hidden}
overpass-broker-demo.is-enhanced .op-card{position:absolute;left:0;top:0}
/* Compact cards grow in normal flow instead of reserving three empty records. */
overpass-broker-demo.is-enhanced[data-layout="stacked"] .op-card{position:relative}
overpass-broker-demo .op-content{width:100%;padding:0 18px}
overpass-broker-demo .op-row{display:grid;grid-template-columns:minmax(190px,1.75fr) minmax(74px,.67fr) minmax(158px,1.45fr) minmax(126px,1.13fr) minmax(70px,.65fr) minmax(118px,1.06fr);gap:14px;align-items:center;min-height:140px;padding:18px 0;position:relative}
overpass-broker-demo .op-rule{position:absolute;bottom:0;left:0;right:0;height:1px;background:#dedddd}
overpass-broker-demo .op-field{min-width:0}
overpass-broker-demo h3{font:700 1rem/1.3 OverpassRoboto,Arial,sans-serif;margin:0;color:#3a403e}
overpass-broker-demo .op-identity h3{margin:0 0 6px}
overpass-broker-demo .op-line{position:relative;display:block;width:fit-content;max-width:100%;perspective:700px}
overpass-broker-demo .op-copy{display:block;overflow-wrap:break-word}
overpass-broker-demo .op-name{font-weight:700}
overpass-broker-demo .op-meta,overpass-broker-demo .op-label{color:#666967}
overpass-broker-demo .op-line.op-dtp{font:800 2rem/1.15 OverpassInter,Arial,sans-serif;letter-spacing:-.02em;margin-bottom:3px}
overpass-broker-demo .op-count{font-size:1.25rem;line-height:1.3;font-weight:500;margin-bottom:3px}
overpass-broker-demo .op-faster{color:#155815}
overpass-broker-demo .op-slower{color:#b45309}
overpass-broker-demo .op-bar{height:5px;width:86px;max-width:100%;background:#dedddd;border-radius:4px;overflow:hidden;margin-top:9px}
overpass-broker-demo .op-bar-fill{display:block;width:100%;height:100%;border-radius:4px;transform-origin:left center;background:#228b22;transform:scaleX(var(--fraction))}
overpass-broker-demo .op-average .op-bar-fill{background:#737373}
overpass-broker-demo .op-slow .op-bar-fill{background:#c45b09}
overpass-broker-demo .op-attribution{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:7px;padding:14px 0 17px;color:#666967;font-size:.8125rem}
overpass-broker-demo .op-attribution img{width:74px;height:auto;display:block}
overpass-broker-demo .op-controls{display:flex;justify-content:flex-end;gap:10px;margin-top:12px;min-height:36px}
overpass-broker-demo .op-control{font:inherit;font-size:.875rem;color:#3a403e;cursor:pointer;border:1px solid #cfcfcf;border-radius:5px;background:#fff;min-height:36px;padding:6px 12px}
overpass-broker-demo .op-control:hover{background:#fff}
overpass-broker-demo .op-control:focus-visible{outline:2px solid #3a403e;outline-offset:3px}
overpass-broker-demo .op-control[hidden]{display:none}
overpass-broker-demo .op-controls:has(.op-control[hidden]){display:none}
overpass-broker-demo .op-motion{position:absolute;inset:0;pointer-events:none;visibility:hidden}
overpass-broker-demo .op-half{position:absolute;left:0;width:100%;height:50%;overflow:hidden;background:#fff;opacity:0}
overpass-broker-demo .op-top,overpass-broker-demo .op-leaf-a{top:0}
overpass-broker-demo .op-bottom,overpass-broker-demo .op-leaf-b{top:50%}
overpass-broker-demo .op-glyph{position:absolute;left:0;width:100%;height:200%;display:block;overflow-wrap:break-word}
overpass-broker-demo .op-top .op-glyph,overpass-broker-demo .op-leaf-a .op-glyph{top:0}
overpass-broker-demo .op-bottom .op-glyph,overpass-broker-demo .op-leaf-b .op-glyph{top:-100%}
overpass-broker-demo .op-leaf-a{transform-origin:50% 100%;z-index:2;backface-visibility:hidden}
overpass-broker-demo .op-leaf-b{transform-origin:50% 0%;z-index:2;backface-visibility:hidden}
overpass-broker-demo .op-number{position:absolute;inset:0;opacity:0}
@container (max-width:54rem){
  overpass-broker-demo .op-controls{order:-1;margin:0 0 12px}
  overpass-broker-demo .op-content{padding:0 20px}
  overpass-broker-demo .op-row{grid-template-columns:1fr 1fr;gap:12px 24px;padding:18px 0;min-height:0;align-items:start}
  overpass-broker-demo .op-identity{grid-column:1/-1}
  overpass-broker-demo .op-percentile{grid-column:1/-1;display:flex;align-items:center;flex-wrap:wrap;gap:4px}
  overpass-broker-demo .op-percentile .op-bar{width:72px;margin:0}
  overpass-broker-demo .op-field{font-size:.9375rem}
  overpass-broker-demo h3{font-size:1.125rem}
  overpass-broker-demo .op-attribution{justify-content:flex-start}
}
@container (max-width:22rem){
  overpass-broker-demo .op-content{padding:0 16px}
  overpass-broker-demo .op-row{gap:12px 16px}
  overpass-broker-demo .op-field{font-size:.875rem}
}
@media(prefers-reduced-motion:reduce){overpass-broker-demo .op-controls{display:none}}