/* MHQ Network button system v1
   Geometry matches the Squad home hero buttons: compact 44px controls, 5px radius,
   strong DM Sans labels, solid primary + clean outlined secondary. */
:root{
  --mhq-btn-h:44px;
  --mhq-btn-radius:5px;
  --mhq-btn-pad-y:10px;
  --mhq-btn-pad-x:17px;
  --mhq-btn-gap:10px;
  --mhq-btn-font:700 14px/1.2 'DM Sans',Arial,sans-serif;
  --mhq-btn-border:#475666;
  --mhq-btn-text:#f7f4e9;
  --mhq-btn-bg:#12171d;
  --mhq-btn-primary:#ffd16b;
  --mhq-btn-primary-text:#101822;
}
body.page-arcade{--mhq-btn-primary:#ff886f;--mhq-btn-primary-text:#17100e;}
body.mlbb-data-site{--mhq-btn-primary:#f0c46b;--mhq-btn-primary-text:#17130a;}

/* Shared CTA geometry. Navigation tabs, icon-only controls, filters and answer chips are intentionally excluded. */
:is(body.premium-site,body.page-arcade,body.mlbb-data-site) :is(
  a.button,
  button.button,
  a.social-chip,
  button.social-chip,
  .hq-hero-actions>a,
  .nh-actions>a,
  .premium-stream-actions>a,
  .premium-stream-actions>button,
  .hq-support button,
  .hq-edition button,
  .guess-btn,
  .guess-quiet,
  .mx-button,
  .kmk-btn,
  .rule-card-cta,
  .arcade-return-active,
  .mlab-section-link
){
  box-sizing:border-box!important;
  min-height:var(--mhq-btn-h)!important;
  padding:var(--mhq-btn-pad-y) var(--mhq-btn-pad-x)!important;
  border-radius:var(--mhq-btn-radius)!important;
  border-width:1px!important;
  border-style:solid!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:var(--mhq-btn-gap)!important;
  font:var(--mhq-btn-font)!important;
  letter-spacing:0!important;
  text-transform:none!important;
  text-decoration:none!important;
  box-shadow:none!important;
  cursor:pointer;
  transition:transform .15s ease,background-color .15s ease,border-color .15s ease,color .15s ease,filter .15s ease!important;
}

/* Default outlined/secondary treatment. */
:is(body.premium-site,body.page-arcade,body.mlbb-data-site) :is(
  a.social-chip,
  button.social-chip,
  .button.button-outline,
  .guess-quiet,
  .mx-button:not(.primary):not(.danger),
  .kmk-btn.kmk-btn-quiet,
  .arcade-return-active,
  .mlab-section-link,
  .hq-support button,
  .hq-edition button
){
  color:var(--mhq-btn-text)!important;
  background:var(--mhq-btn-bg)!important;
  border-color:var(--mhq-btn-border)!important;
}

/* Primary treatment. */
:is(body.premium-site,body.page-arcade,body.mlbb-data-site) :is(
  .button:not(.button-outline),
  .hq-hero-actions>a:first-child,
  .nh-actions>a:first-child,
  .guess-btn,
  .mx-button.primary,
  .kmk-btn:not(.kmk-btn-quiet):not(.kmk-btn-end),
  .rule-card-cta
){
  color:var(--mhq-btn-primary-text)!important;
  background:var(--mhq-btn-primary)!important;
  border-color:var(--mhq-btn-primary)!important;
}

/* Creator social rows remain secondary even if older page CSS gave them creator colors. */
body.premium-site .social-link-row .social-chip{
  color:var(--mhq-btn-text)!important;
  background:var(--mhq-btn-bg)!important;
  border-color:var(--mhq-btn-border)!important;
}

/* YouTube / explicit outline actions are always secondary. */
body.premium-site :is(.creator-youtube-button,.button-outline){
  color:var(--mhq-btn-text)!important;
  background:var(--mhq-btn-bg)!important;
  border-color:var(--mhq-btn-border)!important;
}

/* Keep contextual primary color on creator pages when it is already defined by the page. */
body[data-theme="mrhoid"]{--mhq-btn-primary:#ffb70a;--mhq-btn-primary-text:#161108;}
body[data-theme="snackalot"]{--mhq-btn-primary:#6ec9fb;--mhq-btn-primary-text:#08131a;}
body[data-theme="melody"]{--mhq-btn-primary:#ed9cbc;--mhq-btn-primary-text:#1b0d14;}
body[data-theme="coaching"]{--mhq-btn-primary:#ffd16b;--mhq-btn-primary-text:#101822;}

/* Hover/focus/disabled behavior mirrors the home page but feels a little more deliberate. */
:is(body.premium-site,body.page-arcade,body.mlbb-data-site) :is(
  a.button,
  button.button,
  a.social-chip,
  button.social-chip,
  .hq-hero-actions>a,
  .nh-actions>a,
  .premium-stream-actions>a,
  .premium-stream-actions>button,
  .hq-support button,
  .hq-edition button,
  .guess-btn,
  .guess-quiet,
  .mx-button,
  .kmk-btn,
  .rule-card-cta,
  .arcade-return-active,
  .mlab-section-link
):not(:disabled):is(:hover,:focus-visible){
  transform:translateY(-1px)!important;
  filter:brightness(1.08)!important;
  border-color:#f7f4e9!important;
}
:is(body.premium-site,body.page-arcade,body.mlbb-data-site) :is(
  .guess-btn,.guess-quiet,.mx-button,.kmk-btn,.rule-card-cta,.button,.social-chip
):disabled{
  opacity:.48!important;
  cursor:not-allowed!important;
  transform:none!important;
  filter:none!important;
}

/* Destructive actions keep their warning semantics but use the same geometry. */
body.page-arcade :is(.mx-button.danger,.kmk-btn-end){
  min-height:var(--mhq-btn-h)!important;
  padding:var(--mhq-btn-pad-y) var(--mhq-btn-pad-x)!important;
  border-radius:var(--mhq-btn-radius)!important;
  font:var(--mhq-btn-font)!important;
}

/* Lab: style conventional content buttons while leaving filters/tabs/chips alone. */
body.mlbb-data-site main button:not(.mlbb-visual-choice):not([role="tab"]):not([class*="tab"]):not([class*="filter"]):not(.mhq-rec-add):not(.nh-icon-control){
  min-height:var(--mhq-btn-h);
  border-radius:var(--mhq-btn-radius);
  font-family:'DM Sans',Arial,sans-serif;
  font-weight:700;
}

/* Mobile: keep the home-page compactness rather than growing controls into pills. */
@media(max-width:700px){
  :root{--mhq-btn-h:42px;--mhq-btn-pad-y:9px;--mhq-btn-pad-x:13px;--mhq-btn-font:700 13px/1.2 'DM Sans',Arial,sans-serif;--mhq-btn-gap:8px;}
}