/* The market pages on the new design (G3 guide template): /energia/mercado/hoje/ and /energia/mercado/historico/ —
   only what they add to /design/novo.css and /energia/g3.css. The instruments keep hub.css and mercado.css (loaded
   before novo.css): the dark band's bars, the cycles, the segmented buttons. Here: the band as a full-width G3 .b4,
   and the tool card's window finder, range picker and readouts redrawn for paper. Rendered by src/energia/mercado/g3.ts. */
.g3b .eh-mer { margin: 0; border-radius: 0; padding: clamp(64px, 7vw, 104px) 0; }
.g3b .eh-mer .g3s__h .tk { color: var(--peach); }
.g3graf { min-width: 0; display: grid; gap: 4px; }
.g3graf .eh-inst__area { margin-top: 16px; }
.g3distr { margin-top: 32px; }
.gmer .g3r__n small { display: inline-block; }

/* the tool card on paper */
.mtool { gap: 14px; }
.mtool > div[data-omie-fresco] { display: grid; gap: 14px; }
.mtool .eh-seg { display: flex; flex-wrap: wrap; gap: 4px; padding: 4px; border: 0; border-radius: 22px; background: var(--tint-10); }
.mtool .eh-seg button { flex: 1 1 auto; min-height: 44px; padding: 0 16px; border-radius: var(--r-pill); color: var(--ink-60); font: 500 15px var(--font-ui); }
.mtool .eh-seg button[aria-pressed="true"] { background: var(--ink-deep); color: #fff; font-weight: 600; }
.mtool .eh-seg button:focus-visible { outline: 2px solid var(--peach-ink); outline-offset: 2px; }
.mtool .ep-janela { display: grid; gap: 12px; padding: 18px 20px; border-radius: 18px; background: var(--peach-pale); }
.mtool .ep-janela p { margin: 0; font-size: 15px; color: var(--ink-60); }
.mtool .ep-janela b { display: block; margin-top: 4px; font: 700 22px/1.2 var(--disp); color: var(--ink-deep); }
.mtool .eh-leit { margin: 0; display: grid; }
.mtool .eh-leit > div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 12px 0; border-top: 1px solid var(--tint-10); }
.mtool .eh-leit dt { font: 500 12px/1.3 var(--font-doc); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-50); }
.mtool .eh-leit dd { margin: 0; font: 600 15px var(--font-doc); color: var(--ink-deep); text-align: right; }
.mtool .eh-leit dd small { margin-left: 2px; color: var(--ink-50); }
.mtool .eh-inst__aviso { margin: 0; font: 500 12.5px/1.4 var(--font-doc); color: var(--ink-50); }
.mtool .eh-led__fonte { padding: 10px 0 0; border-top: 1px solid var(--tint-10); font-size: 12.5px; line-height: 1.5; color: var(--ink-50); }
.mtool > .hint { font-size: 15px; line-height: 1.5; }
@media (max-width: 640px) { .mtool .eh-seg button { padding: 0 10px; font-size: 14px; } }

/* /energia/horarios/: the three rings on the dark band, their legend and the «agora» line */
.ghor .ep-aneis { margin-top: 8px; }
.ghor .ep-agora { justify-self: start; margin: 0; }
.ghor .ep-leg { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 24px; margin: 8px 0 0; padding: 0; list-style: none; font-size: 15px; color: var(--on-dark-75); }
.ghor .ep-leg li { display: inline-flex; align-items: center; gap: 8px; }
.ghor .ep-leg i { width: 12px; height: 12px; border-radius: var(--r-pill); }
.ghor .g1h .g3r__n small { font-size: 26px; color: var(--ink-50); margin: 0 4px; }

/* QA 2026-10-29 · E7: stale OMIE → one notice (the hero), the empty tool card hides, the meta dot turns grey; the
   history page renders its stored series (data-omie-hist, never hidden) */
html:not([data-omie="fresco"]) .gmer[data-page="mercado-hoje"] .mtool { display: none; }
html:not([data-omie="fresco"]) .gmer[data-page="mercado-hoje"] .g2hi { grid-template-columns: minmax(0, 1fr); }
.gmeta[data-omie-velho] .dot { background: var(--ink-50); box-shadow: 0 0 0 4px var(--tint-10); }
.mtool > div[data-omie-hist] { display: grid; gap: 14px; }
/* QA E11: the «em breve» alert item as on the other G3 pages (hub.css draws .eh-opt as a pill; not here) */
.gmer .g3opts .eh-opt { display: flex; align-items: center; min-height: 0; padding: 0; border: 0; border-radius: 0; background: none; color: inherit; cursor: default; }