.unit-value-control { display: inline-flex; align-items: center; justify-content: flex-end; gap: .25em; flex-wrap: wrap; min-width: 0; }
#atom-list > .linhaPropriedades { padding: 0; margin: 0; }
.selectUnidadePropriedade,
.linhaPropriedades .selectUnidadePropriedade,
.mudarTemperatura .selectUnidadePropriedade {
  display: inline-block; width: auto; max-width: 10.5em; min-height: 24px;
  padding: 2px 3px; margin: 0; border: 0; border-radius: 0;
  background-color: transparent; color: #555; font: inherit; font-size: max(.8em, 10px);
  cursor: pointer; vertical-align: middle; opacity: 1;
}
.selectUnidadePropriedade:focus { outline: none; box-shadow: none; }
.linhaPropriedades .unit-value-control > span { margin: 0; overflow-wrap: anywhere; }
.mudarTemperatura .divTemperatura > div { display: flex; align-items: center; gap: .2em; }
.mudarTemperatura .inputTemperatura { min-width: 4em; }
.botaoEstadoFisico > .selectUnidadePropriedade { flex-shrink: 0; }
#atom-list > .linhaPropriedades.property-has-units > label {
  flex: 1 1 38%; min-width: 0; white-space: normal; overflow-wrap: anywhere; padding-right: .35em;
}
#atom-list > .linhaPropriedades.property-has-units > .unit-value-control,
#atom-list > .linhaPropriedades.property-has-units > .subtituloPropriedades {
  flex: 0 1 54%; min-width: 0;
}
#atom-list .linhaPropriedades .unit-value-control > span {
  flex: 0 1 auto; max-width: 100%;
}
#atom-list > .botaoEstadoFisico {
  display: grid; grid-template-columns: 16px minmax(0, 1fr) auto; gap: .2em;
}
#atom-list > .botaoEstadoFisico > label { min-width: 0; white-space: normal; }
#atom-list > .botaoEstadoFisico > .propriedadeEstadoFisico {
  grid-column: 2 / -1; white-space: normal; word-break: normal; text-align: right;
}
.temperature-state-control { display: inline-flex; align-items: center; gap: .2em; }
.temperature-state-control .inputTemperaturaFusao { width: 4.5em; max-width: 4.5em; min-width: 0; }

/* Click-to-expand property groups: arrow, existing icon, title, then value. */
#atom-list > .linhaPropriedades.tem-subpropriedades {
  display: grid;
  grid-template-columns: 14px 16px minmax(0, 1fr) max-content;
  align-items: center;
  column-gap: .2em;
}
#atom-list > .linhaPropriedades.tem-subpropriedades > .subpropriedadesSeta {
  grid-column: 1; grid-row: 1;
  display: grid; place-items: center;
  width: 14px; height: 20px; padding: 0; margin: 0;
  border: 0; background: transparent; color: inherit; cursor: pointer;
}
#atom-list > .linhaPropriedades.tem-subpropriedades > .subpropriedadesSeta svg { transition: transform .15s ease; }
#atom-list > .linhaPropriedades.subpropriedades-abertas > .subpropriedadesSeta svg { transform: rotate(90deg); }
#atom-list > .linhaPropriedades.tem-subpropriedades > svg { grid-column: 2; grid-row: 1; }
#atom-list > .linhaPropriedades.tem-subpropriedades > .controleTipoMassa,
#atom-list > .linhaPropriedades.tem-subpropriedades > .controleTipoRaio,
#atom-list > .linhaPropriedades.tem-subpropriedades > .controleTipoConfiguracao { grid-column: 3; grid-row: 1; min-width: 0; cursor: pointer; }
#atom-list > .linhaPropriedades.tem-subpropriedades > .unit-value-control,
#atom-list > .linhaPropriedades.tem-subpropriedades > .propriedadeDistribuicaoEletronica { grid-column: 4; grid-row: 1; min-width: 0; }
#atom-list > .linhaPropriedades.tem-subpropriedades > .subpropriedadesMenu {
  grid-column: 1 / -1; grid-row: 2;
  width: 100%; min-width: 0; padding: 2px 0 2px 14px;
  box-sizing: border-box; border-top: 1px solid rgba(90,105,120,.18);
  background: transparent; color: inherit;
}
#atom-list .subpropriedadesOpcao {
  display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center;
  gap: 8px; width: 100%; min-height: 28px; padding: 3px 6px;
  border: 0; border-radius: 3px; background: transparent; color: inherit;
  font: inherit; text-align: left; white-space: normal; cursor: pointer;
}
#atom-list .subpropriedadesOpcao:hover,
#atom-list .subpropriedadesOpcao:focus-visible { background: rgba(90,105,120,.13); }
#atom-list .subpropriedadesOpcao[aria-checked="true"] { background: #e3e3e3; }
#atom-list .subpropriedadesOpcao .valorOpcaoTipo { min-width: 0; text-align: right; overflow-wrap: anywhere; }

