/* SkillCraft Mobile Layer · 2026-08-13
   Mobile-only enhancement. Desktop rules are intentionally untouched. */
@media (max-width:760px){
  :root{
    --sc-mobile-gutter:12px;
    --sc-mobile-radius:20px;
    --sc-mobile-touch:44px;
  }
  html{
    -webkit-text-size-adjust:100%;
    text-size-adjust:100%;
    scroll-padding-bottom:104px;
    overflow-x:hidden;
  }
  body{
    width:100%;
    max-width:100%;
    overflow-x:hidden!important;
    overscroll-behavior-x:none;
  }
  *,*::before,*::after{box-sizing:border-box}
  img,video,canvas,svg,iframe{max-width:100%}
  img,video{height:auto}
  iframe{border:0}
  button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
  button,.btn,[role="button"]{touch-action:manipulation}
  input,select,textarea{font-size:16px!important;max-width:100%}
  textarea{resize:vertical}

  /* Global content gutters */
  .shell,.wrap,.container,.page-shell,.content-shell{
    width:calc(100% - (var(--sc-mobile-gutter) * 2))!important;
    max-width:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  main{max-width:100%}

  /* Headers */
  .top,.topbar,.site-header{max-width:100vw}
  .top-inner,.topbar-inner,.header-inner,.nav{
    min-width:0;
  }
  .brand,.brand-text,.brand-copy{min-width:0}
  .brand h1,.brand-text strong,.brand-copy strong{overflow:hidden;text-overflow:ellipsis}
  .top-actions,.nav-actions{gap:6px!important}
  .top-actions .btn,.nav-actions .btn{min-height:40px;padding:8px 11px!important}
  .lang,.lang-switch,.assistant-lang,.sc-engine-lang{flex:0 0 auto}

  /* Route navigation behaves like a native pill rail */
  .sc-flow-nav,.sc-track-switch,.track-switch,.breadcrumb-row{
    width:calc(100% - 20px)!important;
    max-width:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
    display:flex!important;
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    justify-content:flex-start!important;
    gap:7px!important;
    padding-bottom:3px;
  }
  .sc-flow-nav::-webkit-scrollbar,.sc-track-switch::-webkit-scrollbar,.track-switch::-webkit-scrollbar,.breadcrumb-row::-webkit-scrollbar{display:none}
  .sc-flow-nav>a,.sc-track-switch>*{flex:0 0 auto;min-height:38px}

  /* Common panels */
  .hero,.hero-panel,.hero-card,.section,.roadmap-section,.card,.gate-card,.collection,.footer-private{
    max-width:100%;
  }
  .hero,.hero-panel,.hero-card{border-radius:22px!important}
  .section,.roadmap-section,.card,.collection{border-radius:20px!important}
  .hero-grid,.video-layout,.theory-grid,.action-grid,.snake-grid,.footer-private-grid,
  .profile-layout,.coach-profile-layout,.assessment-grid,.sc-summary-grid,.sc-report-grid{
    grid-template-columns:minmax(0,1fr)!important;
  }
  .section-head,.roadmap-head,.engine-map-heading,.collection-head{
    align-items:flex-start!important;
  }
  .hero h1,.hero h2,.hero-panel h1,.hero-panel h2{overflow-wrap:anywhere}
  .hero-actions{gap:8px!important}
  .hero-actions .btn{min-height:44px}

  /* Dense grids: default to readable mobile cards */
  .grid-4,.grid-3,.grid-2,.finance-grid-2,.finance-grid-3,.tracking-grid,.sc6-general-grid,.sc6-module-grid,.sc6-skills-grid{
    grid-template-columns:minmax(0,1fr)!important;
  }
  .drill-grid,.standards{grid-template-columns:minmax(0,1fr)!important}
  .checkpoint,.drill-card,.info-card,.summary-card,.plan-item,.profile-item,.block-item{min-width:0}

  /* Forms and controls */
  .field,.input-row,.form-row,.form-grid{min-width:0}
  input,select,textarea,.input{width:100%;min-height:46px}
  button,.btn{min-height:var(--sc-mobile-touch)}
  .btn-small{min-height:40px}
  .modal-actions,.card-actions,.finance-actions,.sc17-card-actions{gap:8px!important}

  /* Media/video cards */
  .video-box,.mini-video,.drill-video,.theory-video,.video,.assessment-play{
    width:100%!important;
    max-width:100%!important;
  }
  .video-box iframe,.mini-video iframe,.drill-video iframe,.theory-video iframe,.video iframe{width:100%!important;height:100%!important}

  /* Horizontal learning/map rails */
  .mini-map,.modules-row,.meta-row,.badge-row,.status-tabs{
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
  }
  .modules-row{scroll-snap-type:x mandatory;scroll-padding-left:2px}
  .module-card{scroll-snap-align:start}

  /* Modals: fit inside the real mobile viewport */
  .modal-backdrop{padding:8px!important;align-items:center}
  .modal,.modal-card,.intro-video-box,.gate-card{
    width:min(100%,680px)!important;
    max-width:100%!important;
    max-height:calc(100svh - 16px)!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch;
    border-radius:22px!important;
  }
  .modal-head{position:sticky;top:0;z-index:4;backdrop-filter:blur(12px)}

  /* Tables never force the viewport wider */
  .table-scroll,.table-wrap,.coaching-table-desktop{max-width:100%;overflow-x:auto!important;-webkit-overflow-scrolling:touch}
  table{max-width:100%}

  /* Footer */
  .footer-private{padding:24px 18px 18px!important;border-radius:24px!important}
  .footer-private-grid{gap:24px!important}
  .footer-private-bottom{margin-top:24px!important;padding-top:16px!important}

  /* Bottom navigation: safe-area aware and thumb friendly */
  .bottom-nav{
    width:calc(100% - 16px)!important;
    bottom:calc(8px + env(safe-area-inset-bottom))!important;
    border-radius:22px!important;
    padding:6px!important;
    gap:3px!important;
  }
  .bottom-nav .nav-btn{min-width:0;min-height:50px;padding:7px 3px!important;font-size:9px!important;line-height:1.05}
  .bottom-nav .nav-btn span{font-size:18px!important;margin-bottom:2px!important}

  /* Track pages */
  .engine-page .topbar .nav,.bar-skills-page .topbar .nav,.bmu-page .topbar .nav{gap:8px!important}
  .engine-page .brand-text span,.bar-skills-page .brand-text span,.bmu-page .brand-text span{display:none}
  .engine-page .nav-actions,.bar-skills-page .nav-actions,.bmu-page .nav-actions{flex-wrap:nowrap!important;overflow-x:auto;scrollbar-width:none}
  .engine-page .nav-actions::-webkit-scrollbar,.bar-skills-page .nav-actions::-webkit-scrollbar,.bmu-page .nav-actions::-webkit-scrollbar{display:none}
  .engine-page .hero-content,.bar-skills-page .hero-content,.bmu-page .hero-content{padding:18px!important}
  .engine-page .hero-visual,.bar-skills-page .hero-visual,.bmu-page .hero-visual{min-height:160px!important}

  /* Blocks */
  .checkpoint-actions{display:grid!important;grid-template-columns:1fr 1fr!important}
  .checkpoint-actions .btn{width:100%}
  .instruction-card{grid-column:auto!important;min-height:auto!important;padding:20px 16px!important}
  .drill-step{min-width:0}

  /* Assistant Coach */
  .page{max-width:100%!important}
  .assistant-lang{max-width:100%;overflow-x:auto;scrollbar-width:none}
  .assistant-lang::-webkit-scrollbar{display:none}
  .message{max-width:92%!important}
  .input-row{grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important}

  /* Drops */
  .reward-toggle{min-height:58px!important}
  .reward-body{min-width:0}

  /* Coaching CRM */
  .login-wrap{padding:12px!important}
  .login-card{width:100%!important;max-width:520px!important;padding:22px!important;border-radius:24px!important}
  .app{max-width:100vw!important;overflow-x:hidden!important}
  .sidebar{max-width:100vw!important}
  .sidebar .nav{gap:7px!important}
  .sidebar .nav button,.sidebar .nav a{min-height:46px!important}
  .main{max-width:100vw!important}
  .topbar{gap:10px!important}
  .topbar .top-actions{flex-wrap:wrap!important}
  .sc-item{grid-template-columns:auto minmax(0,1fr)!important}
  .sc-item-actions{grid-column:1/-1!important;justify-content:flex-start!important;max-width:none!important}
  .sc-item-actions .btn{flex:1 1 130px}
  .sc-mobile-grid{grid-template-columns:minmax(0,1fr)!important}

  /* Marketing/login page */
  .site-header .nav{width:calc(100% - 20px)!important}
  .site-header .nav-links{display:none!important}
  .site-header .menu-toggle{display:inline-flex!important}
  .hero-grid,.problem-grid,.compare,.pricing-grid,.features-grid,.footer-grid{grid-template-columns:minmax(0,1fr)!important}

  /* Hub V3 · preserve approved 3 + 2 composition on phones */
  #quickActions.quick{display:block!important;overflow:visible!important}
  #quickActions .sc-quick-primary{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
    overflow:visible!important;
    padding:0!important;
  }
  #quickActions .sc-qa-card{
    min-width:0!important;
    min-height:124px!important;
    padding:9px!important;
    border-radius:16px!important;
  }
  #quickActions .sc-qa-top{display:block!important}
  #quickActions .sc-qa-kicker{font-size:6.5px!important;letter-spacing:.09em!important;white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis}
  #quickActions .sc-qa-status{display:none!important}
  #quickActions .sc-qa-copy{padding-top:24px!important}
  #quickActions .sc-qa-copy strong{font-size:13px!important;line-height:1.05!important;overflow-wrap:anywhere}
  #quickActions .sc-qa-copy small{display:none!important}
  #quickActions .sc-quick-secondary{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    margin-top:8px!important;
  }
  #quickActions .sc-qa-wide{
    min-width:0!important;
    min-height:86px!important;
    padding:11px!important;
    border-radius:17px!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:7px!important;
    align-content:space-between!important;
  }
  #quickActions .sc-qa-wide-copy strong{font-size:15px!important;white-space:normal!important;line-height:1.05!important}
  #quickActions .sc-qa-wide-copy em{display:none!important}
  #quickActions .sc-qa-wide-cta{justify-self:start!important;padding:6px 8px!important;font-size:8px!important}
  #homeQuickActionsSection .section-head{margin-bottom:9px!important}

  /* Hub data density */
  .sc-home-pulse-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .sc-home-pulse-metric{min-width:0!important;padding:11px!important}
  .sc-home-pulse-metric strong{font-size:21px!important}
  .sc-home-community-feed{grid-template-columns:minmax(0,1fr)!important}
  .sc-health-mini{width:100%!important}
  #homeTracksSection .module-card{min-width:min(78vw,270px)!important}

  /* Profile / Continuum */
  #continuumSection{padding:16px!important}
  .continuum-head{display:grid!important;gap:10px!important}
  .continuum-scale{overflow-x:auto!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .continuum-scale::-webkit-scrollbar{display:none}
}

