/* Shared final layout rules: content may shrink; wide tables scroll inside panels. */
.panel,.panel-heading>div,.shell,.view,.account-intro,.organization-intro{min-width:0}
.dialog-heading>div,.form-columns>label{min-width:0}
.dialog-heading h2,.dialog-heading p{overflow-wrap:anywhere}
.table-scroll{position:relative;min-width:0;max-width:100%}
form input,form select,form textarea{min-width:0;max-width:100%}
.account-layout{grid-template-columns:repeat(2,minmax(0,1fr))}
.admin-main .page-heading>.actions{display:flex;gap:10px;flex-wrap:wrap}
.stat-value,.traffic-stat strong{white-space:normal;overflow-wrap:anywhere}

@media(max-width:900px){
 .page-heading{flex-wrap:wrap}
 .page-heading>div:first-child{flex:1 1 300px}
 .heading-actions{max-width:100%}
 .settings-grid{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:760px){
 .account-layout{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:700px){
 .traffic-panel .panel-heading>div{flex-basis:100%}
 .traffic-chart{min-width:420px}
 .traffic-table{table-layout:fixed}
 .traffic-table th,.traffic-table td{overflow-wrap:anywhere}
 .traffic-table thead th{white-space:normal}
}
@media(max-width:600px){
 .site-header{height:auto;min-height:72px;gap:16px;padding-block:14px}
 .site-header nav{gap:16px;flex-shrink:0}
 .site-header .nav-demo,.site-header .button.small{display:none}
 .site-header nav>a{display:inline-flex;align-items:center;min-height:44px}
 .hero-copy,.showcase,.features-heading,.section-intro{min-width:0}
 .hero-copy .slogan-heading{font-size:clamp(23px,7.8vw,40px)}
 .demo-heading{flex-wrap:wrap}
 .demo-heading>div{min-width:0}
 .demo-bottom{flex-wrap:wrap}
 .carousel-footer{gap:12px}
 .carousel-footer p{min-width:0;line-height:1.6}
 .carousel-buttons{flex-shrink:0}
 .payment-row{flex-wrap:wrap}
 .payment-row .person{flex:1 1 130px}
 .money-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
 .money-summary strong{white-space:normal;overflow-wrap:anywhere}
 .tour-steps{gap:12px;flex-wrap:wrap}
 .tour-actions{flex-wrap:wrap}
 .account-header,.organization-header{gap:16px}
 .account-header>a:last-child,.back-home{flex-shrink:0}
 .account-intro .account-slogan{font-size:clamp(26px,7.8vw,32px)}
 .topbar{height:auto;min-height:64px}
 .breadcrumb{min-width:0;flex:1}
 .breadcrumb strong{overflow-wrap:anywhere}
 .topbar-right{flex-shrink:0}
 .account-actions .account-name{display:none}
 .heading-actions{justify-content:flex-start}
 .month-picker{flex:1 1 170px}
 .period-actions{gap:8px}
 .period-actions .segmented{flex-shrink:0}
 .table-actions{flex-wrap:wrap}
 .panel-heading>.search{width:100%;max-width:none}
 .panel-heading .actions{display:flex;flex-wrap:wrap;gap:8px}
 .employee-list-row .employee-info{flex-basis:100%;min-width:0}
 .employee-list-row .employee-name{white-space:normal;overflow-wrap:anywhere}
 .employee-list-row .secondary{margin-left:0;flex:1 1 120px}
 .admin-top{gap:14px;padding:16px}
 .admin-top>.brand-header{flex-wrap:wrap}
 .admin-top>div:last-child{flex-wrap:wrap}
 .admin-main .page-heading>.actions{margin-top:18px}
 .admin-main .page-heading>.actions>*{flex:1 1 140px}
 .viewer-heading>div{min-width:0}
 .viewer-period{flex-wrap:wrap}
 .viewer-period label{min-width:0;flex:1 1 150px}
 .viewer-top{flex-wrap:wrap;gap:12px}
 .viewer-top .brand-lockup{flex-basis:100%}
 .viewer-top .secondary{flex:1}
 .dialog-actions>*{flex:1 1 120px}
 .form-columns{grid-template-columns:minmax(0,1fr)}
 .workspace-footer{flex-wrap:wrap}
}
@media(max-width:360px){
 .account-header{padding-inline:16px}
 .account-header .brand-lockup{font-size:20px;gap:7px}
 .account-header .brand-mark{width:32px;height:32px}
 .account-layout{padding-inline:16px}
 .account-card{padding:22px 16px}
 .account-tabs{gap:18px}
 .traffic-stats{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:420px){
 .payroll-summary,.payroll-summary:has(>.payroll-card:nth-child(4)){
  grid-template-columns:minmax(0,1fr);
 }
 .payroll-summary>.payroll-card:last-child:nth-child(odd){grid-column:auto}
 .payroll-card>strong{font-size:24px}
}