/* The radius type is present in HTML, alongside the existing unit selector. */
#atom-list .botaoRaioAtomico .selectTipoRaio {
  display: block; width: 100%; min-width: 0; max-width: 100%; min-height: 28px;
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath d='m2 3 3 3 3-3' fill='none' stroke='%23555' stroke-width='1.4'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right center;
  box-sizing: border-box; padding: 2px 12px 2px 0; border: 0; border-radius: 0;
  background-color: transparent; color: #555; font: inherit; cursor: pointer;
}

#atom-list > .linhaPropriedades.botaoRaioAtomico.property-has-units {
  display: grid; grid-template-columns: 16px minmax(0, 1fr) max-content; align-items: center; gap: .2em;
}
#atom-list > .botaoRaioAtomico.property-has-units > label { padding-right: 0; }
#atom-list > .botaoRaioAtomico.property-has-units > .unit-value-control {
  grid-column: 3; grid-row: 1; flex-wrap: nowrap; white-space: nowrap;
}
#atom-list > .botaoRaioAtomico .unit-value-control > span { overflow-wrap: normal; }

/* Native closed selects cannot wrap text. Keep the native control over a wrapping label. */
#atom-list > .botaoRaioAtomico.property-has-units > .controleTipoRaio {
  position: relative; min-width: 0; padding: 2px 0; box-sizing: border-box;
}
#atom-list .botaoRaioAtomico .textoTipoRaio {
  display: block; margin: 0; padding: 0; font: inherit; color: inherit;
  text-align: left; white-space: normal; overflow-wrap: anywhere; pointer-events: none;
}
#atom-list .botaoRaioAtomico .selectTipoRaio {
  position: absolute; top: 0; bottom: 0; left: -4px; right: auto;
  width: calc(100% + 4px); height: 100%; min-height: 0;
  margin: 0; padding: 0; opacity: 0; font: inherit; outline: none; box-shadow: none;
}
.controleTipoRaio:has(.selectTipoRaio:focus-visible) { outline: 2px solid #2878c8; outline-offset: 2px; }
#atom-list .botaoRaioAtomico .selectTipoRaio:focus { outline: none; box-shadow: none; }

/* Hovering the label expands the already-present native list, without a tooltip. */
#atom-list .botaoRaioAtomico .controleTipoRaio.tipo-raio-aberto .selectTipoRaio {
  top: 100%; bottom: auto; left: 0; width: max-content; min-width: 100%; height: auto;
  padding: 0; opacity: 1; z-index: 20; background: #fff; border: 0; border-radius: 0;
  color: #555; text-align: left;
}

/* Mass label uses the same wrapping layout as the radius label. */
#atom-list > .linhaPropriedades.botaoMassaAtomica.property-has-units {
  display: grid; grid-template-columns: 16px minmax(0, 1fr) max-content; align-items: center; gap: .2em;
}
#atom-list > .botaoMassaAtomica.property-has-units > label { padding-right: 0; }
#atom-list > .botaoMassaAtomica.property-has-units > .unit-value-control {
  grid-column: 3; grid-row: 1; flex-wrap: nowrap; white-space: nowrap;
}
#atom-list > .botaoMassaAtomica .unit-value-control > span { overflow-wrap: normal; }

/* Native closed selects cannot wrap text. Keep the native control over a wrapping label. */
#atom-list > .botaoMassaAtomica.property-has-units > .controleTipoMassa {
  position: relative; min-width: 0; padding: 2px 0; box-sizing: border-box;
}
#atom-list .botaoMassaAtomica .textoTipoMassa {
  display: block; margin: 0; padding: 0; font: inherit; color: inherit;
  text-align: left; white-space: normal; overflow-wrap: anywhere; pointer-events: none;
}
#atom-list .botaoMassaAtomica .selectTipoMassa {
  position: absolute; top: 0; bottom: 0; left: -4px; right: auto;
  width: calc(100% + 4px); height: 100%; min-height: 0;
  margin: 0; padding: 0; opacity: 0; font: inherit; outline: none; box-shadow: none;
}

#atom-list .botaoMassaAtomica .selectTipoMassa { display:none; }
#atom-list .botaoMassaAtomica .isotopoMassaAtual { font-size:.8em; white-space:nowrap; }
#atom-list .botaoMassaAtomica .isotopoMassaAtual[hidden] { display:none; }

#atom-list .botaoMassaAtomica[data-mass-type="isotopica"] .controleTipoMassa,
#atom-list .botaoMassaAtomica[data-mass-type="simplificada"] .controleTipoMassa { grid-column:2 / -1; grid-row:1; }
#atom-list .botaoMassaAtomica[data-mass-type="isotopica"] .unit-value-control,
#atom-list .botaoMassaAtomica[data-mass-type="simplificada"] .unit-value-control { grid-column:2 / -1; grid-row:2; justify-self:end; }
#atom-list .botaoMassaAtomica .unit-value-control { gap:.4em; }

