/* Additions have no visual effect on desktop or printed documents. */
.mobile-only{display:none!important}
@media screen and (max-width:900px){
  :root{--mobile-bottom:calc(70px + env(safe-area-inset-bottom,0px))}
  html{scroll-padding-top:84px;scroll-padding-bottom:calc(var(--mobile-bottom) + 24px)}
  body{font-size:15px;line-height:1.55}
  .mobile-only{display:flex!important}
  .workspace{padding-bottom:var(--mobile-bottom);min-width:0}
  .workspace>.topbar{display:none}
  main{padding:22px 16px;min-width:0}
  h1{font-size:27px;letter-spacing:-.7px;overflow-wrap:anywhere}
  h2{font-size:18px;line-height:1.35}
  .muted{color:#60756d}
  .page-heading{gap:16px;align-items:stretch;margin-bottom:20px}
  .page-heading p:last-child,.section-heading p{font-size:14px}
  .page-heading>div{min-width:0}
  .page-heading>.button,.page-heading>form>.button{width:100%}
  .button{min-height:48px;font-size:14px;border-radius:12px;padding:12px 16px;white-space:normal;text-align:center}
  .button:disabled{opacity:.55;cursor:not-allowed}
  label{font-size:13px;margin-bottom:16px}
  input:not([type=checkbox]):not([type=hidden]),select,textarea{font-size:16px;min-height:48px;border-radius:10px;min-width:0;max-width:100%}
  input[type=hidden]{display:none!important}
  input[type=checkbox]{width:22px;height:22px;flex:none;accent-color:var(--teal)}
  .check,.checkbox{min-height:48px;line-height:1.5}
  .check input{width:22px;height:22px}
  .card{border-radius:18px;margin-bottom:18px;min-width:0}
  .form-card,.whatsapp-message,.whatsapp-connection{padding:20px}
  .form-grid,.form-grid.three,.form-grid.four{gap:0 16px}
  .form-card h2{margin-bottom:20px}
  .form-card>button,.form-actions .button{width:100%}
  .section-heading{padding:20px 16px;flex-wrap:wrap;min-width:0}
  .section-heading>div{min-width:0}
  .notice{border-radius:12px;font-size:14px;line-height:1.6;padding:16px;overflow-wrap:anywhere}
  .notice .button{margin-top:12px}
  .stats{gap:10px;margin:20px 0}
  .stat{border-radius:16px;padding:16px;min-height:125px;min-width:0}
  .stat>span{font-size:12px}
  .stat>strong{font-size:clamp(20px,5.6vw,28px);letter-spacing:-.8px;overflow-wrap:anywhere}
  .stat small{font-size:11px;line-height:1.45}
  .stats.three .stat:last-child{grid-column:1/-1}
  .filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;background:#fff;border:1px solid var(--line);padding:16px;border-radius:16px;margin:12px 0 20px}
  .filters label,.filters .grow{min-width:0;max-width:none;flex:none;margin:0}
  .filters .grow{grid-column:1/-1}
  .filters input[type=number]{max-width:none}
  .filters>input[type=hidden]{display:none}
  .filters>.button,.filters>.text-link{align-self:end;min-height:48px}
  .filters>.text-link{display:flex;align-items:center}
  .filters.mobile-collapsed{display:none}
  .filters-toggle{width:100%;justify-content:space-between;background:#fff;color:var(--ink);border-color:var(--line);margin:4px 0 12px}
  .filters-toggle::after{content:'＋';font-size:20px}
  .filters-toggle[aria-expanded=true]::after{content:'−'}
  .mobile-topbar{position:sticky;top:0;z-index:30;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;padding-top:calc(10px + env(safe-area-inset-top,0px));background:#fff;border-bottom:1px solid var(--line);min-height:68px}
  .mobile-home{display:flex;gap:10px;align-items:center;min-width:0;color:var(--ink);font-size:19px;font-weight:700;letter-spacing:-.5px}
  .mobile-home:hover{text-decoration:none}
  .mobile-home img{border-radius:9px;flex:none}
  .mobile-home>span{min-width:0}
  .mobile-home small{font-size:11px;font-weight:500;letter-spacing:0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:225px}
  .mobile-icon-button{width:44px;height:44px;border:1px solid var(--line);border-radius:12px;display:grid;place-items:center;background:#fff;color:var(--ink);flex:none}
  .mobile-bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:35;min-height:var(--mobile-bottom);padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px));background:#fffffffa;border-top:1px solid var(--line);box-shadow:0 -4px 24px #203c3c08;align-items:stretch;justify-content:space-around;gap:4px}
  .mobile-bottom-nav>a,.mobile-bottom-nav>button{flex:1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;min-width:0;min-height:56px;border:0;border-radius:12px;padding:5px 3px;background:transparent;color:#60736d;font-size:11px;font-weight:600;line-height:1.3;text-decoration:none}
  .mobile-bottom-nav span{font-size:11px;line-height:1.3}
  .mobile-bottom-nav [aria-current=page],.mobile-bottom-nav button[aria-expanded=true]{background:var(--mint);color:var(--teal-dark)}
  .mobile-bottom-nav a.mobile-create{background:var(--teal-dark);color:#fff;flex:.9}
  .mobile-ready .sidebar{position:fixed;inset:0 auto 0 0;width:min(340px,calc(100vw - 32px));height:100dvh;z-index:60;background:#fff;padding:24px 18px;transform:translateX(-105%);visibility:hidden;overscroll-behavior:contain;box-shadow:12px 0 50px #142d3826}
  .mobile-ready .sidebar nav{display:block;overflow:visible;margin-bottom:16px}
  .mobile-ready .sidebar .brand{margin:0 42px 24px 0;font-size:22px}
  .mobile-ready .sidebar nav a{font-size:14px;min-height:48px;border-radius:12px;white-space:normal;margin:4px 0}
  .mobile-ready .sidebar .nav-label{display:block;margin-top:12px}
  .mobile-ready .sidebar .sidebar-bottom{display:flex;margin-top:24px;flex-wrap:wrap;font-size:13px;padding-bottom:env(safe-area-inset-bottom,0px)}
  .sidebar-bottom .logout{width:44px;height:44px}
  .mobile-menu-close{position:absolute;top:22px;right:16px;align-items:center;justify-content:center}
  .mobile-menu-backdrop{display:none!important;position:fixed;inset:0;background:#112c3a77;border:0;z-index:55}
  body.mobile-menu-open{overflow:hidden}
  .mobile-menu-open .sidebar{transform:translateX(0);visibility:visible}
  .mobile-menu-open .mobile-menu-backdrop{display:block!important}
  table[data-mobile-cards]{display:block;font-size:14px}
  table[data-mobile-cards]>thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  table[data-mobile-cards]>tbody{display:grid;gap:12px;padding:0 12px 12px}
  table[data-mobile-cards]>tbody>tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;border:1px solid var(--line);border-radius:14px;padding:16px;background:#fff;min-width:0}
  table[data-mobile-cards] td{display:block;padding:0;border:0;white-space:normal;text-align:left;min-width:0;overflow-wrap:anywhere;font-size:14px}
  table[data-mobile-cards] td::before{content:attr(data-label);display:block;color:#6b7d75;font-size:11px;font-weight:500;line-height:1.4;margin-bottom:5px}
  table[data-mobile-cards] td:first-child{grid-column:1/-1;font-weight:650;font-size:16px;padding-bottom:10px;border-bottom:1px solid var(--line)}
  table[data-mobile-cards] td:first-child::before,table[data-mobile-cards] td[data-label=""]::before{display:none}
  table[data-mobile-cards] td.mobile-wide,table[data-mobile-cards] td[colspan]{grid-column:1/-1}
  table[data-mobile-cards] td[colspan]{border:0;padding:20px 0;font-weight:400}
  table[data-mobile-cards] td small{font-size:12px}
  table[data-mobile-cards] td a{display:inline-flex;min-height:44px;align-items:center}
  table[data-mobile-cards] td:first-child a{min-height:24px}
  table[data-mobile-cards] .actions{display:flex;gap:10px;flex-wrap:wrap;padding-top:10px;border-top:1px solid var(--line)}
  table[data-mobile-cards] .actions a{flex:1;justify-content:center;border-radius:10px;background:#edf6f2;margin:0;padding:8px}
  .pill{font-size:11px;white-space:normal;border-radius:7px}
  .user-access-form{display:grid;grid-template-columns:1fr;gap:12px}
  .user-access-form label{min-width:0}
  .pagination{padding:14px 16px;gap:10px;flex-wrap:wrap;font-size:12px}
  .pagination a,.pagination div span{display:inline-flex;min-width:44px;min-height:44px;align-items:center;justify-content:center;margin-left:4px;border-radius:10px;background:#f1f6f3}
  .pagination>div{display:flex;gap:4px;flex-wrap:wrap}
  .whatsapp-connection{gap:20px}
  .whatsapp-connection>div{width:100%;min-width:0}
  .whatsapp-connection .actions{display:grid;grid-template-columns:1fr;width:100%;gap:10px}
  .whatsapp-connection .actions .button{width:100%}
  .whatsapp-connection img{align-self:center;max-width:100%;height:auto}
  .whatsapp-message .page-heading{gap:12px}
  .expense-links{display:grid;grid-template-columns:1fr;gap:8px}
  .expense-links a{padding:12px 16px;border:1px solid var(--line);border-radius:12px;background:#fff;min-height:48px;font-size:14px}
  .expense-source-links{gap:10px;flex-direction:column;align-items:stretch}
  .expense-source-links a{min-height:44px;display:flex;align-items:center}
  .expense-row{margin-left:0;margin-right:0}
  .expense-row .section-heading{align-items:center}
  #expense-form>[data-add-expense]{width:100%;margin-bottom:16px}
  #expense-form .checkbox{align-items:flex-start;font-size:14px}
  #expense-form .checkbox input{margin-top:3px}
  .group-tools{flex-direction:column}
  .group-tools label{margin-bottom:8px}
  .group-tools p{font-size:13px;color:var(--muted)}
  [data-group-row][hidden]{display:none!important}
  #whatsapp-groups-form td{grid-column:1/-1}
  .group-save{position:sticky;bottom:calc(var(--mobile-bottom) + 8px);background:#fff;padding:10px;border:1px solid var(--line);border-radius:14px;box-shadow:0 4px 20px #142d3812;z-index:10}
  .group-save .button{width:100%}
  .quantity-table,.quantity-table tbody{display:block}
  .quantity-table thead{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}
  .quantity-table .item-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;border-bottom:1px solid var(--line);padding:16px}
  .quantity-table td{display:block;padding:0;border:0;min-width:0;white-space:normal;text-align:left;font-size:14px}
  .quantity-table td:first-child{grid-column:1/-1;font-size:16px}
  .quantity-table td:nth-child(3){grid-column:2;grid-row:2/4;align-self:center}
  .quantity-table .unit-price::before{content:'Al pezzo ';font-size:12px;color:var(--muted)}
  .quantity-table .line-total::before{content:'Totale ';font-size:12px;color:var(--muted)}
  .quantity-control{display:flex;align-items:center;border:1px solid #dbe4df;border-radius:12px;background:#fff;overflow:hidden}
  .quantity-control button{flex:none;border:0;background:#edf6f2;color:var(--teal-dark);font-size:22px;width:44px;height:48px}
  .quantity-control input.quantity{appearance:textfield;min-width:0;width:100%;max-width:none;margin:0;border:0;border-radius:0;text-align:center;padding:6px 0}
  .quantity-control input::-webkit-inner-spin-button{appearance:none}
  .mobile-summary-link{position:sticky;bottom:calc(var(--mobile-bottom) + 8px);z-index:12;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;color:#fff;background:var(--teal-dark);border-radius:14px;box-shadow:0 4px 20px #142d3826;font-size:13px;text-decoration:none}
  .mobile-summary-link strong{display:block;font-size:20px}
  .price-grid th,.price-grid td{min-width:155px;padding:12px 10px}
  .price-grid th:first-child{min-width:125px;max-width:125px;width:125px;font-size:12px}
  .price-grid input{font-size:16px}
  .price-grid-wrap{max-height:60dvh;overscroll-behavior:contain}
  .mobile-grid-hint{display:block!important;font-size:13px;color:#60756d}
  .grid-toolbar{flex-direction:column;align-items:stretch;padding:14px;gap:10px;font-size:13px}
  .document{padding:16px}.document-parties{grid-template-columns:1fr;gap:16px;margin:24px 0}
  .document .table-wrap{overflow-x:auto}
  summary{min-height:44px;padding:12px 0;font-size:14px}
  .text-link,.text-button{font-size:14px;min-height:44px}
  .login-card{padding:28px 24px;border-radius:22px;width:100%;max-width:410px;min-width:0}
  .guest main{padding:28px 20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}
  .guest main>.notice{width:100%;max-width:410px}
  .login-card .eyebrow{overflow-wrap:anywhere}
  .guest footer{padding:16px 20px}
  .auth-link{font-size:14px}.auth-link a{display:inline-flex;min-height:44px;align-items:center}
  footer{font-size:11px;gap:12px;flex-wrap:wrap;padding:16px}
  @media(prefers-reduced-motion:reduce){.mobile-ready .sidebar{transition:none}}
}
@media screen and (min-width:601px) and (max-width:900px){
  table[data-mobile-cards]>tbody{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-heading{flex-direction:row}.page-heading>.button{width:auto;align-self:center}
  .stats.three .stat:last-child{grid-column:auto}
}