.cn-mobile-bottom-nav,.cn-mobile-brand,.cn-mobile-install,.cn-mobile-meeting{display:none}

html.cn-mobile-mode{background:#f2f5f8}
html.cn-mobile-mode body{margin:0;background:#f2f5f8;padding-bottom:calc(74px + env(safe-area-inset-bottom));overscroll-behavior-y:contain;-webkit-tap-highlight-color:transparent}
html.cn-mobile-mode .app{display:block;min-height:100vh}
html.cn-mobile-mode aside{display:none!important}
html.cn-mobile-mode main{width:100%;min-width:0}
html.cn-mobile-mode .topbar{height:62px;min-height:62px;padding:env(safe-area-inset-top) 12px 0;position:sticky;top:0;z-index:900;display:flex;flex-wrap:nowrap;gap:8px;background:#071b30;border:0;box-shadow:0 2px 12px rgba(4,24,43,.25)}
html.cn-mobile-mode .topbar .menu-button,
html.cn-mobile-mode .topbar .search-wrap,
html.cn-mobile-mode .topbar #navigatorBtn,
html.cn-mobile-mode .topbar #cnRecordMeetingBtn,
html.cn-mobile-mode .topbar #notificationBtn,
html.cn-mobile-mode .topbar .icon-btn,
html.cn-mobile-mode .topbar .avatar,
html.cn-mobile-mode .topbar .user,
html.cn-mobile-mode .topbar>.top-actions>span{display:none!important}
html.cn-mobile-mode .top-actions{margin-left:auto;gap:7px}
html.cn-mobile-mode #cloudSettingsBtn{display:none!important}
html.cn-mobile-mode #cloudSettingsBtn .cloud-dot{flex:0 0 auto}
html.cn-mobile-mode #cloudLabel{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.cn-mobile-mode .cn-mobile-brand{display:flex;align-items:center;gap:9px;color:#fff;min-width:0}
html.cn-mobile-mode .cn-mobile-brand img{width:38px;height:38px;border-radius:9px}
html.cn-mobile-mode .cn-mobile-brand div{display:grid;line-height:1.05}
html.cn-mobile-mode .cn-mobile-brand strong{font-size:15px;letter-spacing:.01em}
html.cn-mobile-mode .cn-mobile-brand small{font-size:10px;color:#b8c8d7;text-transform:uppercase;letter-spacing:.09em;margin-top:4px}
html.cn-mobile-mode .cn-mobile-install{display:inline-grid;place-items:center;width:38px;height:38px;border:1px solid #587087;border-radius:9px;background:#0e3153;color:#fff;font-size:18px;padding:0}
html.cn-mobile-mode .cn-mobile-meeting{display:inline-grid;place-items:center;width:42px;height:38px;border:1px solid #79a4c8;border-radius:9px;background:#174b77;color:#fff;padding:2px 4px;line-height:1}
html.cn-mobile-mode .cn-mobile-meeting span{font-size:16px}
html.cn-mobile-mode .cn-mobile-meeting small{font-size:8px;font-weight:800}
html.cn-mobile-mode #cnMobileMeetingBtn{order:1}
html.cn-mobile-mode #cnMobileInstallBtn{order:2}
html.cn-mobile-mode #cnUserSwitcher{display:grid!important;order:3;grid-template-columns:32px 10px;width:50px;min-width:50px;min-height:42px;box-sizing:border-box;padding:4px;border-color:#587087;background:#0e3153;color:#fff}
html.cn-mobile-mode #cnUserSwitcher .cn-user-switch-copy{display:none!important}
html.cn-mobile-mode #cnUserSwitcher #cnUserSwitchAvatar{width:32px;height:32px;background:#d8a43a;color:#071b31}
html.cn-mobile-mode #cnUserSwitcher:after{grid-column:2;color:#fff}
html.cn-mobile-mode #cnUserSwitcher:focus-within{outline:3px solid rgba(255,255,255,.72);outline-offset:2px}
html.cn-mobile-mode #cnCurrentUserSelect{min-height:44px}
html.cn-mobile-mode #cnUserSwitcher.cn-managed-user{display:block!important;width:50px;min-width:50px;padding:0;overflow:hidden}
html.cn-mobile-mode #cnUserSwitcher.cn-managed-user .cn-managed-account-button{display:grid;grid-template-columns:32px;width:100%;height:42px;min-height:42px;padding:4px;place-items:center}
html.cn-mobile-mode #cnUserSwitcher.cn-managed-user .cn-managed-account-caret{display:none}
html.cn-mobile-mode #cnUserSwitcher.cn-managed-user .cn-user-switch-copy{display:none!important}
html.cn-mobile-mode #cnUserSwitcher.cn-managed-user .cn-managed-account-button:focus-visible{outline:3px solid rgba(255,255,255,.72);outline-offset:-3px}
html.cn-mobile-mode .content{padding:14px 10px 22px}
html.cn-mobile-mode .cn-mobile-cloud-state{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 12px;padding:11px 12px;border:1px solid #c8d5e2;border-radius:11px;background:#fff;color:#29445e;box-shadow:0 1px 5px rgba(13,35,55,.05)}
html.cn-mobile-mode .cn-mobile-cloud-state>div{display:grid;gap:2px;min-width:0}
html.cn-mobile-mode .cn-mobile-cloud-state strong{font-size:13px;color:#16324d}
html.cn-mobile-mode .cn-mobile-cloud-state small{font-size:11px;color:#66788a;line-height:1.3}
html.cn-mobile-mode .cn-mobile-cloud-state .btn{min-height:36px;padding:7px 10px;font-size:12px;white-space:nowrap}
html.cn-mobile-mode .cn-mobile-cloud-state.ready{border-color:#9dceb0;background:#f1faf4}
html.cn-mobile-mode .cn-mobile-cloud-state.ready strong{color:#17633a}
html.cn-mobile-mode .cn-mobile-cloud-state.loading{border-color:#9bbbd6;background:#f2f8fd}
html.cn-mobile-mode .cn-mobile-cloud-state.warning{border-color:#e1bd83;background:#fff8eb}
html.cn-mobile-mode .cn-mobile-cloud-state.warning strong{color:#8a4b12}
html.cn-mobile-mode .cn-mobile-cloud-state.error{border-color:#e0a8a8;background:#fff3f3}
html.cn-mobile-mode .cn-mobile-cloud-state.error strong{color:#9b2c2c}
html.cn-mobile-mode .page-heading{margin:0 2px 12px;align-items:center}
html.cn-mobile-mode .page-heading h1{font-size:21px}
html.cn-mobile-mode .page-heading p{display:none}
html.cn-mobile-mode .page-heading>.actions{display:none}
html.cn-mobile-mode .view:not(#projects):not(#calendar):not(#field):not(#timesheets):not(#receipts):not(#navigatornotes){display:none!important}
html.cn-mobile-mode .card{border-radius:12px;padding:13px;box-shadow:0 2px 8px rgba(13,35,55,.06)}
html.cn-mobile-mode .grid.two,
html.cn-mobile-mode .grid.three,
html.cn-mobile-mode .time-layout,
html.cn-mobile-mode .form-grid{grid-template-columns:1fr}
html.cn-mobile-mode .form-grid .full{grid-column:auto}
html.cn-mobile-mode button,
html.cn-mobile-mode input,
html.cn-mobile-mode select,
html.cn-mobile-mode textarea{font-size:16px}
html.cn-mobile-mode .btn{min-height:42px;padding:10px 12px}
html.cn-mobile-mode dialog{width:calc(100vw - 18px);max-width:none;max-height:calc(100dvh - 18px);margin:9px;border-radius:14px}
html.cn-mobile-mode dialog .modal-body{max-height:calc(100dvh - 145px);overflow:auto;padding:14px}
html.cn-mobile-mode .modal-head,
html.cn-mobile-mode .modal-foot{position:sticky;z-index:2;background:#fff}
html.cn-mobile-mode .modal-head{top:0}
html.cn-mobile-mode .modal-foot{bottom:0}
html.cn-mobile-mode .footer-brand,
html.cn-mobile-mode .version,
html.cn-mobile-mode #cnFocusTracker{display:none!important}

html.cn-mobile-mode .cn-mobile-bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:1000;display:grid;grid-template-columns:repeat(var(--cn-mobile-tab-count,5),1fr);padding:6px 5px calc(6px + env(safe-area-inset-bottom));background:rgba(7,27,48,.98);border-top:1px solid #29445e;box-shadow:0 -4px 16px rgba(4,24,43,.22)}
html.cn-mobile-mode .cn-mobile-bottom-nav button{border:0;background:transparent;color:#aebdca;min-width:0;min-height:56px;padding:5px 2px;border-radius:9px;display:grid;place-items:center;align-content:center;gap:3px;font-size:10px;font-weight:750}
html.cn-mobile-mode .cn-mobile-bottom-nav button[hidden],
html.cn-mobile-mode .cn-mobile-meeting[hidden]{display:none!important}
html.cn-mobile-mode .cn-mobile-bottom-nav button .cn-mobile-icon{font-size:21px;line-height:1}
html.cn-mobile-mode .cn-mobile-bottom-nav button.active{background:#174b77;color:#fff}

html.cn-mobile-mode #projects>.card>.module-toolbar,
html.cn-mobile-mode #timesheets .task-card-head,
html.cn-mobile-mode #receipts .task-card-head{align-items:flex-start;gap:10px;flex-direction:column}
html.cn-mobile-mode #projects>.card>.module-toolbar .actions,
html.cn-mobile-mode #timesheets .task-card-head .btn,
html.cn-mobile-mode #receipts .task-card-head .btn{width:100%}
html.cn-mobile-mode #projects>.card>.module-toolbar .actions .btn,
html.cn-mobile-mode #timesheets .task-card-head .btn,
html.cn-mobile-mode #receipts .task-card-head .btn{flex:1}

html.cn-mobile-mode #projects table,
html.cn-mobile-mode #timesheets table{display:block}
html.cn-mobile-mode #projects thead,
html.cn-mobile-mode #timesheets thead{display:none}
html.cn-mobile-mode #projectTable,
html.cn-mobile-mode #timeEntryTable{display:grid;gap:10px}
html.cn-mobile-mode #projectTable tr,
html.cn-mobile-mode #timeEntryTable tr{display:grid;background:#fff;border:1px solid #e0e7ee;border-radius:11px;padding:8px 10px;box-shadow:0 1px 4px rgba(17,42,66,.05)}
html.cn-mobile-mode #projectTable td,
html.cn-mobile-mode #timeEntryTable td{display:grid;grid-template-columns:88px minmax(0,1fr);gap:10px;border-bottom:1px solid #edf1f4;padding:8px 2px;align-items:start;word-break:break-word}
html.cn-mobile-mode #projectTable td:last-child,
html.cn-mobile-mode #timeEntryTable td:last-child{border-bottom:0}
html.cn-mobile-mode #projectTable td:before,
html.cn-mobile-mode #timeEntryTable td:before{font-size:10px;font-weight:850;text-transform:uppercase;letter-spacing:.05em;color:#6b7785}
html.cn-mobile-mode #projectTable td:nth-child(1):before{content:"Number"}
html.cn-mobile-mode #projectTable td:nth-child(2):before{content:"Project"}
html.cn-mobile-mode #projectTable td:nth-child(3):before{content:"Customer"}
html.cn-mobile-mode #projectTable td:nth-child(4):before{content:"Type"}
html.cn-mobile-mode #projectTable td:nth-child(5):before{content:"Stage"}
html.cn-mobile-mode #projectTable td:nth-child(6):before{content:"Contract"}
html.cn-mobile-mode #projectTable td:nth-child(7):before{content:"Start"}
html.cn-mobile-mode #projectTable td:nth-child(8):before{content:"Actions"}
html.cn-mobile-mode #timeEntryTable td:nth-child(1):before{content:"Date"}
html.cn-mobile-mode #timeEntryTable td:nth-child(2):before{content:"Employee"}
html.cn-mobile-mode #timeEntryTable td:nth-child(3):before{content:"Applied To"}
html.cn-mobile-mode #timeEntryTable td:nth-child(4):before{content:"Work"}
html.cn-mobile-mode #timeEntryTable td:nth-child(5):before{content:"Hours"}
html.cn-mobile-mode #timeEntryTable td:nth-child(6):before{content:"Actions"}
html.cn-mobile-mode #projectTable .actions,
html.cn-mobile-mode #timeEntryTable .actions{display:flex;flex-wrap:wrap}

html.cn-mobile-mode #calendar .card{overflow-x:auto}
html.cn-mobile-mode #navigatornotes .notes-hero{padding:14px}
html.cn-mobile-mode #navigatornotes .record-btn{width:100%}
html.cn-mobile-mode #navigatornotes .note-grid{grid-template-columns:1fr}
html.cn-mobile-mode .calendar-toolbar{min-width:620px}
html.cn-mobile-mode .calendar-weekdays,
html.cn-mobile-mode .calendar-grid{min-width:620px}
html.cn-mobile-mode .calendar-day{min-height:92px}
html.cn-mobile-mode .calendar-event{font-size:10px}
html.cn-mobile-mode .time-filters,
html.cn-mobile-mode .receipt-filterbar{display:grid;grid-template-columns:1fr}
html.cn-mobile-mode .time-filters>*,
html.cn-mobile-mode .receipt-filterbar>*{width:100%;min-width:0}
html.cn-mobile-mode .receipt-grid{grid-template-columns:1fr}
html.cn-mobile-mode #appStatus{bottom:calc(78px + env(safe-area-inset-bottom));left:10px;right:10px;max-width:none}

@media(min-width:700px){
  html.cn-mobile-mode .content{max-width:760px;margin:0 auto}
  html.cn-mobile-mode .cn-mobile-bottom-nav{left:50%;right:auto;width:700px;transform:translateX(-50%);border-radius:16px 16px 0 0}
}

@media(max-width:420px){
  html.cn-mobile-mode .cn-mobile-meeting{width:38px}
  html.cn-mobile-mode .cn-mobile-meeting small{display:none}
}