/* Electronic configuration can use the complete notation or noble-gas core notation. */
#atom-list > .botaoConfiguracaoEletronica {
  display:flex; align-items:center; gap:.2em;
}
#atom-list > .botaoConfiguracaoEletronica > .controleTipoConfiguracao {
  position:relative; flex:0 0 35%; min-width:0; padding:2px 0; box-sizing:border-box;
}
#atom-list .botaoConfiguracaoEletronica .textoTipoConfiguracao {
  display:block; margin:0; padding:0; font:inherit; color:inherit; text-align:left;
  white-space:normal; overflow-wrap:normal; word-break:normal; hyphens:none; pointer-events:none;
}
#atom-list .botaoConfiguracaoEletronica .selectTipoConfiguracao {
  position:absolute; top:0; bottom:0; left:-4px; width:calc(100% + 4px); height:100%; min-height:0;
  margin:0; padding:0; opacity:0; font:inherit; outline:none; box-shadow:none; border:0;
}
#atom-list .botaoConfiguracaoEletronica .propriedadeDistribuicaoEletronica {
  flex:1 1 auto; min-width:0; margin-left:auto; text-align:right; white-space:normal; overflow-wrap:anywhere;
}
#atom-list > .linhaPropriedades > svg { flex-shrink:0; }
#atom-list > .linhaPropriedades > label,
#atom-list > .linhaPropriedades > span,
#atom-list > .linhaPropriedades > .unit-value-control,
#atom-list > .linhaPropriedades > .subtituloPropriedades,
#atom-list > .linhaPropriedades .unit-value-control > span {
  word-break:normal; overflow-wrap:normal; hyphens:none;
}
#atom-list .botaoConfiguracaoEletronica .propriedadeDistribuicaoEletronica {
  overflow-wrap:normal;
}
#atom-list .orbitalConfiguracao { display:inline-block; white-space:nowrap; }
.caixaMostrador > data { max-width:100%; overflow-wrap:anywhere; white-space:normal; }
.numeroMassaProtons { color:#c02020; }
.numeroMassaNeutrons { color:#555; }
.numeroMassaTotal { color:#111; font-weight:700; }

/* Horizontal property panel: each control keeps its own compact row. */
.painel-propriedades-horizontal #atom-list > .botaoEstadoFisico {
  grid-template-columns: 14px minmax(0, 1fr) max-content;
  column-gap: 4px;
  row-gap: 0;
  align-items: center;
}
.painel-propriedades-horizontal #atom-list > .botaoEstadoFisico > label {
  grid-column: 2;
  grid-row: 1;
}
.painel-propriedades-horizontal #atom-list > .botaoEstadoFisico > .temperature-state-control {
  grid-column: 3;
  grid-row: 1;
  width: max-content;
  min-width: 0;
  justify-self: end;
  white-space: nowrap;
}
.painel-propriedades-horizontal #atom-list > .botaoEstadoFisico .inputTemperaturaFusao {
  width: 3.5em;
  max-width: 3.5em;
}
.painel-propriedades-horizontal #atom-list > .botaoEstadoFisico > .propriedadeEstadoFisico {
  grid-column: 2 / -1;
  grid-row: 2;
  width: 100%;
}
.painel-propriedades-horizontal #atom-list > :is(.botaoPontoFusao, .botaoPontoEbulicao) .subtituloPropriedades {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: flex-end;
  gap: 0 5px;
  line-height: inherit;
}
.painel-propriedades-horizontal #atom-list > :is(.botaoPontoFusao, .botaoPontoEbulicao) .phase-pressure-control {
  display: inline;
  width: auto;
}
.principal .elemento > data:has(.numeroMassaTotal),
.propriedadeMassaAtomica:has(.numeroMassaTotal),
.massaAtomicaInterno:has(.numeroMassaTotal) {
  white-space:nowrap;
}