@media (max-width:430px){
  :root{--sc-mobile-gutter:10px}
  .brand h1{font-size:17px!important}
  .brand span{font-size:8px!important}
  .mark{width:38px!important;height:38px!important;min-width:38px!important;border-radius:12px!important}
  .hero,.hero-panel,.hero-card{padding:15px!important}
  .section,.roadmap-section{padding:14px!important}
  .section h3,.roadmap-head h3{font-size:24px!important}
  .hero h1,.hero h2,.hero-panel h1,.hero-panel h2{font-size:clamp(32px,10vw,44px)!important}
  .hero p,.hero-panel p{font-size:14px!important;line-height:1.48!important}
  .stats{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
  .stat{padding:10px!important;border-radius:15px!important}
  .stat strong{font-size:19px!important}
  .stat span{font-size:9px!important}
  .module-card{min-width:min(82vw,285px)!important}
  .modal-actions{display:grid!important;grid-template-columns:1fr!important}
  .modal-actions .btn{width:100%}
  .footer-private a,.footer-private button{font-size:16px!important}
  .sc-flow-nav{width:calc(100% - 12px)!important}

  /* Keep Hub quick actions aligned even on narrow phones */
  #quickActions .sc-quick-primary{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important}
  #quickActions .sc-qa-card{min-height:112px!important;padding:8px!important;border-radius:14px!important}
  #quickActions .sc-qa-copy strong{font-size:12px!important}
  #quickActions .sc-quick-secondary{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
  #quickActions .sc-qa-wide{min-height:82px!important;padding:10px!important}
  #quickActions .sc-qa-wide-copy small{font-size:6.5px!important}
  #quickActions .sc-qa-wide-copy strong{font-size:14px!important}
}

@media (max-width:360px){
  #quickActions .sc-qa-kicker{display:none!important}
  #quickActions .sc-qa-card{min-height:104px!important}
  #quickActions .sc-qa-copy{padding-top:18px!important}
  #quickActions .sc-qa-copy strong{font-size:11px!important}
  .bottom-nav .nav-btn{font-size:8px!important}
}

@media (max-width:760px){
  /* Hub Assistant Coach · mobile viewport + keyboard-safe */
  .sc-ac-overlay{padding:6px!important;align-items:flex-end!important;justify-content:center!important}
  .sc-ac-modal{width:100%!important;max-width:100%!important;max-height:calc(100svh - 12px)!important;border-radius:24px!important}
  .sc-ac-header{padding:16px!important}
  .sc-ac-body{padding:18px 14px 16px!important}
  .sc-ac-footer{padding:12px!important;padding-bottom:calc(12px + env(safe-area-inset-bottom))!important}
  .sc-ac-input-box{grid-template-columns:minmax(0,1fr) 70px!important;gap:7px!important;border-radius:18px!important}
  #scAcInput{font-size:16px!important;min-height:48px!important;padding:11px!important}
  #scAcSend{min-height:48px!important;border-radius:14px!important}
  .sc-ac-limit{font-size:10px!important;margin-top:8px!important}
  .sc-ac-launcher{right:10px!important;bottom:calc(76px + env(safe-area-inset-bottom))!important;width:48px!important;height:48px!important;padding:5px!important;justify-content:center!important}
  .sc-ac-launcher-avatar{width:36px!important;height:36px!important}
}


/* =========================================================
   SkillCraft Hub · Mobile stability patch V4 · 2026-08-13
   Fixes My activity cockpit, footer/bottom-nav overlap and dense
   mobile spacing without changing desktop layout.
========================================================= */
@media (max-width:760px){
  /* Always leave a real scroll-safe zone above the fixed tab bar. */
  .app > main.shell{
    padding-bottom:calc(118px + env(safe-area-inset-bottom))!important;
  }

  /* My activity: a late desktop rule was re-introducing two columns.
     Force the cockpit back to a genuine one-column mobile layout. */
  #screen-plan .plan-progress-dashboard{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:10px!important;
    margin-bottom:10px!important;
    min-width:0!important;
  }
  #screen-plan .plan-overview-hero{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:10px!important;
    padding:15px!important;
    border-radius:22px!important;
    min-width:0!important;
    overflow:hidden!important;
  }
  #screen-plan .plan-overview-main,
  #screen-plan .plan-now-card,
  #screen-plan .plan-data-card{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
  #screen-plan .plan-overview-main h4{
    font-size:clamp(27px,8.7vw,34px)!important;
    line-height:.98!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  #screen-plan .plan-overview-main>p{
    font-size:11.5px!important;
    line-height:1.5!important;
  }
  #screen-plan .plan-kpis{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    margin-top:13px!important;
  }
  #screen-plan .plan-kpi{
    min-width:0!important;
    padding:10px!important;
    border-radius:15px!important;
  }
  #screen-plan .plan-kpi small{
    font-size:7px!important;
    line-height:1.15!important;
    letter-spacing:.07em!important;
  }
  #screen-plan .plan-kpi strong{font-size:20px!important}
  #screen-plan .plan-kpi span{font-size:8.5px!important}
  #screen-plan .plan-now-card{
    min-height:138px!important;
    padding:13px!important;
    border-radius:18px!important;
  }
  #screen-plan .plan-now-card h5{
    font-size:20px!important;
    line-height:1.08!important;
  }
  #screen-plan .plan-now-card p{
    font-size:10.5px!important;
    line-height:1.45!important;
  }
  #screen-plan .plan-now-foot{
    font-size:8.5px!important;
    gap:6px!important;
  }
  #screen-plan .plan-dashboard-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:10px!important;
    min-width:0!important;
  }
  #screen-plan .plan-data-card{
    padding:13px!important;
    border-radius:19px!important;
  }
  #screen-plan .plan-card-head{
    gap:8px!important;
    margin-bottom:10px!important;
  }
  #screen-plan .plan-card-head h5{
    font-size:17px!important;
    line-height:1.08!important;
  }
  #screen-plan .plan-card-head>span{
    flex:0 0 auto!important;
    padding:5px 7px!important;
    font-size:7.5px!important;
  }
  #screen-plan .plan-strength-layout{
    grid-template-columns:78px minmax(0,1fr)!important;
    gap:10px!important;
  }
  #screen-plan .plan-ring{width:76px!important;height:76px!important}
  #screen-plan .plan-ring-content strong{font-size:18px!important}
  #screen-plan .plan-strength-copy h6{font-size:15px!important}
  #screen-plan .plan-strength-copy p{font-size:10px!important;margin:4px 0 9px!important}
  #screen-plan .plan-strength-meta{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px!important;
  }
  #screen-plan .plan-strength-meta div:last-child{grid-column:auto!important}
  #screen-plan .plan-strength-meta div{padding:7px!important;min-width:0!important}
  #screen-plan .plan-strength-meta small{font-size:6.5px!important}
  #screen-plan .plan-strength-meta b{font-size:10px!important}
  #screen-plan .plan-gamification-grid{gap:6px!important}
  #screen-plan .plan-game-stat{padding:9px!important}
  #screen-plan .plan-trend-chart{height:84px!important}
  #screen-plan .plan-trend-stats,
  #screen-plan .plan-improvement-row{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px!important;
  }
  #screen-plan .plan-trend-stats>div:last-child,
  #screen-plan .plan-improvement-row>div:last-child{grid-column:auto!important}
  #screen-plan .plan-trend-stat,
  #screen-plan .plan-improvement{padding:7px!important;min-width:0!important}
  #screen-plan .plan-footprint-row{
    grid-template-columns:31px minmax(0,1fr) auto!important;
    gap:8px!important;
  }
  #screen-plan .plan-live-actions{padding-top:12px!important}
  #screen-plan .plan-live-actions-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }
  #screen-plan .plan-live-action{
    min-height:80px!important;
    padding:9px!important;
    border-radius:15px!important;
  }
  #screen-plan .plan-live-action-copy b{
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    font-size:10.5px!important;
  }
  #screen-plan .plan-live-action-copy span{font-size:8.5px!important}

  /* Hub footer: the fixed bottom navigation already supplies app navigation.
     Remove duplicated footer menus on phones and keep the brand as a compact end-cap. */
  .hub-footer{
    margin-top:26px!important;
    margin-bottom:calc(18px + env(safe-area-inset-bottom))!important;
    border-radius:22px!important;
  }
  .hub-footer .footer-main{
    display:block!important;
    padding:22px 20px!important;
  }
  .hub-footer .footer-col{display:none!important}
  .hub-footer .footer-brand-row{margin-bottom:12px!important}
  .hub-footer .footer-brand-row .footer-private-title strong{
    font-size:30px!important;
    line-height:.92!important;
  }
  .hub-footer .footer-brand-row .footer-private-title span{
    margin-top:9px!important;
    font-size:8px!important;
    letter-spacing:.18em!important;
  }
  .hub-footer .footer-brand p{
    max-width:320px!important;
    font-size:12px!important;
    line-height:1.5!important;
  }
  .hub-footer .footer-bottom{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:8px!important;
    padding:12px 20px!important;
    font-size:9px!important;
  }
  .hub-footer .footer-bottom span:first-child{font-size:9px!important}

  /* Floating utilities: smaller and parked above the tab bar. */
  .sc-pr-floating-launcher{
    right:9px!important;
    bottom:calc(142px + env(safe-area-inset-bottom))!important;
    width:42px!important;
    height:42px!important;
    padding:4px!important;
  }
  .sc-pr-floating-icon{width:32px!important;height:32px!important;flex-basis:32px!important}
  .sc-ac-launcher{
    right:9px!important;
    bottom:calc(91px + env(safe-area-inset-bottom))!important;
    width:42px!important;
    height:42px!important;
  }
}

