/*! SPDX-License-Identifier: LicenseRef-Enfermatiko-Proprietary */
header .flex, footer .flex, .tab-view .flex > *, .tab-view .grid > * {min-inline-size:0}
.tab-view :is(h2,h3,h4,p,strong,label,button),footer a {overflow-wrap:break-word;hyphens:auto}
.tab-view select {max-inline-size:100%}
#activeArticleContainer,#elementQuickOutput,#westernSpotlight,#chineseSpotlight,#calculatorResultsContainer,#synastryResultsContainer {container-type:inline-size;scroll-margin-top:5rem}
@container (max-width:36rem) {
 .grid.grid-cols-1:is(.md\:grid-cols-3,.sm\:grid-cols-3){grid-template-columns:minmax(0,1fr)}
 .flex.justify-between{flex-wrap:wrap;row-gap:.5rem}
}
#footnoteModal>div{max-block-size:80dvh;overflow-y:auto}
.example-tools{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;margin-block:.8rem}
.example-tools button,.reading-link{background:#19243a;color:#f3dfab;border:1px solid #766642;border-radius:.55rem;padding:.5rem .75rem;text-align:start;line-height:1.4}
.reading-link{display:inline;padding:0 .18em;border:0;background:transparent;text-decoration:underline;text-underline-offset:.15em;font:inherit;color:#f3dfab}
.example-tools button:hover,.reading-link:hover{color:white}
@media(max-width:700px){
 header>div:first-child{padding-inline:.5rem;gap:.3rem}
 header #brandHomeBtn{gap:.3rem}
 header #brandHomeBtn span{letter-spacing:normal}
 header .flex{column-gap:.25rem}
 header #langEsBtn,header #langEnBtn,header #langZhBtn{padding-inline:.3rem}
 #westernGrid .flex.justify-between,#chineseGrid .flex.justify-between,#footnotesDrawer .flex.justify-between,.article-select-btn .flex{flex-wrap:wrap;gap:.4rem}
 .tab-view .card-cosmos{padding:1rem}
 .tab-view .inline-flex{max-width:100%;white-space:normal;flex-wrap:wrap}
 .example-tools button,.calc-preset-btn{min-height:44px}
}

@media(max-width:440px){header>div:first-child{height:auto;min-height:3.5rem;flex-wrap:wrap;padding-block:.35rem}header .flex:has(>#langEsBtn),header .flex:has(>#toggleFootnotesGlobalBtn){flex-shrink:0}.tab-view span:has(>svg.atlas-pictogram){min-width:1em}}
@media(min-width:700px) and (max-width:1200px){header>div:first-child{height:auto;min-height:4rem;flex-wrap:wrap;padding-block:.4rem}header #toggleFootnotesGlobalBtn,header .flex:has(>#toggleFootnotesGlobalBtn),header nav{flex-shrink:0}.grid.md\:grid-cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