/* Keep the expandable row layout above the older type-specific layouts. */
#atom-list > .linhaPropriedades.tem-subpropriedades.botaoMassaAtomica.property-has-units,
#atom-list > .linhaPropriedades.tem-subpropriedades.botaoRaioAtomico.property-has-units,
#atom-list > .linhaPropriedades.tem-subpropriedades.botaoConfiguracaoEletronica {
  display: grid;
  grid-template-columns: 14px 16px minmax(0,1fr);
  grid-template-rows: min-content min-content auto;
  align-items: start;
  column-gap: 8px;
  row-gap: 2px;
}
#atom-list > .linhaPropriedades.tem-subpropriedades.botaoMassaAtomica > .controleTipoMassa,
#atom-list > .linhaPropriedades.tem-subpropriedades.botaoRaioAtomico > .controleTipoRaio,
#atom-list > .linhaPropriedades.tem-subpropriedades.botaoConfiguracaoEletronica > .controleTipoConfiguracao {
  grid-column: 3; grid-row: 1; width: auto; flex: none;
}
#atom-list > .linhaPropriedades.tem-subpropriedades.botaoMassaAtomica > .unit-value-control,
#atom-list > .linhaPropriedades.tem-subpropriedades.botaoRaioAtomico > .unit-value-control,
#atom-list > .linhaPropriedades.tem-subpropriedades.botaoConfiguracaoEletronica > .propriedadeDistribuicaoEletronica {
  grid-column: 3; grid-row: 2; justify-self: end;
  width: auto; max-width: 100%; min-width: 0;
}
#atom-list > .linhaPropriedades.tem-subpropriedades > .subpropriedadesMenu {
  grid-column: 1 / -1; grid-row: 3;
  padding: 3px 0 2px 0;
}
#atom-list > .linhaPropriedades.tem-subpropriedades > .subpropriedadesMenu .subpropriedadesOpcao {
  grid-template-columns: max-content max-content;
  justify-content: space-between;
  box-sizing: border-box;
  overflow-x: auto;
  min-height: 30px;
  padding: 4px 6px 4px 22px;
  user-select: text;
  -webkit-user-select: text;
}
#atom-list > .linhaPropriedades.tem-subpropriedades > .subpropriedadesMenu .rotuloOpcaoTipo,
#atom-list > .linhaPropriedades.tem-subpropriedades > .subpropriedadesMenu .valorOpcaoTipo {
  display: block;
  min-width: 0;
  user-select: text;
  -webkit-user-select: text;
  overflow-wrap: normal;
  word-break: normal;
  white-space: nowrap;
}
#atom-list > .linhaPropriedades.tem-subpropriedades > .subpropriedadesMenu .rotuloOpcaoTipo {
  grid-column: 1;
  text-align: left;
}
#atom-list > .linhaPropriedades.tem-subpropriedades > .subpropriedadesMenu .valorOpcaoTipo {
  grid-column: 2;
  text-align: right;
}
.painel-propriedades-horizontal #atom-list > li.tem-subpropriedades.propriedade-ativa {
  background-color: #e3e3e3 !important;
  box-shadow: none;
}
.painel-propriedades-horizontal #atom-list > li.tem-subpropriedades.subpropriedades-abertas {
  background-color: #fff !important;
  box-shadow: none;
}
html[data-theme="dark"].painel-propriedades-horizontal #atom-list > .linhaPropriedades.tem-subpropriedades.propriedade-ativa {
  background-color: #343a42 !important;
  box-shadow: none;
}
html[data-theme="dark"].painel-propriedades-horizontal #atom-list > .linhaPropriedades.tem-subpropriedades.subpropriedades-abertas {
  background-color: #252b32 !important;
  box-shadow: none;
}
html[data-theme="dark"] #atom-list .subpropriedadesOpcao[aria-checked="true"] {
  background-color: #343a42 !important;
}

