/* Sprint 8: small accessible finishing layer, intentionally after Liquid UI. */
html{overflow-wrap:break-word}
main,main .container,main section{min-width:0}
input,select,textarea,button{max-width:100%}
:where(.card,.category-card,.tool-form,.admin-panel){overflow-wrap:anywhere}
:where(.site-footer a,.footer-column a,.footer-action a):focus-visible{outline:3px solid #f5d382;outline-offset:4px;border-radius:4px}
:where(.button,button,[role="button"]){touch-action:manipulation}
:where(.tool-form input,.tool-form select,.tool-form textarea,.site-search-form input){font-size:max(1rem,16px)}
:where(.article-body,.content-page,.service-content) :is(img,video,iframe){max-width:100%;height:auto}
:where(.article-body,.content-page,.service-content) :is(pre,table){max-width:100%}
:where(.article-body,.content-page,.service-content) pre{overflow-x:auto}
:where(.site-footer a,.footer-action a){text-underline-offset:3px}
@media(max-width:700px){.site-footer{padding-bottom:calc(90px + env(safe-area-inset-bottom))}.footer-inner{gap:26px}.footer-column{gap:12px}.footer-column a{min-height:28px}.content-page h1,.article-page h1{overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@media(forced-colors:active){.button,.card,.site-header,.site-footer{forced-color-adjust:auto}}

/* Article advertising has its own layout even on pages where calculator CSS is not loaded. */
.article-ad{border-block:1px solid #dce9e1;margin:2.5rem 0;padding:1rem 0 1.5rem;min-height:280px;overflow:hidden}
.article-ad-label{display:block;text-align:center;color:#58716c;font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:1rem}
.article-ad .adsbygoogle{min-height:220px}
