/* BloxChase Typography Standard v20.15
   Scale aligned to BloxEarn/Tailwind sizing while keeping BloxChase's Poppins family.
   Core scale: 12/16, 14/20, 16/24, 18/28, 20/28, 24/32, 30/36, 36/40. */
:root{
  --bc-fs-micro:11px;
  --bc-fs-xs:12px;
  --bc-fs-sm:14px;
  --bc-fs-base:16px;
  --bc-fs-lg:18px;
  --bc-fs-xl:20px;
  --bc-fs-2xl:24px;
  --bc-fs-3xl:30px;
  --bc-fs-4xl:36px;
  --bc-lh-xs:16px;
  --bc-lh-sm:20px;
  --bc-lh-base:24px;
  --bc-lh-lg:28px;
  --bc-lh-xl:28px;
  --bc-lh-2xl:32px;
  --bc-lh-3xl:36px;
  --bc-lh-4xl:40px;
}

/* Keep the current brand typeface. */
html,body,button,input,textarea,select{font-family:Poppins,sans-serif}
body{font-size:var(--bc-fs-base);line-height:var(--bc-lh-base)}

/* Shared navigation: desktop competitor navigation is effectively base-size text. */
.bc-nav-link{font-size:15px!important;line-height:20px;font-weight:500}
.bc-side-label{font-size:11px!important;line-height:16px}
.bc-nav-group>button{font-size:11px!important;line-height:16px}
.bc-nav-badge{font-size:10px!important;line-height:14px}
.bc-balance{font-size:14px!important;line-height:20px}
.bc-profile-meta strong{font-size:13px!important;line-height:18px}
.bc-profile-meta span{font-size:11px!important;line-height:16px}
.bc-pop-item{font-size:14px!important;line-height:20px}
.bc-pop-section-label{font-size:10px!important;line-height:14px}
.bc-profile-balance{font-size:11px!important;line-height:16px}
.bc-reward-toast strong{font-size:13px!important;line-height:18px}
.bc-reward-toast span{font-size:12px!important;line-height:18px}

/* Live reward ticker remains compact, but no longer microscopic. */
.bc-tick-card .name{font-size:12px!important;line-height:16px}
.bc-tick-card .meta{font-size:10px!important;line-height:14px}
.bc-tick-card .amount{font-size:11px!important;line-height:14px}
.bc-lang-btn strong{font-size:13px!important;line-height:18px}
.bc-lang-btn small{font-size:10px!important;line-height:14px}
.bc-lang-title{font-size:18px!important;line-height:28px}
.bc-lang-tile{font-size:15px!important;line-height:20px}

/* User-facing hierarchy. BloxEarn uses 24px section headings on mobile and 30px from md up. */
.bc-main-content:not(.admin) h1.bc-section-title{
  font-size:30px!important;
  line-height:36px!important;
  letter-spacing:-.03em;
}
.bc-main-content:not(.admin) h2.bc-section-title,
.bc-main-content:not(.admin) .bc-section-head h2{
  font-size:24px!important;
  line-height:32px!important;
  letter-spacing:-.025em;
}
.bc-main-content:not(.admin) .bc-earn-sub,
.bc-main-content:not(.admin) .bc-section-head p{
  font-size:18px!important;
  line-height:28px!important;
}

/* Earn cards: preserve compact cards, normalize readable labels. */
.bc-wall-tag{font-size:9px!important;line-height:12px!important}
.bc-wall-copy strong{font-size:13px!important;line-height:18px!important}
.bc-wall-state{font-size:9px!important;line-height:12px!important}
.bc-social-toast{font-size:12px!important;line-height:18px!important}
.bc-empty{font-size:14px!important;line-height:20px!important}

/* Chat: message content already sat near the correct scale; metadata was too tiny. */
.chat-copy{font-size:14px!important;line-height:20px!important}
.chat-time{font-size:10px!important;line-height:14px!important}
.role-pill{font-size:9px!important;line-height:12px!important}
.chat-input-row .bc-input{font-size:14px!important;line-height:20px!important}
.chat-input-row .bc-input::placeholder{font-size:13px!important;line-height:20px!important}
.chat-verify-title{font-size:14px!important;line-height:20px!important}
.chat-verify-sub{font-size:12px!important;line-height:18px!important}
.chat-verify-btn{font-size:12px!important;line-height:16px!important}
.chat-jump{font-size:11px!important;line-height:16px!important}
.chat-user-pop-name{font-size:16px!important;line-height:24px!important}
.chat-user-pop-meta{font-size:11px!important;line-height:16px!important}
.chat-user-stat small{font-size:10px!important;line-height:14px!important}
.chat-user-stat strong{font-size:12px!important;line-height:16px!important}
.chat-user-pop-actions a{font-size:12px!important;line-height:16px!important}
.chat-user-loading{font-size:12px!important;line-height:18px!important}
.chat-local-title{font-size:11px!important;line-height:16px!important}
.offline-notice{font-size:12px!important;line-height:18px!important}
.help-card{font-size:13px;line-height:20px}

