/* Family demo production fallback. Appended to core styles during build so the product UI remains styled even if its page-specific stylesheet is delayed or cached. */
@media(max-width:760px){
  .family-demo-page .header{position:relative;background:#fcfdfb;border-bottom:1px solid #dfe6e1}
  .family-demo-page .header-inner{min-height:64px;padding:0 16px}
  .family-demo-page .header .site-nav{display:none!important}
  .family-demo-page .header .mobile-menu-toggle{display:none!important}
  .family-demo-page .header .brand{font-size:26px}
  .family-demo-page .announcement{font-size:10px;padding:7px 12px;text-align:center}
  .family-demo-page .family-product{margin-inline:auto}
  .family-demo-page .family-product-bar{display:flex!important;align-items:center;justify-content:space-between;gap:8px}
  .family-demo-page .family-product-title{min-width:0;display:flex!important;align-items:center;gap:6px}
  .family-demo-page .family-product-title p{min-width:0}
  .family-demo-page .family-product-title strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .family-demo-page .family-frame{overflow:hidden}
  .family-demo-page .family-main-head{align-items:flex-start}
  .family-demo-page .family-main-head h1{font-size:22px!important;line-height:1.05!important}
  .family-demo-page .family-main-head>div{min-width:0}
  .family-demo-page .family-main-head p:last-child{max-width:230px}
  .family-demo-page .family-status{flex:0 0 auto}
  .family-demo-page .family-metric-product{min-width:0}
  .family-demo-page .family-metric-product strong{white-space:nowrap}
  .family-demo-page .family-activity-row{min-width:0}
  .family-demo-page .family-activity-row>div{min-width:0}
  .family-demo-page .family-activity-row strong,.family-demo-page .family-activity-row small{overflow-wrap:anywhere}
  .family-demo-page footer{margin-top:0}
}