/* Shared mobile layout for the PHP portal and the design preview. */
.menu-toggle,.mobile-cell-label{display:none}
.layout>aside{overflow-y:auto}
.card,.form-grid>*{min-width:0}
.title h1,.profile,.form-intro{overflow-wrap:anywhere;min-width:0}
.title,.form-actions{flex-wrap:wrap}
.mobile-cell-value{min-width:0;overflow-wrap:anywhere}
@media(max-width:800px){
  .layout{display:block}
  .layout>aside{position:relative;height:auto;overflow:visible;border-right:0;border-bottom:1px solid var(--line)}
  .brand{height:72px;padding:0 16px;padding-right:120px}
  .menu-toggle{display:inline-flex;position:absolute;right:16px;top:14px;min-height:44px}
  .mobile-navigation .nav-body{display:none}
  .mobile-navigation.menu-open .nav-body{display:block}
  .nav-body{padding:12px 16px 20px}
  .nav-label{display:block;margin:12px 0 8px}
  .nav-label:not(:first-child){margin-top:20px}
  nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  nav a,.logout{min-height:46px;margin:0;padding:12px;font-size:13px}
  .logout{margin-top:8px}
  .workspace>header{height:auto;min-height:54px;padding:12px 16px;gap:12px}
  .workspace-label{display:block;font-size:11px;flex-shrink:0}
  .profile{margin-left:auto;flex-wrap:wrap;justify-content:flex-end;text-align:right}
  .role-tag{display:inline-block}
  .content{padding:0 12px 24px}
  .title{min-height:76px;padding:16px 0;gap:12px}
  h1{font-size:22px}h2{font-size:18px;overflow-wrap:anywhere}
  .card{padding:16px}
  .profile-panel,.form-grid{grid-template-columns:minmax(0,1fr)}
  .form-grid{gap:0}
  .detail-table th,.detail-table td{font-size:13px;padding:10px}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .stat-card{padding:16px;min-height:104px}
  .metric{font-size:24px;margin-top:20px;overflow-wrap:anywhere;line-height:1.2}
  .button,input,select{min-height:46px}
  input,select{font-size:16px;min-width:0;max-width:100%}
  input[type=checkbox]{min-height:20px;width:20px;height:20px;flex-shrink:0}
  label{font-size:14px}.check{min-height:44px}
  fieldset{min-width:0;padding:14px}
  .search{display:flex;flex-wrap:wrap;gap:10px}
  .search input,.activity-filters select,.activity-filters input[type=date]{width:100%;max-width:none;flex:1 1 100%}
  .search .button{flex:1}
  .form-actions{gap:10px}
  .form-actions>.button,.form-actions>form{flex:1 1 140px}
  .form-actions>form .button,.credit-form>.button{width:100%}
  .list-heading{align-items:flex-start;flex-wrap:wrap;gap:12px}
  .credit-summary{flex-direction:column;align-items:flex-start;gap:12px}
  .table-wrap{max-width:100%}
  .mobile-table,.mobile-table tbody{display:block;width:100%}
  .mobile-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .mobile-table tbody tr{display:block;margin-top:14px;border:1px solid #46566e;border-radius:6px;padding:4px 12px;background:#18263a}
  .mobile-table tbody td{display:grid;grid-template-columns:minmax(0,0.85fr) minmax(0,1.15fr);gap:12px;padding:12px 0;min-width:0;font-size:13px;text-align:left}
  .mobile-table tbody td:last-child{border-bottom:0}
  .mobile-cell-label{display:block;color:var(--muted);font-size:12px;line-height:1.5;overflow-wrap:anywhere}
  .mobile-table .empty{display:block;padding:24px 8px}
  .mobile-table .activity-browser{min-width:0;max-width:none}
  .actions{flex-wrap:wrap;gap:4px 12px}
  .text-link,.text-button{display:inline-flex;align-items:center;min-height:44px}
  td small{line-height:1.5}
  summary{min-height:44px;padding:12px 0}
  details pre{min-width:0;max-width:100%;overflow-wrap:anywhere;white-space:pre-wrap}
  .login{width:auto;max-width:440px;margin:24px auto;padding:24px}
  .login .brand{padding-right:0}
  footer{flex-wrap:wrap}
}
@media(max-width:480px){
  .login{margin:20px 12px}
  .workspace-label{display:none}
  .title>.button{width:100%}
  .mobile-table tbody td{grid-template-columns:minmax(0,1fr);gap:2px}
  .mobile-cell-label{font-size:11px}
  .actions{gap:8px 20px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.header-balance{display:flex;flex-direction:column;align-items:flex-end;gap:3px;flex-shrink:0;text-align:right}
.header-balance small{font-size:10px;font-weight:400}
.header-balance strong{color:#8be0bb;font-size:13px;white-space:nowrap}
@media(max-width:800px){
  .workspace>header{position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line);box-shadow:0 3px 12px #0002}
  .workspace>header:has(.has-balance) .workspace-label{display:none}
  .profile.has-balance{width:100%;justify-content:space-between;flex-wrap:nowrap;gap:12px;text-align:left}
  .has-balance .profile-name{min-width:0;overflow-wrap:anywhere;line-height:1.4}
  .has-balance .role-tag{display:none}
  .header-balance{display:flex;flex-direction:column;align-items:flex-end;gap:3px;flex-shrink:0;text-align:right}
  .header-balance small{font-size:10px;font-weight:400}
  .header-balance strong{color:#8be0bb;font-size:13px;white-space:nowrap}
}
/* Expand the mobile menu downwards, with one link per row. */
@media(max-width:800px){
  .mobile-navigation .nav-reveal{display:grid;grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows .28s ease,visibility .28s}
  .mobile-navigation.menu-open .nav-reveal{grid-template-rows:1fr;visibility:visible}
  .mobile-navigation .nav-clip{min-height:0;overflow:hidden}
  .mobile-navigation .nav-body{display:block}
  .mobile-navigation nav{grid-template-columns:minmax(0,1fr)}
}
@media(prefers-reduced-motion:reduce){
  .mobile-navigation .nav-reveal{transition:none}
}
nav a{overflow-wrap:anywhere;min-width:0}
.home-website{margin-top:16px;padding:16px}
.home-website iframe{display:block;width:100%;height:680px;border:1px solid var(--line);border-radius:4px;background:#fff}
.home-website>p{font-size:12px;margin-top:12px}
@media(max-width:800px){.home-website iframe{height:70vh;min-height:400px;max-height:760px}.home-website .list-heading{align-items:center}}
.home-website.home-video iframe{height:auto;min-height:0;max-height:none;aspect-ratio:16/9;background:#000}
.home-website-link{margin-top:16px}.home-website-link .button{min-height:46px}