/* Prefere uma linha, mas quebra o conteúdo quando o painel fica estreito. */
#atom-list > li.linhaPropriedades {
  display: flex !important;
  flex-flow: row wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0 .25em;
  min-width: 0;
}
#atom-list > li.linhaPropriedades > :is(.subpropriedadesSeta, svg) {
  flex: 0 0 auto;
}
#atom-list > li.linhaPropriedades > label {
  flex: 1 1 0 !important;
  min-width: 0;
  width: auto !important;
  padding-right: 0;
  white-space: normal !important;
  overflow-wrap: anywhere;
}
#atom-list > li.linhaPropriedades > label > span {
  white-space: normal;
  overflow-wrap: anywhere;
}
#atom-list > li.linhaPropriedades > :is(.unit-value-control, .propriedadeDistribuicaoEletronica, .propriedadeNumerosQuanticos, .distribuicaoEletronicaLateral, .subtituloPropriedades, .temperature-state-control, .propriedadeEstadoFisico) {
  flex: 0 1 auto !important;
  width: auto !important;
  max-width: 100%;
  min-width: 0;
  margin-left: auto;
  white-space: normal !important;
  overflow-wrap: anywhere;
}
#atom-list > li.linhaPropriedades .unit-value-control {
  flex-wrap: wrap;
  white-space: normal;
}
#atom-list > li.linhaPropriedades > .subpropriedadesMenu {
  flex: 0 0 100%;
  width: 100%;
  margin-left: 0;
}
#atom-list > li.linhaPropriedades.botaoEstadoFisico > .propriedadeEstadoFisico {
  flex: 0 0 auto !important;
  width: auto !important;
  margin-left: .25em;
  text-align: right;
}
#atom-list > li.linhaPropriedades.botaoEstadoFisico > .temperature-state-control {
  margin-left: auto;
}
#atom-list > li.linhaPropriedades :is(.subtituloPropriedades, .phase-pressure-control) {
  flex-wrap: wrap;
  white-space: normal;
}
#atom-list > li.linhaPropriedades > .subtituloPropriedades {
  display: inline-flex;
  flex-direction: row !important;
  align-items: center !important;
  gap: .25em;
}
#atom-list > li.linhaPropriedades .phase-pressure-control {
  display: inline-flex;
  width: auto;
  align-items: center;
}
#atom-list > li:is(.botaoPontoFusao, .botaoPontoEbulicao) > .subtituloPropriedades {
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}
#atom-list > li:is(.botaoPontoFusao, .botaoPontoEbulicao) > .subtituloPropriedades > .phase-pressure-control {
  display: block;
  width: 100%;
  text-align: center;
}
#atom-list > li.linhaPropriedades > span:not(.temperature-state-control),
#atom-list > li.linhaPropriedades > ul {
  max-width: 100%;
  overflow-wrap: anywhere;
  white-space: normal;
}
#atom-list > li.linhaPropriedades .subpropriedadesOpcao {
  grid-template-columns: minmax(0, 1fr) auto !important;
  overflow-x: hidden !important;
}
#atom-list > li.linhaPropriedades .subpropriedadesOpcao :is(.rotuloOpcaoTipo, .valorOpcaoTipo) {
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
.painel-propriedades-horizontal #atom-list > li.linhaPropriedades > :is(.unit-value-control, .propriedadeDistribuicaoEletronica, .propriedadeNumerosQuanticos, .distribuicaoEletronicaLateral, .subtituloPropriedades, .temperature-state-control) {
  justify-content: flex-end;
  padding-top: 0;
  margin-top: 0;
}

/* Reserva espaço previsível para título e valor nas barras laterais. */
.caixaDaTabela:is(.painel-esquerda, .painel-direita) #atom-list > li.linhaPropriedades > label {
  flex: 0 1 40% !important;
  min-width: 0;
  width: 40% !important;
  margin-right: 0;
  overflow-wrap: normal;
  word-break: normal;
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita) #atom-list > li.linhaPropriedades > label > span {
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita) #atom-list > li.linhaPropriedades > :is(.unit-value-control, .propriedadeDistribuicaoEletronica, .propriedadeNumerosQuanticos, .distribuicaoEletronicaLateral, .subtituloPropriedades, .temperature-state-control, .propriedadeEstadoFisico) {
  flex: 1 1 calc(50% - 18px) !important;
  min-width: 0;
  max-width: 100%;
  text-align: right;
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita) #atom-list > li.linhaPropriedades > .unit-value-control {
  flex-wrap: wrap;
  justify-content: flex-end;
  overflow: hidden;
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita) #atom-list > li.linhaPropriedades > .unit-value-control > span {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere !important;
  word-break: normal;
}

/* A seta fica depois das propriedades reveladas, inclusive no painel horizontal. */
#atom-list > li.tem-subpropriedades > .subpropriedadesMenu { order: 4; }
#atom-list > li.tem-subpropriedades > .subpropriedadesSeta {
  order: 5;
  flex: 0 0 100%;
  width: 100%;
  height: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* A seta de subpropriedades ocupa uma linha discreta abaixo do dado. */
.caixaDaTabela:is(.painel-esquerda, .painel-direita) #atom-list > li.tem-subpropriedades > svg { order: 1; }
.caixaDaTabela:is(.painel-esquerda, .painel-direita) #atom-list > li.tem-subpropriedades > label { order: 2; }
.caixaDaTabela:is(.painel-esquerda, .painel-direita) #atom-list > li.tem-subpropriedades > :is(.unit-value-control, .propriedadeDistribuicaoEletronica) { order: 3; }
.caixaDaTabela:is(.painel-esquerda, .painel-direita) #atom-list > li.tem-subpropriedades > .subpropriedadesSeta {
  order: 5;
  flex: 0 0 100%;
  width: 100%;
  height: 12px;
  margin: 1px 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita) #atom-list > li.tem-subpropriedades > .subpropriedadesSeta svg {
  width: 14px;
  height: 14px;
  margin: 0;
  transform: rotate(90deg);
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita) #atom-list > li.tem-subpropriedades.subpropriedades-abertas > .subpropriedadesSeta svg {
  transform: rotate(-90deg);
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita) #atom-list > li.tem-subpropriedades > .subpropriedadesMenu { order: 4; }