/* Chat-generated Tailwind micro labels: only inside chat, not globally. */
.chat-shell [class~="text-[7px]"]{font-size:9px!important;line-height:12px!important}
.chat-shell [class~="text-[7.5px]"]{font-size:9.5px!important;line-height:13px!important}
.chat-shell [class~="text-[8px]"]{font-size:10px!important;line-height:14px!important}
.chat-shell [class~="text-[9px]"]{font-size:11px!important;line-height:16px!important}
.chat-shell [class~="text-[10px]"]{font-size:12px!important;line-height:16px!important}
.chat-shell [class~="text-[11px]"]{font-size:12px!important;line-height:16px!important}
.chat-shell [class~="text-[11.5px]"]{font-size:13px!important;line-height:18px!important}
.chat-shell [class~="text-[12px]"]{font-size:13px!important;line-height:18px!important}

/* User pages: keep micro badges compact, but remove 7–8px UI copy that becomes illegible. */
.bc-main-content:not(.admin) [class~="text-[7px]"]{font-size:9px!important;line-height:12px!important}
.bc-main-content:not(.admin) [class~="text-[7.5px]"]{font-size:9.5px!important;line-height:13px!important}
.bc-main-content:not(.admin) [class~="text-[8px]"]{font-size:10px!important;line-height:14px!important}
.bc-main-content:not(.admin) [class~="text-[9px]"]{font-size:10px!important;line-height:14px!important}
.bc-main-content:not(.admin) [class~="text-[10px]"]{font-size:11px!important;line-height:16px!important}
.bc-main-content:not(.admin) [class~="text-[11px]"]{font-size:12px!important;line-height:16px!important}

/* Admin typography: arbitrary 8-10px labels were being used as normal UI copy.
   Keep micro text for metadata, but never below 11px in the admin workspace. */
.bc-main-content.admin{font-size:14px;line-height:20px}
.bc-main-content.admin [class~="text-[7px]"],
.bc-main-content.admin [class~="text-[7.5px]"],
.bc-main-content.admin [class~="text-[8px]"],
.bc-main-content.admin [class~="text-[9px]"]{
  font-size:11px!important;
  line-height:16px!important;
}
.bc-main-content.admin [class~="text-[10px]"],
.bc-main-content.admin [class~="text-[11px]"]{
  font-size:12px!important;
  line-height:16px!important;
}
.bc-main-content.admin .text-xs{font-size:13px!important;line-height:18px!important}
.bc-main-content.admin .text-sm{font-size:14px!important;line-height:20px!important}
.bc-main-content.admin .text-base{font-size:16px!important;line-height:24px!important}
.bc-main-content.admin .text-lg{font-size:18px!important;line-height:28px!important}
.bc-main-content.admin .text-xl{font-size:20px!important;line-height:28px!important}
.bc-main-content.admin .text-2xl{font-size:24px!important;line-height:32px!important}
.bc-main-content.admin .text-3xl{font-size:30px!important;line-height:36px!important}
.bc-main-content.admin .text-4xl{font-size:36px!important;line-height:40px!important}
.bc-main-content.admin table{font-size:13px;line-height:18px}
.bc-main-content.admin table .text-sm{font-size:13px!important;line-height:18px!important}
.bc-main-content.admin label{line-height:18px}
.bc-main-content.admin .bc-input{font-size:14px;line-height:20px}
.bc-main-content.admin .bc-btn,
.bc-main-content.admin .bc-btn-soft{font-size:13px;line-height:18px}

/* Admin shell should be readable too. */
.bc-sidebar.admin .bc-nav-link{font-size:15px!important}
.bc-sidebar.admin .bc-nav-group>button{font-size:11px!important}
.bc-admin-title{font-size:16px!important;line-height:24px}
.bc-admin-user strong{font-size:13px!important;line-height:18px}
.bc-admin-user small{font-size:10px!important;line-height:14px}
.bc-admin-visit{font-size:12px!important;line-height:16px}

/* Forms: competitor CSS uses 16px inputs. This also avoids iOS focus-zoom. */
@media(max-width:1023px){
  input,textarea,select{font-size:16px!important;line-height:24px!important}
  .bc-mobile-link{font-size:12px!important;line-height:16px!important}
  .bc-lang-tile{font-size:14px!important;line-height:20px}
  .chat-copy{font-size:14px!important;line-height:20px!important}
  .chat-input-row .bc-input{font-size:16px!important;line-height:24px!important}
  .bc-main-content.admin{font-size:14px;line-height:20px}
}

/* BloxEarn md breakpoint = 768px: section heading 24 -> 30, subtitle 18 -> 20. */
@media(min-width:768px){
  .bc-main-content:not(.admin) h1.bc-section-title{font-size:36px!important;line-height:40px!important}
  .bc-main-content:not(.admin) h2.bc-section-title,
  .bc-main-content:not(.admin) .bc-section-head h2{font-size:30px!important;line-height:36px!important}
  .bc-main-content:not(.admin) .bc-earn-sub,
  .bc-main-content:not(.admin) .bc-section-head p{font-size:20px!important;line-height:28px!important}
}

/* Very narrow phones: maintain hierarchy without oversized wrapping. */
@media(max-width:390px){
  .bc-main-content:not(.admin) h1.bc-section-title{font-size:28px!important;line-height:34px!important}
  .bc-main-content:not(.admin) h2.bc-section-title,
  .bc-main-content:not(.admin) .bc-section-head h2{font-size:23px!important;line-height:30px!important}
  .bc-main-content:not(.admin) .bc-earn-sub,
  .bc-main-content:not(.admin) .bc-section-head p{font-size:16px!important;line-height:24px!important}
}