@media (max-width:430px){
  #screen-plan .plan-section-head{
    align-items:flex-start!important;
    gap:7px!important;
  }
  #screen-plan .plan-head-summary{display:none!important}
  #screen-plan .plan-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #screen-plan .plan-strength-layout{
    grid-template-columns:70px minmax(0,1fr)!important;
  }
  #screen-plan .plan-ring{width:68px!important;height:68px!important}
  #screen-plan .plan-strength-meta{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  #screen-plan .plan-live-actions-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #screen-plan .plan-live-action{
    grid-template-columns:26px minmax(0,1fr)!important;
    gap:6px!important;
  }
  #screen-plan .plan-live-action-icon{width:26px!important;height:26px!important}
}

/* =========================================================
   SkillCraft · Mobile First Final Polish · 2026-08-24
   Final authority below 760px. Desktop is deliberately untouched.
========================================================= */
@media (max-width:760px){
  :root{
    --sc-mobile-gutter:14px;
    --sc-mobile-gap:12px;
    --sc-mobile-radius:18px;
    --sc-mobile-touch:44px;
  }

  html{scroll-padding-top:72px;scroll-padding-bottom:110px}
  body{font-size:14px;line-height:1.45}
  body,main,.main,.app,.screen,.section{min-width:0}
  img,video,iframe,svg{max-width:100%!important}
  button,a,input,select,textarea{max-width:100%}

  /* Consistent phone gutters */
  .shell,.wrap,.container,.page-shell,.content-shell{
    width:calc(100% - 28px)!important;
    max-width:none!important;
  }
  main.shell,.main{padding-left:0!important;padding-right:0!important}

  /* ---------- Headers: slim, one line, no visual noise ---------- */
  .top,.topbar,.site-header,.sc-bs-ref-header{
    min-height:0!important;
    background-color:rgba(5,5,5,.96)!important;
    backdrop-filter:blur(16px);
  }
  .top>.shell.top-inner,
  .topbar>.shell.nav,
  .site-header>.wrap.nav,
  .sc-bs-ref-header__inner{
    min-height:60px!important;
    width:calc(100% - 24px)!important;
    margin:0 auto!important;
    padding:8px 0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    flex-wrap:nowrap!important;
    min-width:0!important;
  }
  .top .brand.sc-brand-link,.topbar .brand.sc-brand-link,.site-header .brand.sc-brand-link,.sc-bs-ref-brand.sc-brand-link{
    flex:1 1 auto!important;
    min-width:0!important;
    gap:9px!important;
  }
  .sc-brand-lockup-header{
    width:auto!important;
    height:30px!important;
    max-height:30px!important;
    max-width:168px!important;
    object-fit:contain!important;
    object-position:left center!important;
  }
  .sc-brand-context{font-size:7.5px!important;padding-left:9px!important;min-height:24px!important;letter-spacing:.08em!important}
  .top-actions,.nav-actions,.sc-bs-ref-actions{
    flex:0 1 auto!important;
    display:flex!important;
    flex-wrap:nowrap!important;
    gap:6px!important;
    min-width:0!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
  }
  .top-actions::-webkit-scrollbar,.nav-actions::-webkit-scrollbar,.sc-bs-ref-actions::-webkit-scrollbar{display:none}
  .top-actions .btn,.nav-actions .btn,.sc-bs-ref-actions .btn{
    min-height:38px!important;
    height:38px!important;
    padding:7px 10px!important;
    border-radius:12px!important;
    font-size:9px!important;
    white-space:nowrap!important;
    flex:0 0 auto!important;
  }
  .language-widget-header{min-width:0!important;max-width:148px!important;min-height:40px!important;padding:0 9px!important;border-radius:14px!important}
  .language-widget-header select,.lang{font-size:12px!important;min-height:38px!important;padding:0 22px 0 4px!important}

  /* Secondary route nav: horizontal rail instead of wrapping */
  .sc-flow-nav,.sc-track-switch,.track-switch,.breadcrumb-row,.sc-bs-ref-nav{
    width:calc(100% - 20px)!important;
    margin-left:auto!important;margin-right:auto!important;
    padding:7px 0 4px!important;
    display:flex!important;
    flex-wrap:nowrap!important;
    gap:6px!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none!important;
  }
  .sc-flow-nav::-webkit-scrollbar,.sc-track-switch::-webkit-scrollbar,.track-switch::-webkit-scrollbar,.breadcrumb-row::-webkit-scrollbar,.sc-bs-ref-nav::-webkit-scrollbar{display:none}
  .sc-flow-nav>a,.sc-flow-nav>button,.sc-bs-ref-nav>a,.sc-bs-ref-nav>button{flex:0 0 auto!important;min-height:36px!important;padding:8px 10px!important;font-size:9px!important;white-space:nowrap!important}

  /* ---------- Typography + vertical rhythm ---------- */
  .hero,.hero-panel,.hero-card{padding:16px!important;border-radius:20px!important}
  .hero h1,.hero-panel h1,.journey-hero h1{font-size:clamp(34px,10.5vw,44px)!important;line-height:.98!important;letter-spacing:-.055em!important}
  .hero h2,.hero-panel h2{font-size:clamp(30px,9.2vw,40px)!important;line-height:1!important}
  .hero p,.hero-panel p,.journey-hero p{font-size:13px!important;line-height:1.52!important}
  .section,.roadmap-section,.card{padding:14px!important;border-radius:18px!important}
  .section-head{gap:8px!important;margin-bottom:11px!important}
  .section-head h3{font-size:22px!important;line-height:1.05!important;letter-spacing:-.035em!important}
  .section-head small,.section-head p{font-size:10px!important;line-height:1.4!important}

  /* ---------- Hub: prioritize progress, remove unnecessary density ---------- */
  #appView>.top{min-height:60px!important}
  #appView>.top>.shell{min-height:60px!important}
  #appView>.top .brand img{height:30px!important;max-height:30px!important;max-width:168px!important}
  #appView main.shell{padding-top:12px!important;padding-bottom:calc(112px + env(safe-area-inset-bottom))!important}
  #screen-inicio .hero-card{padding:15px!important}
  #screen-inicio .hero-top{gap:10px!important;align-items:flex-start!important}
  #screen-inicio .hero-top h2{font-size:28px!important;margin-top:5px!important}
  #screen-inicio .hero-top p{font-size:11px!important}
  #screen-inicio .week{padding:8px 10px!important;border-radius:13px!important;font-size:9px!important}
  #screen-inicio .stats{gap:6px!important;margin-top:11px!important}
  #screen-inicio .stat{padding:9px 6px!important;min-height:66px!important}
  #screen-inicio .stat strong{font-size:18px!important}
  #screen-inicio .stat span{font-size:8px!important;line-height:1.2!important}
  #screen-inicio .roadmap-panel{padding:10px!important;border-radius:18px!important;overflow:hidden!important}
  #adaptiveRoadmapTrack{display:flex!important;overflow-x:auto!important;gap:8px!important;scroll-snap-type:x mandatory;padding-bottom:4px!important;scrollbar-width:none!important}
  #adaptiveRoadmapTrack::-webkit-scrollbar{display:none}
  #adaptiveRoadmapTrack .road-step{flex:0 0 min(72vw,255px)!important;min-height:142px!important;padding:13px!important;border-radius:17px!important;scroll-snap-align:start}
  #adaptiveRoadmapTrack .road-step h4{font-size:17px!important}
  #adaptiveRoadmapTrack .road-step p{font-size:10px!important}

  /* Track catalog: support cards compact, paths swipeable */
  #screen-modulos .sc-product-stack{grid-template-columns:1fr!important;gap:8px!important;margin-bottom:17px!important}
  #screen-modulos .sc-method-card,#screen-modulos .sc-foundation-card{
    min-height:128px!important;height:auto!important;padding:13px 14px!important;border-radius:17px!important;
  }
  #screen-modulos .sc-method-top,#screen-modulos .sc-foundation-top{min-height:20px!important;margin-bottom:8px!important}
  #screen-modulos .sc-method-copy h4,#screen-modulos .sc-foundation-copy h4{font-size:22px!important;min-height:22px!important}
  #screen-modulos .sc-method-copy p,#screen-modulos .sc-foundation-copy p{font-size:10px!important;min-height:0!important;margin-top:6px!important;line-height:1.38!important}
  #screen-modulos .sc-overview-meta{margin-top:7px!important;font-size:7.5px!important}
  #screen-modulos .sc-method-foot,#screen-modulos .sc-foundation-foot{margin-top:9px!important}
  #screen-modulos .sc-product-action{min-height:38px!important;padding:8px 11px!important}
  .sc-level-stack{gap:18px!important}
  .sc-level-head{min-height:56px!important;padding:8px!important;border-radius:14px!important;gap:9px!important}
  .sc-level-number{width:36px!important;height:36px!important;border-radius:10px!important}
  .sc-level-copy h4{font-size:16px!important}.sc-level-copy p{font-size:8px!important;line-height:1.3!important}
  .sc-level-head-actions{padding-top:7px!important;gap:6px!important}
  .sc-level-unlock,.sc-level-complete-badge{min-height:36px!important;padding:7px 9px!important}
  .sc-path-shell{padding-top:9px!important}
  .sc-path-line{display:none!important}
  .sc-path-row{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,84vw))!important;
    gap:9px!important;
    overflow-x:auto!important;
    padding:0 2px 8px!important;
    scroll-snap-type:x mandatory;
    scrollbar-width:none!important;
  }
  .sc-path-row::-webkit-scrollbar{display:none}
  .sc-path-card,.sc-path-mystery{min-height:230px!important;padding:12px!important;border-radius:17px!important;scroll-snap-align:start!important}
  .sc-path-node{width:37px!important;height:37px!important;margin-bottom:13px!important;border-radius:11px!important;font-size:15px!important}
  .sc-path-card h5{font-size:18px!important;min-height:auto!important}
  .sc-path-resume{margin-top:12px!important;padding:9px 0!important}
  .sc-path-resume strong{min-height:0!important;font-size:9.5px!important}
  .sc-path-actions{padding-top:10px!important;gap:5px!important}
  .sc-path-main{min-height:40px!important;padding:9px!important}

  /* Announcements: media first, concise actions */
  .sc-hub-announcements{padding:12px!important;border-radius:18px!important}
  .sc-hub-ann-head{gap:8px!important}.sc-hub-ann-head h3{font-size:20px!important}
  .sc-hub-ann-card{flex-basis:94%!important;border-radius:18px!important}
  .sc-hub-ann-copy{padding:27px 13px 13px!important;gap:12px!important}
  .sc-hub-ann-copy h4{font-size:20px!important}.sc-hub-ann-copy p{font-size:11.5px!important;line-height:1.45!important}
  .sc-hub-ann-links{gap:6px!important}.sc-hub-ann-open,.sc-hub-ann-more{min-height:40px!important;padding:9px!important;font-size:9px!important}

  /* Bottom app navigation: visually quiet */
  .bottom-nav{
    width:calc(100% - 16px)!important;
    max-width:520px!important;
    min-height:62px!important;
    bottom:calc(7px + env(safe-area-inset-bottom))!important;
    padding:5px!important;
    border-radius:19px!important;
    background:rgba(12,12,12,.96)!important;
    backdrop-filter:blur(18px)!important;
  }
  .bottom-nav .nav-btn{min-height:50px!important;padding:6px 2px!important;font-size:8px!important;border-radius:14px!important}
  .bottom-nav .nav-btn svg{width:18px!important;height:18px!important}

  /* Hub footer is an end-cap on mobile, not a second navigation system */
  #appView .hub-footer{margin:22px 0 10px!important;border-radius:19px!important}
  #appView .hub-footer .footer-main{display:block!important;padding:18px 16px!important}
  #appView .hub-footer .footer-col{display:none!important}
  #appView .hub-footer .footer-brand-row{margin-bottom:9px!important}
  #appView .hub-footer .footer-brand-row img{height:38px!important;max-height:38px!important;max-width:205px!important}
  #appView .hub-footer .footer-brand p{font-size:11px!important;line-height:1.45!important;max-width:310px!important}
  #appView .hub-footer .footer-bottom{display:flex!important;flex-wrap:wrap!important;gap:5px 10px!important;padding:11px 16px!important;font-size:8.5px!important}

  /* ---------- Track journeys: one clear next step ---------- */
  .engine-journey,.bar-skills-journey,.bmu-journey{padding-top:12px!important}
  .journey-hero{display:block!important;padding:12px 0 19px!important}
  .journey-kicker{font-size:9px!important;letter-spacing:.13em!important}.journey-kicker:before{width:18px!important}
  .journey-hero h1{margin:10px 0 10px!important;font-size:clamp(34px,10.5vw,43px)!important}
  .journey-hero p{font-size:12.5px!important;line-height:1.5!important}
  .journey-summary-strip{gap:8px!important;margin-top:12px!important}
  .journey-summary-chip{font-size:8.5px!important;gap:5px!important}
  .journey-next{margin-top:15px!important;padding:4px 0 4px 12px!important}
  .journey-next small{font-size:8px!important;margin-bottom:4px!important}.journey-next strong{font-size:18px!important}.journey-next span{font-size:10.5px!important;margin-top:4px!important}
  .journey-layout{padding-top:17px!important}
  .journey-route-head{margin-bottom:10px!important}.journey-route-head>span{font-size:8.5px!important}.journey-route-head>small{display:none!important}

  /* The two permanent support cards stay above the route and remain compact */
  .parallel-panel{grid-template-columns:1fr!important;gap:8px!important;margin:16px 0 3px!important}
  .parallel-head{display:block!important;padding:0 1px 2px!important}.parallel-head span{font-size:8.5px!important}.parallel-head h3{font-size:19px!important;margin:5px 0 3px!important}.parallel-head p{font-size:10px!important;text-align:left!important;line-height:1.4!important}
  .parallel-card{padding:13px!important;border-radius:16px!important}.parallel-card h4{font-size:18px!important;margin:7px 0 4px!important}.parallel-card>p{font-size:10.5px!important;line-height:1.4!important}
  .parallel-resume{margin-top:9px!important;padding:9px!important}.parallel-resume strong{font-size:10px!important}.parallel-card .route-btn{margin-top:9px!important}

  .engine-route{gap:9px!important;padding-left:36px!important}.engine-route:before{left:12px!important;top:24px!important;bottom:24px!important}
  .route-node{left:-36px!important;top:16px!important;width:27px!important;height:27px!important;font-size:8.5px!important;box-shadow:0 0 0 4px #060606!important}
  .route-card{padding:12px!important;border-radius:16px!important}.route-card-head{display:grid!important;grid-template-columns:1fr!important;gap:7px!important}
  .route-block-label{font-size:7.5px!important;margin-bottom:3px!important}.route-title{font-size:19px!important}.route-description{font-size:10.5px!important;line-height:1.43!important;margin-top:5px!important}
  .route-state{padding:5px 8px!important;font-size:7.5px!important;gap:5px!important;width:max-content!important}
  .route-signals{grid-template-columns:1fr!important;gap:5px!important;margin-top:9px!important}.route-signal{min-height:36px!important;padding:7px 8px!important;border-radius:10px!important}.route-signal>span,.route-signal>b{font-size:9px!important}
  .route-actions{margin-top:9px!important;padding-top:9px!important;display:grid!important;gap:7px!important}.route-actions-left{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;gap:6px!important}.route-btn{min-height:40px!important;padding:8px 9px!important;font-size:9px!important}.route-lock-note{font-size:9px!important;text-align:left!important}

  /* POP / videos: avoid giant poster cards on a phone */
  .performance-list,.bmu-performance-list{grid-template-columns:1fr!important;gap:9px!important}
  .performance-card,.bmu-performance-row{border-radius:17px!important}
  .performance-cover{min-height:220px!important;padding:13px!important}
  .performance-cover h4{font-size:19px!important}
  .performance-actions{gap:6px!important}.performance-actions button,.performance-actions .btn{min-height:40px!important;padding:8px 10px!important;font-size:9px!important}
  .performance-expanded-head{padding:10px!important;gap:8px!important}.performance-panel{padding:9px!important}
  .performance-drill,.bmu-drill-card{border-radius:13px!important;padding:9px!important}
  .sc-pop-video-modal{padding:8px!important}.sc-pop-video-shell{border-radius:16px!important}

  /* Checkpoints & exercise cards */
  .checkpoint,.checkpoint-card,.bmu-checkpoint,.session-row,.milestone-card{border-radius:16px!important}
  .checkpoint-actions{grid-template-columns:1fr 1fr!important;gap:6px!important}
  .checkpoint-actions .btn{min-height:40px!important;padding:8px!important;font-size:9px!important}
  .bmu-checkpoint-grid,.drill-grid,.weeks-grid,.test-grid,.phase-strip{gap:9px!important}

  /* ---------- Coaching CRM: phone behaves like an app ---------- */
  body.coaching-app,body:has(.app:not(.hidden)){padding-bottom:calc(88px + env(safe-area-inset-bottom))!important}
  .mobile-admin-header{padding:calc(8px + env(safe-area-inset-top)) 11px 8px!important;min-height:56px!important}
  .mobile-admin-header strong{font-size:14px!important}.mobile-admin-header span{font-size:9.5px!important;max-width:145px!important}
  .crm-install-header-btn{min-height:36px!important;padding:7px 9px!important;font-size:9px!important}
  .sidebar{width:calc(100% - 14px)!important;bottom:calc(6px + env(safe-area-inset-bottom))!important;padding:5px!important;border-radius:19px!important}
  .sidebar .nav{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:3px!important}
  .sidebar .nav button{min-height:52px!important;padding:5px 2px!important;border-radius:13px!important;font-size:8px!important}
  .main{padding:10px 10px 96px!important}
  .topbar{padding:12px!important;border-radius:18px!important;margin-bottom:10px!important;gap:8px!important}
  .topbar h2{font-size:23px!important}.topbar p{font-size:10.5px!important;line-height:1.4!important}
  .top-actions{gap:6px!important}.top-actions .btn{min-height:40px!important;font-size:9px!important}
  #kpiGrid,#financeKpis,#leadKpis{gap:7px!important}.kpi{min-height:82px!important;padding:10px!important;border-radius:15px!important}.kpi .value{font-size:19px!important}.kpi .label,.kpi .sub{font-size:9px!important}
  .card{padding:11px!important;border-radius:17px!important}.card-title h3{font-size:16px!important}.card-title p{font-size:10.5px!important}
  .crm-mobile-list{gap:8px!important}.crm-mobile-card{padding:11px!important;border-radius:16px!important}.crm-mobile-meta{gap:5px!important}.crm-mobile-meta div{padding:7px!important}.crm-mobile-actions{gap:5px!important}.crm-mobile-actions .btn{min-height:38px!important;font-size:9px!important}

  /* Client wizard: steps become a slim horizontal progress rail */
  .sc-client-wizard{grid-template-rows:auto auto minmax(0,1fr) auto!important}
  .scw-head{padding:13px 12px 10px!important;gap:10px!important}.scw-head-copy{gap:10px!important}.scw-mark{width:34px!important;height:34px!important;border-radius:10px!important}.scw-head h3{font-size:22px!important}.scw-head p{display:none!important}.scw-close{width:36px!important;height:36px!important;border-radius:11px!important}
  .scw-steps{display:flex!important;grid-template-columns:none!important;overflow-x:auto!important;gap:4px!important;padding:7px 9px!important;scroll-snap-type:x mandatory;scrollbar-width:none!important}.scw-steps::-webkit-scrollbar{display:none}.scw-step{flex:0 0 112px!important;scroll-snap-align:start;padding:7px!important}.scw-step b{font-size:7px!important}.scw-step span{font-size:8px!important}
  .scw-stage-wrap{padding:14px 12px 18px!important}.scw-stage-head{margin-bottom:14px!important;gap:7px!important}.scw-stage-head h4{font-size:27px!important}.scw-stage-head p{font-size:10.5px!important;line-height:1.45!important;margin-top:6px!important}
  .scw-grid{gap:9px!important}.scw-group,.scw-email-card{padding:12px!important;border-radius:15px!important}.scw-group-title{margin-bottom:9px!important}.scw-grid input,.scw-grid select,.scw-grid textarea{min-height:44px!important;border-radius:11px!important}.scw-grid textarea{min-height:82px!important}
  .scw-footer{padding:8px 9px calc(8px + env(safe-area-inset-bottom))!important;gap:6px!important;flex-wrap:nowrap!important}.scw-footer-side{gap:5px!important}.scw-footer .btn{min-height:42px!important;padding:8px!important;font-size:9px!important}.scw-footer .scw-next{min-width:112px!important}.scw-progress-copy,.scw-skip-note{display:none!important}

  /* Modals: bottom sheet, no wasted edge padding */
  .modal{align-items:flex-end!important;padding:6px!important}.modal-card,.modal,.sc-purchase-modal,.stats-sheet{max-width:100%!important}
  .modal-card{border-radius:21px 21px 12px 12px!important;padding:13px!important}
  .sc-purchase-backdrop{padding:8px!important;align-items:flex-end!important}.sc-purchase-modal{padding:17px!important;border-radius:21px!important;margin-bottom:env(safe-area-inset-bottom)}.sc-purchase-modal h3{font-size:24px!important}.sc-purchase-actions{display:grid!important;grid-template-columns:1fr!important}

  /* ---------- Footers outside Hub: useful but compact ---------- */
  .hub-footer{padding:0!important;margin-top:24px!important}
  .hub-footer-card{padding:18px 16px 0!important;border-radius:20px!important}
  .hub-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px 12px!important}
  .hub-footer-brand{grid-column:1/-1!important}.hub-footer-logo,.hub-footer-logo.sc-brand-footer-row{margin-bottom:10px!important}.hub-footer .sc-brand-lockup-footer{height:38px!important;max-height:38px!important;max-width:205px!important}
  .hub-footer-description{font-size:11px!important;line-height:1.45!important;margin-top:8px!important}.hub-footer-heading{font-size:8px!important;margin-bottom:10px!important}.hub-footer-links{gap:9px!important}.hub-footer-links a,.hub-footer-links button{font-size:12px!important;line-height:1.25!important}.hub-footer-bottom{gap:6px!important;padding:12px 0 14px!important;font-size:8.5px!important;flex-wrap:wrap!important}

  .footer-private{padding:18px 15px 15px!important;margin-top:25px!important;border-radius:20px!important}
  .footer-private-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px 12px!important}.footer-private-brand{grid-column:1/-1!important;margin-bottom:5px!important}.footer-private-brand .sc-brand-lockup-footer{height:38px!important;max-height:38px!important;max-width:205px!important}.footer-private-bottom{margin-top:16px!important;padding-top:12px!important;font-size:8.5px!important;flex-wrap:wrap!important}

  /* Marketing landing */
  .site-header .nav{min-height:60px!important}.site-header .nav-links{display:none!important}
  .hero{min-height:auto!important}.hero-grid{gap:22px!important}.hero-proof{padding:14px!important}.section-title{font-size:clamp(32px,10vw,44px)!important;line-height:1!important}.section-lead{font-size:14px!important;line-height:1.5!important}
  .mobile-cta{left:8px!important;right:8px!important;bottom:calc(8px + env(safe-area-inset-bottom))!important;border-radius:18px!important;padding:8px!important}
}

