/* MiKO Profile Button System v12 — scoped only to /profile/ */
.page-id-24563{
  --mpb-blue:#0879e8;
  --mpb-blue2:#075fc6;
  --mpb-ink:#173f69;
  --mpb-muted:#6f8498;
  --mpb-line:#d5e4f1;
  --mpb-soft:#f3f8fd;
  --mpb-danger:#c94a4a;
}

/* Shared button geometry */
.page-id-24563 .miko-profile-main button,
.page-id-24563 .miko-profile-main .miko-profile-actions>a,
.page-id-24563 .miko-profile-main .miko-profile-avatar-gate>a,
.page-id-24563 .miko-profile-main .miko-cosmetic-empty>a{
  box-sizing:border-box!important;
  min-width:0!important;
  max-width:100%!important;
  line-height:1.25!important;
  text-decoration:none!important;
  -webkit-tap-highlight-color:transparent!important;
}
.page-id-24563 .miko-profile-main button:focus-visible,
.page-id-24563 .miko-profile-main .miko-profile-actions>a:focus-visible,
.page-id-24563 .miko-profile-main .miko-profile-avatar-gate>a:focus-visible,
.page-id-24563 .miko-profile-main .miko-cosmetic-empty>a:focus-visible{
  outline:3px solid rgba(8,121,232,.22)!important;
  outline-offset:2px!important;
}

/* Hero action buttons: equal and aligned */
.page-id-24563 .miko-profile-actions{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  align-items:stretch!important;
  gap:10px!important;
  width:min(100%,310px)!important;
  min-width:0!important;
  margin-left:auto!important;
}
.page-id-24563 .miko-profile-actions>a{
  width:100%!important;
  min-height:44px!important;
  margin:0!important;
  padding:10px 12px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  border-radius:13px!important;
  white-space:normal!important;
  text-align:center!important;
}

/* Force hero actions visible even when another theme rule overrides anchor colors */
.page-id-24563 .miko-profile-edit-link,
.page-id-24563 .miko-profile-public-link{
  opacity:1!important;
  visibility:visible!important;
  position:relative!important;
  z-index:12!important;
  font-weight:900!important;
}
.page-id-24563 .miko-profile-edit-link{
  display:inline-flex!important;
  background:#0879e8!important;
  color:#fff!important;
  border:1px solid #0879e8!important;
  box-shadow:0 8px 18px rgba(8,121,232,.24)!important;
}
.page-id-24563 .miko-profile-public-link{
  display:inline-flex!important;
  background:#fff!important;
  color:#173f69!important;
  border:1px solid #c8daea!important;
}
.page-id-24563 .miko-profile-edit-link span,
.page-id-24563 .miko-profile-edit-link i,
.page-id-24563 .miko-profile-public-link span,
.page-id-24563 .miko-profile-public-link i{color:inherit!important;opacity:1!important;visibility:visible!important}

/* Profile Studio tabs: 4 equal cards on desktop */
.page-id-24563 .miko-cosmetic-tabs{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  align-items:stretch!important;
  gap:10px!important;
  width:100%!important;
  overflow:visible!important;
}
.page-id-24563 .miko-cosmetic-tabs button{
  width:100%!important;
  height:100%!important;
  min-height:70px!important;
  margin:0!important;
  padding:10px 11px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:9px!important;
  overflow:hidden!important;
  border-radius:14px!important;
}
.page-id-24563 .miko-cosmetic-tabs .miko-tab-icon{
  flex:0 0 34px!important;
}
.page-id-24563 .miko-cosmetic-tabs .miko-tab-copy{
  min-width:0!important;
  overflow:hidden!important;
}
.page-id-24563 .miko-cosmetic-tabs .miko-tab-copy b,
.page-id-24563 .miko-cosmetic-tabs .miko-tab-copy small{
  display:block!important;
  overflow-wrap:anywhere!important;
}
.page-id-24563 .miko-cosmetic-tabs button.is-active{
  transform:none!important;
}
.page-id-24563 .miko-cosmetic-tabs button:hover{
  transform:translateY(-1px)!important;
}

/* Intro/action rows inside Studio */
.page-id-24563 .miko-pane-intro,
.page-id-24563 .miko-frame-pane-head,
.page-id-24563 .miko-cover-nft-head{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:12px!important;
}
.page-id-24563 .miko-pane-intro>div,
.page-id-24563 .miko-frame-pane-head>div,
.page-id-24563 .miko-cover-nft-head>div{
  min-width:0!important;
}
.page-id-24563 .miko-remove-frame,
.page-id-24563 .miko-remove-cover{
  width:auto!important;
  min-width:118px!important;
  min-height:40px!important;
  margin:0!important;
  padding:9px 12px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  white-space:nowrap!important;
}

/* NFT / cover cards: same button position and height */
.page-id-24563 .miko-cosmetic-grid{
  align-items:stretch!important;
}
.page-id-24563 .miko-cosmetic-nft{
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  height:100%!important;
}
.page-id-24563 .miko-cosmetic-nft>div:not(.miko-cosmetic-lock){
  flex:1 1 auto!important;
  min-width:0!important;
}
.page-id-24563 .miko-cosmetic-nft button{
  flex:0 0 auto!important;
  width:calc(100% - 20px)!important;
  min-height:42px!important;
  margin:0 10px 10px!important;
  padding:9px 10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  border-radius:11px!important;
}
.page-id-24563 .miko-cosmetic-nft button:disabled{
  opacity:1!important;
}

/* Upload CTA: full card width, not page width */
.page-id-24563 .miko-upload-card{
  min-width:0!important;
}
.page-id-24563 .miko-upload-card>button{
  width:100%!important;
  min-height:44px!important;
  margin:0!important;
  padding:10px 14px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:12px!important;
  text-align:center!important;
  white-space:normal!important;
}