/* As propriedades reveladas conservam a aparência e a interação das linhas comuns. */
#atom-list > li.linhaPropriedades > .subpropriedadesMenu {
  box-sizing: border-box;
  flex: 0 0 calc(100% + 12px);
  width: calc(100% + 12px);
  margin: 0 -6px;
  padding: 0 !important;
  border-top: 1px solid #fbfbfb !important;
  background: #fff !important;
  overflow: hidden;
  border-radius: 0;
}
#atom-list > li.linhaPropriedades > .subpropriedadesMenu > .subpropriedadesOpcao {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 0 .25em;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 7px 10px;
  border-radius: 0;
  border-top: 0;
  background: #fff !important;
  box-shadow: none;
  overflow: hidden;
}
#atom-list > li.linhaPropriedades > .subpropriedadesMenu > .subpropriedadesOpcao[hidden] { display: none !important; }
@keyframes revelarPropriedadeOculta {
  from { opacity: 0; transform: translateY(-5px); }
  to { opacity: 1; transform: translateY(0); }
}
#atom-list > li.linhaPropriedades.subpropriedades-abertas > .subpropriedadesMenu > .subpropriedadesOpcao:not([hidden]) {
  animation: revelarPropriedadeOculta 180ms ease-out both;
}
@media (prefers-reduced-motion: reduce) {
  #atom-list > li.linhaPropriedades.subpropriedades-abertas > .subpropriedadesMenu > .subpropriedadesOpcao:not([hidden]) {
    animation: none;
  }
}
#atom-list > li.linhaPropriedades > .subpropriedadesMenu > .subpropriedadesOpcao:not([hidden]) ~ .subpropriedadesOpcao:not([hidden]) { border-top: 1px solid #fbfbfb; }
#atom-list > li.linhaPropriedades > .subpropriedadesMenu > .subpropriedadesOpcao:hover,
#atom-list > li.linhaPropriedades > .subpropriedadesMenu > .subpropriedadesOpcao:focus-visible {
  background: #f1f2f3 !important;
}
#atom-list > li.linhaPropriedades > .subpropriedadesMenu > .subpropriedadesOpcao[aria-current="true"] {
  background: #f7f7f7 !important;
  box-shadow: none;
}
#atom-list > li.linhaPropriedades > .subpropriedadesMenu > .subpropriedadesOpcao > .rotuloOpcaoTipo {
  flex: 0 1 40%;
  width: 40%;
  min-width: 0;
  white-space: normal;
  overflow-wrap: normal;
}
#atom-list > li.linhaPropriedades > .subpropriedadesMenu > .subpropriedadesOpcao > .valorOpcaoTipo {
  flex: 1 1 50%;
  min-width: 0;
  margin-left: auto;
  text-align: right;
  white-space: normal;
  overflow-wrap: anywhere;
}
html[data-theme="dark"] #atom-list > li.linhaPropriedades > .subpropriedadesMenu > .subpropriedadesOpcao { background: #252b32 !important; border-top-color: #39414a; }
html[data-theme="dark"] #atom-list > li.linhaPropriedades > .subpropriedadesMenu { background: #252b32 !important; }
html[data-theme="dark"] #atom-list > li.linhaPropriedades > .subpropriedadesMenu > .subpropriedadesOpcao:hover { background: #343a42 !important; }
html[data-theme="dark"] #atom-list > li.linhaPropriedades > .subpropriedadesMenu > .subpropriedadesOpcao[aria-current="true"] { background: #3d444c !important; }