@media (max-width:430px){
  :root{--sc-mobile-gutter:10px}
  .shell,.wrap,.container,.page-shell,.content-shell{width:calc(100% - 20px)!important}
  .top>.shell.top-inner,.topbar>.shell.nav,.site-header>.wrap.nav,.sc-bs-ref-header__inner{width:calc(100% - 18px)!important;min-height:56px!important}
  .sc-brand-lockup-header{height:28px!important;max-height:28px!important;max-width:154px!important}
  .sc-brand-context{display:none!important}
  .language-widget-header{max-width:132px!important;padding:0 7px!important}.language-widget-header select,.lang{font-size:11px!important}
  .hero h1,.hero-panel h1,.journey-hero h1{font-size:clamp(32px,10.4vw,40px)!important}
  .section{padding:12px!important}
  .sc-path-row{grid-template-columns:repeat(5,minmax(0,88vw))!important}
  .sc-path-card,.sc-path-mystery{min-height:220px!important}
  .route-actions-left{grid-template-columns:1fr!important}
  .parallel-card{padding:12px!important}
  .performance-cover{min-height:205px!important}
  .hub-footer-grid,.footer-private-grid{grid-template-columns:1fr 1fr!important;gap:15px 10px!important}
  .hub-footer-links a,.hub-footer-links button{font-size:11px!important}
  .scw-step{flex-basis:104px!important}
  .scw-footer .btn{padding:7px!important;font-size:8px!important}.scw-footer .scw-next{min-width:102px!important}
}

@media (max-width:360px){
  .sc-brand-lockup-header{max-width:138px!important}
  .language-widget-header{max-width:118px!important}
  .bottom-nav .nav-btn{font-size:7px!important}
  .sc-path-row{grid-template-columns:repeat(5,minmax(0,91vw))!important}
  .route-card{padding:11px!important}.route-title{font-size:18px!important}
  .scw-step{flex-basis:96px!important}
}

@media (max-width:760px) and (orientation:landscape){
  .bottom-nav{max-width:620px!important}
  .modal-card,.sc-client-wizard-shell>.modal-card{max-height:100dvh!important}
  .scw-head{padding-top:8px!important;padding-bottom:7px!important}.scw-stage-wrap{padding-top:10px!important}
}