/* Only standard articles enhanced by article-reading-entry.mjs use this layer. */
.article-reading-experience > .article-heading { margin-bottom: 24px; }
.article-reading-experience .article-reading-entry { margin: 0 0 36px; }
.article-reading-entry-label { margin: 0 0 12px; color: #425b73; font-size: 1rem; line-height: 1.7; }
.article-reading-entry-grid { display: grid; grid-template-columns: repeat(var(--article-entry-count,4),minmax(0,1fr)); gap: 12px; }
.article-reading-entry-grid > a {
  display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-rows: 40px 1fr;
  align-items: center; gap: 12px 8px; min-width: 0; padding: 14px 16px;
  border: 1px solid #c7d2df; border-top: 2px solid #8ca2b8; background: white;
  color: var(--navy,#001858); text-decoration: none;
}
.article-reading-entry-grid > a:hover { border-color: #567590; background: #fafbfd; }
.article-reading-entry-grid > a:focus-visible { outline: 3px solid #315e88; outline-offset: 4px; }
.article-reading-visual {
  display: flex; grid-column: 1/-1; align-items: center; justify-content: center;
  gap: 5px; width: 100%; min-width: 0; height: 40px; color: #3e5871;
}
.article-reading-visual > span {
  display: flex; align-items: center; justify-content: center; min-height: 31px;
  padding: 2px 9px; border-top: 2px solid #98adc0; border-bottom: 1px solid #cdd8e2;
  background: #f5f8fb; font-size: 15px; line-height: 1.4;
}
.article-reading-visual--diagram > span { min-width: 72px; border: 1px solid #a3b5c6; background: white; }
.article-reading-visual--sources > span { border-top-color: #a99a81; background: #faf8f4; }
.article-reading-visual--applications > span { border-top-color: #8b9cab; background: #f5f7f9; }
.article-reading-entry-copy { display: block; min-width: 0; align-self: start; }
.article-reading-entry-copy strong { display: block; min-height: 3.1em; font-size: 18px; line-height: 1.55; color: var(--navy,#001858); }
.article-reading-entry-copy > span { display: block; margin-top: 5px; font-size: 15px; line-height: 1.65; color: #435a70; }
.article-reading-entry-arrow { align-self: end; padding-bottom: 2px; color: #426381; font-size: 21px; line-height: 1.4; }
.article-reading-experience [id^="article-reading-"],
.article-reading-experience h2[id], .article-reading-experience h3[id] { scroll-margin-top: 24px; }

/* Keep the already written first confirmation visible without another summary. */
.article-reading-experience .article-use .first-step { padding: 16px 18px; border-top: 0; border-left: 2px solid #b69a76; background: #faf9f6; }
.article-reading-experience .source-panel { border-top-color: #8ba1b7; }

/* Consecutive practical entrances are alternatives in one area, not new chapters. */
.article-reading-experience .article-reading-applications {
  margin: 34px 0 42px; padding: 0 24px 4px; border: 1px solid #c8d3df;
  border-top: 2px solid #8ba1b7; background: white;
}
.article-reading-application-label { margin: 0 -24px; padding: 15px 24px; color: #3e5871; font-size: 1.0625rem; line-height: 1.7; background: #f6f8fb; }
.article-reading-experience .article-reading-applications > .article-section {
  margin: 0; padding: 24px 0; border: 0; border-top: 1px solid #d4dde6; border-radius: 0; background: transparent;
}
.article-reading-experience .article-reading-applications > .article-section:first-of-type { border-top: 0; }
.article-reading-experience .article-reading-applications > .article-section > h2 { margin: 4px 0 14px; font-size: 1.375rem; line-height: 1.7; }
.article-reading-experience .article-reading-applications > .article-section > p:not(.eyebrow):not(.reading-note) { font-size: 1.0625rem; line-height: 1.9; }
.article-reading-experience .article-reading-applications .feature-actions { margin-top: 18px; }
.article-reading-experience .article-reading-applications .reading-note { margin-bottom: 0; }

@media(max-width:1000px) {
  .article-reading-entry-grid { gap: 10px; }
  .article-reading-entry-grid > a { padding: 12px; }
  .article-reading-visual { gap: 4px; }
  .article-reading-visual > span { padding-inline: 7px; }
}
@media(max-width:760px) {
  .article-reading-experience > .article-heading { margin-bottom: 20px; }
  .article-reading-experience .article-reading-entry { margin-bottom: 28px; }
  .article-reading-entry-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .article-reading-entry-grid > a { padding: 12px; gap: 9px 7px; }
  .article-reading-entry-grid > a:last-child:nth-child(odd) { grid-column: 1/-1; }
  .article-reading-entry-copy strong { font-size: 18px; line-height: 1.55; }
  .article-reading-entry-copy > span { font-size: 15px; line-height: 1.6; }
  .article-reading-experience .article-use .first-step { padding: 14px; }
  .article-reading-experience .article-reading-applications { margin: 28px 0 34px; padding: 0 18px 2px; }
  .article-reading-application-label { margin-inline: -18px; padding: 14px 18px; }
  .article-reading-experience .article-reading-applications > .article-section { padding-block: 21px; }
  .article-reading-experience .article-reading-applications > .article-section > h2 { font-size: 1.25rem; }
}
@media(max-width:360px) {
  .article-reading-entry-grid > a { padding: 10px; gap: 8px 4px; }
  .article-reading-visual { gap: 3px; }
  .article-reading-visual > span { padding-inline: 5px; }
}
@media print {
  .article-reading-experience .article-reading-entry { display: none; }
  .article-reading-experience .article-reading-applications { border: 0; padding: 0; }
  .article-reading-application-label { padding: 0; margin: 0 0 12px; background: transparent; }
}