/* Cartões compactos e alinhados quando o painel fica acima/abaixo da tabela. */
.painel-propriedades-horizontal .caixaDaTabela #atom-list > li.linhaPropriedades {
  box-sizing: border-box;
  width: 100%;
  margin: 3px 0 !important;
  padding: 5px 7px !important;
  gap: 2px 5px;
  border: 0 !important;
  border-radius: 7px;
  background: #fff !important;
  box-shadow: 0 0 3px rgba(25, 35, 45, .08);
  align-content: flex-start;
}
.painel-propriedades-horizontal .caixaDaTabela #atom-list > li.linhaPropriedades > svg {
  order: 1;
  flex: 0 0 14px;
  width: 14px;
  height: 14px;
}
.painel-propriedades-horizontal .caixaDaTabela #atom-list > li.linhaPropriedades > label {
  order: 2;
  flex: 1 1 42% !important;
  width: auto !important;
  min-width: 90px;
  overflow-wrap: normal;
  word-break: normal;
}
.painel-propriedades-horizontal .caixaDaTabela #atom-list > li.linhaPropriedades > :not(svg):not(label):not(.subpropriedadesSeta):not(.subpropriedadesMenu) {
  order: 3;
  flex: 0 1 auto !important;
  width: auto !important;
  min-width: 0;
  max-width: 100%;
  margin-left: auto;
  text-align: right;
}
.painel-propriedades-horizontal .caixaDaTabela #atom-list > li.tem-subpropriedades > .subpropriedadesMenu { order: 4; }
.painel-propriedades-horizontal .caixaDaTabela #atom-list > li.tem-subpropriedades > .subpropriedadesSeta {
  order: 5;
  flex: 0 0 100%;
  width: 100%;
  height: 13px;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.painel-propriedades-horizontal .caixaDaTabela #atom-list > li.tem-subpropriedades > .subpropriedadesSeta svg {
  width: 13px;
  height: 13px;
  transform: rotate(90deg);
}
.painel-propriedades-horizontal .caixaDaTabela #atom-list > li.tem-subpropriedades.subpropriedades-abertas > .subpropriedadesSeta svg { transform: rotate(-90deg); }
.painel-propriedades-horizontal .caixaDaTabela #atom-list > li.linhaPropriedades.propriedade-ativa { background: #ebebeb !important; box-shadow: 0 0 3px rgba(25, 35, 45, .08); }
.painel-propriedades-horizontal .caixaDaTabela #atom-list > li.linhaPropriedades:hover { background: #f2f2f2 !important; }
html[data-theme="dark"].painel-propriedades-horizontal .caixaDaTabela #atom-list > li.linhaPropriedades {
  background: #252b32 !important;
  color: #e8edf5 !important;
}
html[data-theme="dark"].painel-propriedades-horizontal .caixaDaTabela #atom-list > li.linhaPropriedades:hover {
  background: #323941 !important;
}
html[data-theme="dark"].painel-propriedades-horizontal .caixaDaTabela #atom-list > li.linhaPropriedades.propriedade-ativa {
  background: #3b424a !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .12);
}
html[data-theme="dark"].painel-propriedades-horizontal .caixaDaTabela #atom-list > li.linhaPropriedades.subpropriedades-abertas {
  background: #252b32 !important;
}

/* Ícone e título juntos; dado e expansão em linhas próprias. */
.caixaDaTabela:is(.painel-esquerda, .painel-direita, .painel-superior, .painel-inferior) #atom-list > li.linhaPropriedades {
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  column-gap: 4px !important;
  row-gap: 1px !important;
  text-align: center;
}
.caixaDaTabela:is(.painel-direita) #atom-list > li.linhaPropriedades {
  margin-block: 3px !important;
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita, .painel-superior, .painel-inferior) #atom-list > li.linhaPropriedades > svg {
  order: 1 !important;
  flex: 0 0 auto !important;
  align-self: center !important;
  margin: 0 !important;
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita, .painel-superior, .painel-inferior) #atom-list > li.linhaPropriedades > label {
  order: 2 !important;
  flex: 0 1 auto !important;
  align-self: center !important;
  width: auto !important;
  max-width: calc(100% - 20px);
  min-width: 0 !important;
  margin: 0 !important;
  text-align: center !important;
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita, .painel-superior, .painel-inferior) #atom-list > li.linhaPropriedades > label > span {
  display: block;
  text-align: center !important;
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita, .painel-superior, .painel-inferior) #atom-list > li.linhaPropriedades > :not(svg):not(label):not(.subpropriedadesSeta):not(.subpropriedadesMenu) {
  order: 3 !important;
  flex: 0 0 auto !important;
  align-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  text-align: center !important;
  justify-content: center !important;
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita, .painel-superior, .painel-inferior) #atom-list > li.linhaPropriedades > .unit-value-control {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0 .2em;
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita, .painel-superior, .painel-inferior) #atom-list > li:is(.botaoPontoFusao, .botaoPontoEbulicao) > .subtituloPropriedades {
  align-self: stretch !important;
  justify-content: center !important;
  text-align: center !important;
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita, .painel-superior, .painel-inferior) #atom-list > li.linhaPropriedades > .subpropriedadesSeta {
  order: 4 !important;
  align-self: stretch !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  margin: 0 !important;
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita, .painel-superior, .painel-inferior) #atom-list > li.linhaPropriedades > .subpropriedadesMenu {
  order: 5 !important;
  align-self: stretch !important;
}

/* As propriedades reveladas seguem a mesma leitura vertical do cartão. */
#atom-list > li.linhaPropriedades > .subpropriedadesMenu > .subpropriedadesOpcao:not([hidden]) {
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 1px;
  text-align: center;
}
#atom-list > li.linhaPropriedades > .subpropriedadesMenu > .subpropriedadesOpcao > :is(.rotuloOpcaoTipo, .valorOpcaoTipo) {
  flex: 0 0 auto;
  width: 100%;
  margin: 0;
  text-align: center;
}

/* A unidade pertence ao dado de cada propriedade revelada. */
#atom-list > li.linhaPropriedades > svg {
  display: none !important;
}
#atom-list .subpropriedadesOpcao .valorOpcaoTipo {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: .2em;
}
#atom-list .subpropriedadesOpcao .subpropriedadeUnidade {
  flex: 0 0 auto;
  margin: 0;
}

