/* HB Battle unified final contrast + responsive safety layer.
   Loaded last on every public HTML page to neutralize conflicting legacy overrides. */
:root{--hb-ink:#14251d;--hb-muted:#52645b;--hb-green:#087d50;--hb-gold:#e8bd61;--hb-card:#f7faf8;--hb-border:rgba(15,45,31,.14)}
html{color-scheme:dark;scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{overflow-x:clip}
img,video,canvas,svg{max-width:100%}
/* White/pale cards must always use readable dark text. */
.step,.faq-item,.guide-list li,.note,.card,.guide-card,.article-card,.popular-guide-card{
  background:#f4f7f5!important;color:var(--hb-ink)!important;border:1px solid var(--hb-border)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.10)!important;border-radius:22px!important
}
.step h1,.step h2,.step h3,.step h4,.step p,.step li,.faq-item summary,.faq-item p,
.guide-list li,.guide-list li a,.note,.note strong,.card h1,.card h2,.card h3,.card p,
.guide-card a,.article-card a,.popular-guide-card a{color:var(--hb-ink)!important;opacity:1!important}
.guide-list{padding-left:0;list-style:none;display:grid;gap:14px}
.guide-list li{padding:0!important;overflow:hidden}
.guide-list li a{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:22px 24px;min-height:76px;text-decoration:none!important;font-weight:650;line-height:1.55;overflow-wrap:anywhere}
.guide-list li a:hover,.guide-list li a:focus-visible{color:var(--hb-green)!important;background:#eaf3ee;outline-offset:3px}
.faq-item summary{cursor:pointer;font-weight:700;line-height:1.55;padding:20px 22px}
.faq-item p{line-height:1.75;padding:0 22px 20px}
.note{padding:24px!important;line-height:1.8!important}
.step{padding:24px!important}
.step p,.card p{line-height:1.75}
/* Keep fixed app CTA from covering page content or controls on small screens. */
.mega-cta-bar{max-width:calc(100vw - 24px)!important;box-sizing:border-box;z-index:50}
.mega-cta-bar a,.mega-cta-bar button{white-space:normal}
body{padding-bottom:env(safe-area-inset-bottom,0px)}
:focus-visible{outline:3px solid #e8bd61!important;outline-offset:3px}
@media(max-width:600px){
 .guide-list li a{padding:18px 20px;min-height:68px;font-size:clamp(15px,4.2vw,18px)}
 .step{padding:20px!important}
 .note{padding:20px!important}
 .mega-cta-bar{gap:8px!important;bottom:calc(12px + env(safe-area-inset-bottom,0px))!important}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