/* Empty-state / gate links */
.page-id-24563 .miko-profile-avatar-gate>a,
.page-id-24563 .miko-cosmetic-empty>a{
  width:auto!important;
  min-height:40px!important;
  padding:9px 13px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:11px!important;
  white-space:normal!important;
  text-align:center!important;
}
.page-id-24563 .miko-profile-avatar-gate>a{
  justify-self:start!important;
}
.page-id-24563 .miko-cosmetic-empty>a{
  justify-self:center!important;
}

/* Profile save / settings buttons: compact on desktop */
.page-id-24563 .miko-primary-btn,
.page-id-24563 #settings .miko-account-grid form>button,
.page-id-24563 #missions .miko-profile-checkin>button{
  width:auto!important;
  min-width:170px!important;
  min-height:42px!important;
  margin:12px 0 0!important;
  padding:10px 16px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:12px!important;
  border:0!important;
  background:linear-gradient(135deg,var(--mpb-blue),var(--mpb-blue2))!important;
  color:#fff!important;
  box-shadow:0 7px 18px rgba(8,121,232,.18)!important;
  font-size:11px!important;
  font-weight:900!important;
  text-align:center!important;
  white-space:normal!important;
}
.page-id-24563 .miko-primary-btn:hover,
.page-id-24563 #settings .miko-account-grid form>button:hover,
.page-id-24563 #missions .miko-profile-checkin>button:hover{
  transform:translateY(-1px)!important;
  box-shadow:0 10px 22px rgba(8,121,232,.24)!important;
}
.page-id-24563 #settings .miko-account-grid form{
  align-content:start!important;
}
.page-id-24563 #settings .miko-account-grid form>button{
  justify-self:start!important;
}

/* PRO plan CTA buttons: equal height and aligned to bottom */
.page-id-24563 .miko-master-pro-packages .miko-master-package-grid article{
  height:100%!important;
}
.page-id-24563 .miko-master-pro-packages .miko-master-package-grid button{
  min-height:40px!important;
  margin-top:auto!important;
  padding:9px 10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  white-space:normal!important;
  text-align:center!important;
}

/* Never let profile buttons overlap neighboring content */
.page-id-24563 .miko-profile-main button,
.page-id-24563 .miko-profile-main a{
  word-break:normal!important;
}
.page-id-24563 .miko-profile-main button svg,
.page-id-24563 .miko-profile-main a svg{
  flex-shrink:0!important;
}

/* Tablet */
@media(max-width:1020px){
  .page-id-24563 .miko-cosmetic-tabs{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .page-id-24563 .miko-cosmetic-tabs button{
    min-height:64px!important;
  }
  .page-id-24563 .miko-profile-actions{
    width:100%!important;
    max-width:none!important;
  }
}

/* Mobile: ordered 2-column layout */
@media(max-width:560px){
  .page-id-24563 .miko-cosmetic-tabs{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    padding:7px!important;
  }
  .page-id-24563 .miko-cosmetic-tabs button{
    min-height:60px!important;
    padding:8px!important;
  }
  .page-id-24563 .miko-pane-intro,
  .page-id-24563 .miko-frame-pane-head,
  .page-id-24563 .miko-cover-nft-head{
    grid-template-columns:1fr!important;
    align-items:stretch!important;
  }
  .page-id-24563 .miko-remove-frame,
  .page-id-24563 .miko-remove-cover{
    width:100%!important;
    min-width:0!important;
  }
  .page-id-24563 .miko-primary-btn,
  .page-id-24563 #settings .miko-account-grid form>button,
  .page-id-24563 #missions .miko-profile-checkin>button{
    width:100%!important;
    min-width:0!important;
    justify-self:stretch!important;
  }
  .page-id-24563 .miko-profile-avatar-gate>a{
    width:100%!important;
    justify-self:stretch!important;
  }
}

/* 430 / 390 */
@media(max-width:430px){
  .page-id-24563 .miko-profile-actions{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }
  .page-id-24563 .miko-profile-actions>a{
    min-height:40px!important;
    padding:8px 7px!important;
    font-size:9px!important;
  }
  .page-id-24563 .miko-cosmetic-tabs .miko-tab-icon{
    flex-basis:30px!important;
    width:30px!important;
    height:30px!important;
  }
  .page-id-24563 .miko-cosmetic-tabs .miko-tab-copy b{
    font-size:10.5px!important;
  }
  .page-id-24563 .miko-cosmetic-tabs .miko-tab-copy small{
    font-size:7.5px!important;
  }
}
@media(max-width:390px){
  .page-id-24563 .miko-cosmetic-tabs{
    gap:7px!important;
  }
  .page-id-24563 .miko-cosmetic-tabs button{
    min-height:58px!important;
    gap:7px!important;
  }
  .page-id-24563 .miko-cosmetic-nft button{
    min-height:40px!important;
    font-size:9.5px!important;
  }
}

/* Narrow mobile: stack actions to eliminate squeeze */
@media(max-width:360px){
  .page-id-24563 .miko-profile-actions{
    grid-template-columns:1fr!important;
  }
  .page-id-24563 .miko-cosmetic-tabs{
    grid-template-columns:1fr!important;
  }
  .page-id-24563 .miko-cosmetic-tabs button{
    min-height:54px!important;
  }
  .page-id-24563 .miko-cosmetic-tabs .miko-tab-copy b{
    font-size:11px!important;
  }
  .page-id-24563 .miko-cosmetic-tabs .miko-tab-copy small{
    font-size:8px!important;
  }
}