/* Temperatura e estado físico compartilham a linha abaixo do título. */
.caixaDaTabela:is(.painel-esquerda, .painel-direita, .painel-superior, .painel-inferior) #atom-list > li.botaoEstadoFisico::before {
  content: "";
  order: 3;
  flex: 0 0 100%;
  height: 0;
}
.caixaDaTabela:is(.painel-esquerda, .painel-direita, .painel-superior, .painel-inferior) #atom-list#atom-list > li.linhaPropriedades.botaoEstadoFisico > :is(.temperature-state-control, .propriedadeEstadoFisico) {
  order: 4 !important;
  flex: 0 1 auto !important;
  align-self: center !important;
  width: auto !important;
  margin: 0 !important;
  white-space: nowrap;
}

/* As opções abertas são cartões independentes na própria lista. */
#atom-list > li.propriedade-revelada {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: calc(100% - 8px);
  margin: 5px 4px !important;
  padding: 4px 6px !important;
  border: 1px solid #eeeeee;
  border-radius: 8px;
  background: #fff !important;
  box-shadow: 1px 2px 3px rgba(25, 35, 45, .05);
  text-align: center;
  list-style: none;
  position: relative;
  color: #757575;
  font-size: max(0.58rem, 10px) !important;
}
#atom-list > li:is(.propriedade-revelada, .subpropriedadesRodape)::before {
  content: "";
  position: absolute;
  left: calc(50% - .5px);
  top: -10px;
  width: 1px;
  height: 10px;
  background: #dce1e5;
  pointer-events: none;
}
#atom-list > li.propriedade-revelada:hover,
#atom-list > li.propriedade-revelada:focus-visible {
  background: #eceef0 !important;
}
#atom-list > li.propriedade-revelada[aria-current="true"],
#atom-list > li.propriedade-revelada[aria-current="true"]:hover {
  background: #f7f7f7 !important;
  box-shadow: 0 1px 2px rgba(25, 35, 45, .05);
}
#atom-list > li.propriedade-revelada > :is(.rotuloOpcaoTipo, .valorOpcaoTipo) {
  flex: 0 0 auto;
  width: 100%;
  margin: 0;
  text-align: center;
}
#atom-list > li.propriedade-revelada .valorOpcaoTipo {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: .2em;
}
#atom-list > li.subpropriedadesRodape {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(100% - 8px);
  min-height: 16px;
  margin: 0 4px 5px;
  padding: 0;
  list-style: none;
  position: relative;
}
#atom-list > li.subpropriedadesRodape > .subpropriedadesSeta {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 16px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
}
#atom-list > li.subpropriedadesRodape > .subpropriedadesSeta svg { width: 14px; height: 14px; transform: rotate(-90deg); }
.caixaDaTabela:is(.painel-esquerda, .painel-direita) #atom-list > li.linhaPropriedades.subpropriedades-abertas {
  border: 1px solid #eeeeee !important;
  box-shadow: 1px 2px 3px rgba(25, 35, 45, .05);
}
.painel-propriedades-horizontal .caixaDaTabela #atom-list > li.propriedade-revelada,
.painel-propriedades-horizontal .caixaDaTabela #atom-list > li.subpropriedadesRodape {
  width: 100%;
  margin: 3px 0 !important;
}
.painel-propriedades-horizontal .caixaDaTabela #atom-list > li.propriedade-revelada[aria-current="true"],
.painel-propriedades-horizontal .caixaDaTabela #atom-list > li.propriedade-revelada[aria-current="true"]:hover,
.painel-propriedades-horizontal .caixaDaTabela #atom-list > li.linhaPropriedades.subpropriedades-abertas.subpropriedade-principal-selecionada {
  background: #ebebeb !important;
}
html[data-theme="dark"] #atom-list > li.propriedade-revelada { background: #252b32 !important; border-color: #39414a; color: #e8edf5 !important; }
html[data-theme="dark"] #atom-list > li.propriedade-revelada:hover { background: #323941 !important; }
html[data-theme="dark"] #atom-list > li.propriedade-revelada[aria-current="true"],
html[data-theme="dark"] #atom-list > li.propriedade-revelada[aria-current="true"]:hover,
html[data-theme="dark"].painel-propriedades-horizontal .caixaDaTabela #atom-list > li.propriedade-revelada[aria-current="true"],
html[data-theme="dark"].painel-propriedades-horizontal .caixaDaTabela #atom-list > li.linhaPropriedades.subpropriedades-abertas.subpropriedade-principal-selecionada {
  background: #3b424a !important;
}
html[data-theme="dark"] #atom-list > li:is(.propriedade-revelada, .subpropriedadesRodape)::before { background: #46505b; }
