/* HOLiUS Mobile Design Final V1
   Final mobile-only guard layer. It does not redefine the desktop design system.
   Goals: 16px page gutters, >=12px helper text, >=44px touch targets,
   consistent home density, and unified Theme/Font picker behavior. */

@media (max-width:760px){
  :root{
    --holius-mobile-page-x:16px;
    --holius-mobile-section-gap:28px;
    --holius-mobile-card-pad:16px;
    --holius-mobile-touch:44px;
    --holius-mobile-meta:12px;
  }

  /* Global mobile rhythm */
  .container{
    width:min(calc(100% - (var(--holius-mobile-page-x) * 2)),1180px)!important;
  }
  .section{padding:24px 0!important}
  .section + .section{margin-top:0}
  .card{min-width:0}

  /* Common actionable controls: keep visual styles, normalize touch area. */
  .btn,.btn-sm,.button,.button-primary,.button-outline,.primary-button,.secondary-button,
  .theme-card-action,.design-tab,.theme-reset-button{
    min-height:var(--holius-mobile-touch)!important;
  }

  /* Fixed header: smaller glyphs, larger reliable tap targets, 16px outer gutter. */
  .hh-global-bar{
    min-height:64px!important;
    padding-left:var(--holius-mobile-page-x)!important;
    padding-right:var(--holius-mobile-page-x)!important;
    gap:8px!important;
  }
  .hh-global-left,.hh-global-right{gap:6px!important}
  .hh-brand-wordmark{min-height:64px!important;font-size:19px}
  .hh-menu-button,.hh-member-button,.hh-theme-top-button{
    width:44px!important;height:44px!important;flex:0 0 44px!important;
  }
  .hh-menu-button svg,.hh-member-button svg,.hh-theme-top-button svg{
    width:24px!important;height:24px!important;flex-basis:24px!important;
  }
  .hh-apps-panel{
    top:70px!important;right:var(--holius-mobile-page-x)!important;
    width:calc(100vw - (var(--holius-mobile-page-x) * 2))!important;
    max-height:calc(100dvh - 86px)!important;
  }
  .hh-app-item strong,.hh-language-switch,.hh-logout-link{font-size:12px!important}

  /* Home: readable secondary text without increasing page length aggressively. */
  .home-dashboard{gap:var(--holius-mobile-section-gap)}
  .home-block-head h2{font-size:18px!important}
  .home-section-eyebrow{font-size:12px!important;letter-spacing:.08em}
  .home-daily-reference,.home-daily-read{font-size:12.5px!important}
  .home-today-card blockquote{font-size:18px!important;line-height:1.74!important}
  .home-routine-copy strong{font-size:14.5px!important}
  .home-routine-copy small{font-size:12.5px!important}
  .home-favorites-edit,.home-news-share{font-size:12.5px!important;min-height:44px}

  .home-quick-grid{gap:8px!important}
  .home-quick-grid .home-quick-slot{
    min-height:66px!important;padding:8px 4px!important;gap:5px!important;
  }
  .home-quick-grid .home-quick-slot>span{
    width:22px!important;height:22px!important;font-size:16px!important;
  }
  .home-quick-grid .home-quick-slot>strong{font-size:12px!important;line-height:1.25!important}
  .home-favorites-options button>strong{font-size:12px!important}
  .home-favorites-remove{min-height:44px!important;font-size:12.5px!important}

  .home-news-channel-head strong{font-size:14.5px!important}
  .home-news-channel-head small,.home-news-channel-head>a{font-size:12px!important}
  .home-news-numbered li{min-height:44px}
  .home-news-numbered li>span{font-size:12px!important}
  .home-news-numbered a{font-size:14px!important;line-height:1.45!important}
  .home-news-item-share{
    width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;
  }
  .home-news-cache-empty{font-size:12.5px!important}

  .home-progress-copy>span{font-size:13.5px!important}
  .home-progress-copy>strong{font-size:14px!important}
  .home-progress-detail{font-size:12px!important;line-height:1.5!important}

  /* Theme + Font picker: same component density and never full-screen. */
  .theme-picker-dialog{
    width:calc(100vw - 24px)!important;
    height:auto!important;
    max-height:82dvh!important;
    margin:9dvh auto!important;
    padding:14px 14px calc(18px + env(safe-area-inset-bottom))!important;
    border:1px solid var(--theme-border)!important;
    border-radius:var(--theme-radius-modal)!important;
    overflow-x:hidden!important;overflow-y:auto!important;
  }
  .theme-picker-head{
    top:-14px!important;margin:-14px -14px 0!important;padding:14px 14px 10px!important;
  }
  .theme-picker-head h2{font-size:21px!important}
  .theme-picker-head p{font-size:13px!important;line-height:1.5!important}
  .theme-picker-close{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important}
  .design-tabs{gap:6px;margin-top:12px}
  .design-tab{min-height:44px!important;font-size:13px}

  .theme-group-title{font-size:12.5px!important}
  .theme-group-grid,.theme-admin-grid,.font-group-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;
  }
  .theme-choice-wrap .theme-choice,.font-choice-wrap .theme-choice{
    min-height:142px!important;padding:10px 9px 8px!important;
  }
  .theme-choice-swatch{height:38px!important;margin-bottom:8px!important}
  .theme-choice strong{font-size:13.5px!important;line-height:1.35!important}
  .theme-choice small{font-size:12px!important;line-height:1.4!important;min-height:34px!important}
  .theme-card-actions,.theme-card-actions-admin{gap:6px!important;margin:0 8px!important}
  .theme-card-action{min-height:44px!important;font-size:12.5px!important;padding:7px 4px!important}

  .font-choice-preview{height:50px!important;margin-bottom:8px!important;padding:6px 8px!important}
  .font-choice-preview b{font-size:14px!important;line-height:1.25!important}
  .font-choice-preview span{font-size:13px!important;line-height:1.35!important}
  .font-choice-preview small{font-size:12px!important;line-height:1.2!important}
  .theme-picker-foot>*{min-height:44px!important;font-size:13px!important}
}

@media (max-width:380px){
  :root{--holius-mobile-page-x:14px}
  .hh-global-bar{padding-left:14px!important;padding-right:14px!important}
  .hh-apps-panel{right:14px!important;width:calc(100vw - 28px)!important}
  .theme-picker-dialog{width:calc(100vw - 16px)!important;margin:8dvh 8px!important;max-height:84dvh!important}
  .theme-group-grid,.theme-admin-grid,.font-group-grid{gap:7px!important}
  .theme-choice-wrap .theme-choice,.font-choice-wrap .theme-choice{min-height:140px!important;padding:9px 8px 7px!important}
  .theme-card-actions,.theme-card-actions-admin{margin:0 7px!important;gap:5px!important}
  .home-quick-grid{gap:7px!important}
}