:root{--ide-sidebar-width:232px;--ide-audit-sidebar-width:320px;--ide-title-height:56px;--ide-tab-height:56px;--ide-status-height:32px}
@media screen{
  .backend-admin{--ide-title-height:56px;--ide-tab-height:36px;--ide-status-height:28px}
  .backend-admin #lotterySetupScreen{--font-scale:1;--control-h-sm:28px;--control-h-md:32px;--control-h-lg:36px;--input-h:32px;max-width:1180px;margin:0 auto;padding:0 24px 16px;font-size:var(--fs-body)}
  .backend-admin #lotterySetupScreen > .card{--lottery-card-padding:24px;min-height:0;padding:20px 24px;border:1px solid var(--border);border-radius:4px;box-shadow:none}
  .backend-admin #employeeSetupScreen{font-size:var(--fs-body)}
  .backend-admin.workspace-open #app #employeeSetupScreen > .card{--employee-card-padding:16px;display:flex;flex-direction:column;width:100%;max-width:none;min-height:calc(100dvh - var(--ide-title-height) - var(--ide-tab-height) - var(--ide-status-height));margin:0;padding:0 0 16px;border:0;border-radius:0;box-shadow:none}
  .backend-admin.workspace-open #app #employeeSetupScreen .employee-sticky-head > .page-head{display:none}
  .backend-admin.workspace-open #app #employeeSetupScreen .book-actions{margin-top:0;margin-bottom:0}
  .backend-admin.workspace-open #app #employeeSetupScreen > .card > .employee-setup-table-wrap{display:flex;flex:1;flex-direction:column;width:100%;min-height:0;margin:0}
  .backend-admin.workspace-open #app #employeeSetupScreen .employee-setup-table{width:100%;table-layout:fixed}
  .backend-admin.workspace-open #app #employeeSetupScreen .employee-setup-table th,
  .backend-admin.workspace-open #app #employeeSetupScreen .employee-setup-table td{padding:2px 10px;font-size:12px;line-height:1.2}
  .backend-admin.workspace-open #app #employeeSetupScreen .employee-setup-table td{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .backend-admin.workspace-open #app #employeeSetupScreen .employee-setup-table th:nth-child(1),
  .backend-admin.workspace-open #app #employeeSetupScreen .employee-setup-table td:nth-child(1){width:18%}
  .backend-admin.workspace-open #app #employeeSetupScreen .employee-setup-table th:nth-child(2),
  .backend-admin.workspace-open #app #employeeSetupScreen .employee-setup-table td:nth-child(2){width:28%}
  .backend-admin.workspace-open #app #employeeSetupScreen .employee-setup-table th:nth-child(3),
  .backend-admin.workspace-open #app #employeeSetupScreen .employee-setup-table td:nth-child(3){width:34%}
  .backend-admin.workspace-open #app #employeeSetupScreen .employee-setup-table th:nth-child(4),
  .backend-admin.workspace-open #app #employeeSetupScreen .employee-setup-table td:nth-child(4){width:20%}
  .backend-admin.workspace-open #app #employeeSetupScreen .employee-setup-table .badge{padding:2px 6px;font-size:11px}
  .backend-admin #employeeModalOverlay{align-items:center;padding:12px}
  .backend-admin.workspace-open #employeeModalOverlay{top:calc(var(--ide-title-height) + var(--ide-tab-height));right:0;bottom:var(--ide-status-height);left:var(--ide-sidebar-width)}
  .backend-admin.workspace-open.sidebar-collapsed #employeeModalOverlay{left:0}
  .backend-admin #employeeModalOverlay .modal-card{width:100%;max-width:480px;max-height:calc(100% - 24px);border-radius:4px}
  .backend-admin #employeeModalOverlay .modal-head{padding:8px 12px;border-radius:4px 4px 0 0}
  .backend-admin #employeeModalOverlay .modal-head h3{font-size:14px;line-height:1.2}
  .backend-admin #employeeModalOverlay .modal-close{min-width:28px;min-height:28px;font-size:20px}
  .backend-admin #employeeModalOverlay .modal-form{gap:8px;padding:12px}
  .backend-admin #employeeModalOverlay .modal-form label{gap:2px;font-size:12px}
  .backend-admin #employeeModalOverlay .modal-form input:not([type=hidden]):not([type=checkbox]),
  .backend-admin #employeeModalOverlay .modal-form select,
  .backend-admin #employeeModalOverlay .modal-form textarea{min-height:28px;padding:2px 7px;font-size:12px;font-weight:400}
  .backend-admin #employeeModalOverlay .modal-form input[type=checkbox]{width:14px;height:14px;min-height:14px;padding:0}
  .backend-admin #employeeModalOverlay .modal-form .stack{gap:6px}
  .backend-admin #employeeModalOverlay .modal-actions{gap:6px}
  .backend-admin #employeeModalOverlay .modal-actions button{min-height:28px;padding:0 10px;font-size:12px}
  .backend-admin #employeeModalOverlay .modal-actions .employee-modal-archive{margin-right:auto}
  .backend-admin.workspace-open #app #userGroupsScreen > .card{display:flex;flex-direction:column;width:100%;max-width:none;min-height:calc(100dvh - var(--ide-title-height) - var(--ide-tab-height) - var(--ide-status-height));margin:0;padding:0 0 16px;border:0;border-radius:0;box-shadow:none}
  .backend-admin.workspace-open #app #userGroupsScreen .usergroups-sticky-head > .page-head{display:none}
  .backend-admin.workspace-open #app #userGroupsScreen > .card > .usergroups-setup-table-wrap{display:flex;flex:1;flex-direction:column;width:100%;min-height:0;margin:0}
  .backend-admin.workspace-open #app #userGroupsScreen .usergroups-setup-table{width:100%;table-layout:fixed}
  .backend-admin.workspace-open #app #userGroupsScreen .usergroups-setup-table th,
  .backend-admin.workspace-open #app #userGroupsScreen .usergroups-setup-table td{padding:2px 10px;font-size:12px;line-height:1.2}
  .backend-admin.workspace-open #app #userGroupsScreen .usergroups-setup-table td{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .backend-admin.workspace-open #app #userGroupsScreen .user-group-draft-row{cursor:default}
  .backend-admin.workspace-open #app #userGroupsScreen .user-group-draft-row td{overflow:visible;white-space:normal}
  .backend-admin.workspace-open #app #userGroupsScreen .user-group-draft-field{width:100%;min-width:0;height:26px;min-height:26px;padding:2px 6px;font-size:12px;line-height:1.2}
  .backend-admin.workspace-open #app #userGroupsScreen .user-group-add-link{min-height:0;height:auto;padding:0;border:0;border-radius:0;background:transparent;color:var(--accent);font-size:12px;text-decoration:underline;box-shadow:none;cursor:pointer}
  .backend-admin.workspace-open #app #userGroupsScreen .user-group-add-link:disabled{opacity:.6;cursor:not-allowed}
  .backend-admin.workspace-open #app #userGroupsScreen .usergroups-setup-table th:nth-child(1),
  .backend-admin.workspace-open #app #userGroupsScreen .usergroups-setup-table td:nth-child(1){width:24%}
  .backend-admin.workspace-open #app #userGroupsScreen .usergroups-setup-table th:nth-child(2),
  .backend-admin.workspace-open #app #userGroupsScreen .usergroups-setup-table td:nth-child(2){width:40%}
  .backend-admin.workspace-open #app #userGroupsScreen .usergroups-setup-table th:nth-child(3),
  .backend-admin.workspace-open #app #userGroupsScreen .usergroups-setup-table td:nth-child(3){width:14%}
  .backend-admin.workspace-open #app #userGroupsScreen .usergroups-setup-table th:nth-child(4),
  .backend-admin.workspace-open #app #userGroupsScreen .usergroups-setup-table td:nth-child(4){width:22%}
  .backend-admin.workspace-open #app #resetDataScreen > .card{display:flex;flex-direction:column;width:100%;min-height:calc(100dvh - var(--ide-title-height) - var(--ide-tab-height) - var(--ide-status-height));margin:0;padding:0 0 12px;border:0;border-radius:0;box-shadow:none}
  .backend-admin.workspace-open #app #resetDataScreen .page-head{display:none}
  .backend-admin.workspace-open #app #resetDataScreen .reset-data-toolbar{padding:12px 16px 8px}
  .backend-admin.workspace-open #app #resetDataScreen .reset-data-warning{margin:0 0 8px;padding:8px 10px;border-left:3px solid var(--danger);background:var(--ide-panel);font-size:12px}
  .backend-admin.workspace-open #app #resetDataScreen #resetDataMsg:empty{display:none}
  .backend-admin.workspace-open #app #resetDataScreen .reset-data-table-wrap{display:flex;flex:1;flex-direction:column;width:100%;min-height:0;margin:0;border:0;border-radius:0;overflow:auto}
  .backend-admin.workspace-open #app #resetDataScreen .reset-data-table{width:100%;table-layout:fixed}
  .backend-admin.workspace-open #app #resetDataScreen .reset-data-table th,
  .backend-admin.workspace-open #app #resetDataScreen .reset-data-table td{padding:2px 10px;font-size:12px;line-height:1.2;text-align:left}
  .backend-admin.workspace-open #app #resetDataScreen .reset-data-table th:first-child,
  .backend-admin.workspace-open #app #resetDataScreen .reset-data-table td:first-child{width:30%}
  .backend-admin.workspace-open #app #resetDataScreen .reset-data-table td{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .backend-admin.workspace-open #app #lotterySetupScreen{max-width:none;min-height:100%;margin:0;padding:0}
  .backend-admin.workspace-open #app #lotterySetupScreen > .card{--lottery-card-padding:16px;display:flex;flex-direction:column;width:100%;min-height:calc(100dvh - var(--ide-title-height) - var(--ide-tab-height) - var(--ide-status-height));margin:0;padding:0 0 12px;border:0;border-radius:0;box-shadow:none}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-sticky-head{display:none}
  .backend-admin.workspace-open #app #lotterySetupScreen .book-actions{display:flex;align-items:center;gap:8px;width:100%;margin:0;padding:6px 12px;border-radius:0}
  .backend-admin.workspace-open #app #lotterySetupScreen .book-actions > .primary{flex:none}
  .backend-admin.workspace-open #app #lotterySetupScreen .book-actions > .search-input{width:320px;flex:0 1 320px}
  .backend-admin.workspace-open #app #lotterySetupScreen #lotteryListMsg{margin:4px 12px}
  .backend-admin.workspace-open #app #lotterySetupScreen #lotteryListMsg:empty{display:none}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap{display:flex;flex:1;flex-direction:column;width:100%;min-height:0;margin:0;border:0;border-radius:0;overflow:auto}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-table{width:100%;table-layout:fixed}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>thead>tr>th,
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>tbody>tr:not(.lottery-books-inline-row)>td{padding:2px 10px;font-size:12px;line-height:1.2}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>thead>tr>th:nth-child(1),
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>tbody>tr:not(.lottery-books-inline-row)>td:nth-child(1){width:14%}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>thead>tr>th:nth-child(2),
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>tbody>tr:not(.lottery-books-inline-row)>td:nth-child(2){width:44%}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>thead>tr>th:nth-child(3),
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>tbody>tr:not(.lottery-books-inline-row)>td:nth-child(3){width:12%}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>thead>tr>th:nth-child(4),
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>tbody>tr:not(.lottery-books-inline-row)>td:nth-child(4){width:13%;text-align:center}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>thead>tr>th:nth-child(5),
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>tbody>tr:not(.lottery-books-inline-row)>td:nth-child(5){width:17%}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>tbody>tr:not(.lottery-books-inline-row)>td:nth-child(1),
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>tbody>tr:not(.lottery-books-inline-row)>td:nth-child(3),
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>tbody>tr:not(.lottery-books-inline-row)>td:nth-child(4),
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>tbody>tr:not(.lottery-books-inline-row)>td:nth-child(5){white-space:nowrap}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>tbody>tr:not(.lottery-books-inline-row) .status-cell .badge{padding:1px 5px;border-radius:3px;font-size:10px;font-weight:400;line-height:1.1}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>tbody>tr:not(.lottery-books-inline-row) .status-cell .badge::before{width:5px;height:5px;margin-right:3px}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-setup-table-wrap>.lottery-table>tbody>tr:not(.lottery-books-inline-row)[data-lottery-id]:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
  .backend-admin.workspace-open #app #lotterySetupScreen .inventory-panel{width:100%;margin:12px 0 0;border-radius:0}
  .backend-admin.workspace-open #app #lotterySetupScreen .inventory-panel > .table-wrap{width:100%;margin:0;border-radius:0}
  .backend-admin.workspace-open #app #lotterySetupScreen #lotteryBarcodePanel .form-card{margin:0;padding:12px 16px}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-inline-add-row td{overflow:visible;white-space:normal}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-inline-add-field{display:block;width:100%;min-width:0;height:26px;min-height:26px;padding:2px 6px;font-size:12px;line-height:1.2}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-inline-secondary-fields{display:flex;gap:6px;margin-top:4px}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-inline-secondary-fields>label{display:flex;min-width:0;flex:1;flex-direction:column;gap:2px;color:var(--muted);font-size:10px;line-height:1.2}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-add-link{min-height:0;padding:0;border:0;border-radius:0;background:transparent;color:var(--accent);font-size:12px;font-weight:700;text-decoration:underline;white-space:nowrap}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-inline-add-row .lottery-add-link{display:block;width:max-content;margin-top:3px}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-inline-status{color:var(--muted);font-size:11px;white-space:normal}
  .backend-admin.workspace-open #app #lotterySetupScreen .lottery-inline-status .badge{margin-right:4px}
  .backend-admin .lottery-details-sidebar{position:fixed;top:var(--ide-title-height);right:0;bottom:var(--ide-status-height);z-index:19;display:flex;flex-direction:column;width:320px;padding:12px;background:var(--ide-panel);color:var(--text);border-left:1px solid var(--border);overflow:hidden}
  .backend-admin .lottery-details-sidebar[hidden]{display:none}
  .backend-admin .lottery-details-header{padding-bottom:8px;border-bottom:1px solid var(--border)}
  .backend-admin .book-details-header{display:flex;align-items:center;justify-content:space-between;gap:8px}
  .backend-admin .lottery-details-header h2{margin:0;font-size:16px;overflow-wrap:anywhere}
  .backend-admin .lottery-details-form{display:flex;flex:1;min-height:0;flex-direction:column;gap:8px;padding:0;overflow-y:auto}
  .backend-admin .lottery-details-panel{display:flex;flex-direction:column;gap:8px;padding:10px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface)}
  .backend-admin .lottery-details-panel[aria-label="Lottery Details"]{gap:4px;padding:0 10px}
  .backend-admin #bookDetailsPanel[hidden]{display:none}
  .backend-admin #bookDetailsPanel .book-details-header{margin-bottom:0}
  .backend-admin #bookDetailsPanel .book-details-header .lottery-details-panel-title{margin:0}
  .backend-admin .lottery-details-panel-title{margin:0 0 2px;font-size:13px;font-weight:600}
  .backend-admin .lottery-details-form label{display:flex;flex-direction:column;gap:3px;font-size:12px}
  .backend-admin .lottery-details-form input:not([type=hidden]),
  .backend-admin .lottery-details-form select{min-height:28px;padding:3px 7px;font-size:12px}
  .backend-admin .lottery-details-form input:not([type=hidden]){font-weight:400}
  .backend-admin .lottery-details-field-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .backend-admin .lottery-details-field-pair label{min-width:0}
  .backend-admin .lottery-details-field-pair input{box-sizing:border-box;width:100%;min-width:0}
  .backend-admin #lotteryStatusMsg:empty{display:none}
  .backend-admin .lottery-books-inline-row>td{padding:0!important;background:var(--ide-panel)}
  .backend-admin .lottery-books-section{display:flex;width:86%;flex-direction:column;gap:2px;margin:0 7% 0 7%;padding:4px 0;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface)}
  .backend-admin #lotteryBooksMsg:empty{display:none}
  .backend-admin #lotteryBooksMsg{width:100%;margin:0;font-size:12px}
  .backend-admin .lottery-books-table-wrap{width:100%;max-width:100%;margin-left:0;overflow-x:auto}
  .backend-admin .lottery-books-table{width:100%;min-width:760px;table-layout:fixed;border-collapse:collapse}
  .backend-admin .lottery-books-table th,
  .backend-admin .lottery-books-table td{overflow:hidden;padding:2px 10px;border-bottom:1px solid var(--border);font-size:12px;line-height:1.2;text-align:left;text-overflow:ellipsis;white-space:nowrap}
  .backend-admin .lottery-books-table td{font-weight:400}
  .backend-admin .lottery-books-table th{color:var(--muted);font-weight:600}
  .backend-admin .lottery-books-table th{white-space:nowrap;vertical-align:bottom}
  .backend-admin .lottery-books-table tbody tr[data-book-id]{cursor:pointer}
  .backend-admin .lottery-books-table tbody tr[data-book-id]:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
  .backend-admin .lottery-books-table th:nth-child(1){width:26%}
  .backend-admin .lottery-books-table th:nth-child(2){width:11%}
  .backend-admin .lottery-books-table th:nth-child(3){width:12%}
  .backend-admin .lottery-books-table th:nth-child(4){width:16%}
  .backend-admin .lottery-books-table th:nth-child(5){width:9%;text-align:center}
  .backend-admin .lottery-books-table th:nth-child(6){width:11%;text-align:center}
  .backend-admin .lottery-books-table th:nth-child(7){width:15%;text-align:center}
  .backend-admin .lottery-books-table td:nth-child(5),
  .backend-admin .lottery-books-table td:nth-child(6),
  .backend-admin .lottery-books-table td:nth-child(7){text-align:center}
  .backend-admin .book-detail-status-field{display:flex;flex-direction:column;gap:3px;font-size:12px}
  .backend-admin .badge.book-status-assigned{background:#dcfce7;color:#166534}
  .backend-admin .badge.book-status-archived{background:#e5e7eb;color:#4b5563}
  .backend-admin .badge.book-status-returned{background:#dbeafe;color:#1e40af}
  .backend-admin .badge.book-status-unassigned{background:#fef3c7;color:#92400e}
  .backend-admin .badge.book-status-stolen{background:#fee2e2;color:#991b1b}
  .backend-admin .badge.book-status-damaged{background:#ffedd5;color:#9a3412}
  .backend-admin .badge.book-status-unknown{background:#e5e7eb;color:#4b5563}
  .backend-admin .lottery-book-add-row td{vertical-align:top;white-space:normal}
  .backend-admin .lottery-book-add-link[aria-disabled="true"]{opacity:.55;pointer-events:none}
  .backend-admin .lottery-book-add-form>label{display:flex;min-width:0;flex-direction:column;gap:3px;color:var(--muted);font-size:11px;white-space:normal}
  .backend-admin .lottery-book-add-form input{box-sizing:border-box;width:100%;min-width:0;min-height:26px;padding:3px 6px;font-size:12px;font-weight:400}
  .backend-admin .lottery-book-add-form{display:grid;grid-template-columns:minmax(0,1fr);gap:7px}
  .backend-admin .lottery-book-add-preview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  .backend-admin .lottery-book-add-preview>div{display:flex;min-width:0;flex-direction:column;gap:2px}
  .backend-admin .lottery-book-add-preview span{color:var(--muted);font-size:10px}
  .backend-admin .lottery-book-add-preview strong{overflow:hidden;font-size:12px;text-overflow:ellipsis}
  .backend-admin .lottery-book-add-count{color:var(--muted);font-size:11px;text-align:right}
  .backend-admin .lottery-book-add-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px}
  .backend-admin .lottery-book-add-actions .small-btn{min-height:22px;padding:1px 6px;font-size:11px}
  .backend-admin.workspace-open #app #resetDataScreen .reset-data-select{width:100%;min-height:28px;padding:0;border:0;background:transparent;color:var(--accent);font:inherit;font-weight:700;text-align:left;cursor:pointer}
  .backend-admin.workspace-open #app #resetDataScreen .reset-data-select:hover{text-decoration:underline}
  .backend-admin.workspace-open #app #resetDataScreen .reset-data-all .reset-data-select{color:var(--danger)}
  .backend-admin .user-group-details-sidebar{position:fixed;top:var(--ide-title-height);right:0;bottom:var(--ide-status-height);z-index:19;display:flex;flex-direction:column;width:320px;padding:12px;background:var(--ide-panel);color:var(--text);border-left:1px solid var(--border);overflow:hidden}
  .backend-admin .user-group-details-sidebar[hidden]{display:none}
  .backend-admin .user-group-details-header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:8px;border-bottom:1px solid var(--border)}
  .backend-admin .user-group-details-header h2{margin:0;font-size:16px}
  .backend-admin .user-group-details-view{flex:1;min-height:0;padding:4px 0 12px;overflow-y:auto}
  .backend-admin .user-group-details-view[hidden]{display:none}
  .backend-admin .user-group-detail-permissions{margin-top:0}
  .backend-admin #userGroupDetailsSaveStatus:empty{display:none}
  .backend-admin #userGroupDetailPermissions{display:grid;gap:6px}
  .backend-admin #userGroupDetailPermissions .permission-section{margin:0;padding:4px 8px}
  .backend-admin #userGroupDetailPermissions .permission-section summary{padding:2px 0;font-size:12px}
  .backend-admin #userGroupDetailsSidebar .permission-table{width:100%;table-layout:fixed;margin-top:4px}
  .backend-admin #userGroupDetailsSidebar .permission-table th,
  .backend-admin #userGroupDetailsSidebar .permission-table td{padding:3px 4px;font-size:11px}
  .backend-admin #userGroupDetailsSidebar .permission-table th:first-child,
  .backend-admin #userGroupDetailsSidebar .permission-table td:first-child{width:60%;white-space:normal;overflow-wrap:anywhere}
  .backend-admin #userGroupDetailsSidebar .permission-table th:nth-child(2),
  .backend-admin #userGroupDetailsSidebar .permission-table td:nth-child(2),
  .backend-admin #userGroupDetailsSidebar .permission-table th:nth-child(3),
  .backend-admin #userGroupDetailsSidebar .permission-table td:nth-child(3){width:20%;text-align:center}
  .backend-admin #userGroupDetailsSidebar .permission-table input[type=checkbox]{width:14px;height:14px;min-height:14px;margin:0;accent-color:var(--accent);opacity:1}
  .backend-admin #userGroupDetailPermissions .permission-table input[type=checkbox]{cursor:pointer}
  .backend-admin #userGroupDetailPermissions .permission-table input[type=checkbox]:disabled{cursor:not-allowed}
  .backend-admin #userGroupDetailPermissions .permission-table input[type=checkbox]{cursor:default}
  .backend-admin #userGroupPermissionSections .permission-table input[type=checkbox]{cursor:pointer}
  .backend-admin #userGroupPermissionSections .permission-table input[type=checkbox]:disabled{cursor:not-allowed}
  .backend-admin .registration-seat-details-sidebar{position:fixed;top:var(--ide-title-height);right:0;bottom:var(--ide-status-height);z-index:19;display:flex;width:320px;flex-direction:column;padding:12px;background:var(--ide-panel);color:var(--text);border-left:1px solid var(--border);overflow:hidden}
  .backend-admin .registration-seat-details-sidebar[hidden]{display:none}
  .backend-admin .registration-seat-details-header{padding-bottom:8px;border-bottom:1px solid var(--border)}
  .backend-admin .registration-seat-details-header h2{margin:0;font-size:16px}
  .backend-admin .registration-seat-details-view{flex:1;min-height:0;padding:12px 0;overflow-y:auto}
  .backend-admin .registration-seat-details-list{display:grid;gap:10px;margin:0 0 16px}
  .backend-admin .registration-seat-details-list>div{display:grid;gap:3px}
  .backend-admin .registration-seat-details-list dt{color:var(--muted);font-size:11px}
  .backend-admin .registration-seat-details-list dd{margin:0;overflow-wrap:anywhere;font-size:13px}
  .backend-admin #registrationSeatUnassignBtn{width:100%;min-height:34px}
  .backend-admin #registrationSeatDetailsStatus:empty{display:none}
  .backend-admin.workspace-open #app #registrationScreen>.card{display:flex;width:100%;max-width:none;min-height:calc(100dvh - var(--ide-title-height) - var(--ide-tab-height) - var(--ide-status-height));flex-direction:column;margin:0;padding:0;border:0;border-radius:0;box-shadow:none}
  .backend-admin.workspace-open #app #registrationScreen .page-head{display:flex;flex:none;justify-content:flex-end;margin:0;padding:6px 16px;border-bottom:1px solid var(--border)}
  .backend-admin.workspace-open #app #registrationScreen .page-head h2{display:none}
  .backend-admin.workspace-open #app #registrationScreen #registrationMsg{margin:0;padding:0 16px}
  .backend-admin.workspace-open #app #registrationScreen .registration-panel{display:flex;flex:1;min-height:0;flex-direction:column;width:100%;margin:0;border:0;border-radius:0;background:var(--surface);overflow:hidden}
  .backend-admin.workspace-open #app #registrationScreen .registration-panel>.inventory-panel-title{flex:none;padding:8px 16px;background:var(--ide-panel)}
  .backend-admin.workspace-open #app #registrationScreen .registration-panel>.inventory-panel-title h3{margin:0;color:var(--text);font-size:13px}
  .backend-admin.workspace-open #app #registrationScreen .registration-panel>.form-card{flex:none;margin:0;padding:10px 16px;border:0;border-bottom:1px solid var(--border);border-radius:0;background:transparent}
  .backend-admin.workspace-open #app #registrationScreen .registration-panel>.form-card>p{margin:0 0 8px;font-size:12px}
  .backend-admin.workspace-open #app #registrationScreen .device-provisioning-panels{grid-template-columns:minmax(0,1.45fr) minmax(220px,.75fr);gap:10px}
  .backend-admin.workspace-open #app #registrationScreen .device-provisioning-controls{gap:8px;padding:10px;background:var(--surface)}
  .backend-admin.workspace-open #app #registrationScreen .device-provisioning-controls>label{font-size:11px}
  .backend-admin.workspace-open #app #registrationScreen .device-provisioning-controls .device-provisioning-actions{gap:6px}
  .backend-admin.workspace-open #app #registrationScreen .device-provisioning-controls .device-provisioning-actions button{min-height:28px;padding:3px 8px;font-size:11px}
  .backend-admin.workspace-open #app #registrationScreen .device-provisioning-status,
  .backend-admin.workspace-open #app #registrationScreen .device-pairing-code-status{margin:0;font-size:11px}
  .backend-admin.workspace-open #app #registrationScreen .device-provisioning-qr-panel{min-height:180px;padding:8px;background:var(--surface)}
  .backend-admin.workspace-open #app #registrationScreen .device-provisioning-qr-image{width:min(100%,180px)}
  .backend-admin.workspace-open #app #registrationScreen .registration-seats-table-wrap{flex:1;min-height:0;max-height:none;margin:0;overflow:auto}
  .backend-admin.workspace-open #app #registrationScreen .registration-seats-table{width:100%;min-width:520px;table-layout:fixed;border-collapse:collapse}
  .backend-admin.workspace-open #app #registrationScreen .registration-seats-table th,
  .backend-admin.workspace-open #app #registrationScreen .registration-seats-table td{overflow:hidden;padding:4px 10px;border-bottom:1px solid var(--border);font-size:12px;line-height:1.25;text-align:left;text-overflow:ellipsis;white-space:nowrap}
  .backend-admin.workspace-open #app #registrationScreen .registration-seats-table th{background:var(--ide-panel);color:var(--muted);font-weight:600}
  .backend-admin.workspace-open #app #registrationScreen .registration-seats-table th:nth-child(1){width:10%}
  .backend-admin.workspace-open #app #registrationScreen .registration-seats-table th:nth-child(2){width:44%}
  .backend-admin.workspace-open #app #registrationScreen .registration-seats-table th:nth-child(3){width:25%}
  .backend-admin.workspace-open #app #registrationScreen .registration-seats-table th:nth-child(4){width:21%}
  .backend-admin.workspace-open #app #registrationScreen .registration-seats-table tbody tr[data-seat-id]{cursor:pointer}
  .backend-admin.workspace-open #app #registrationScreen .registration-seats-table tbody tr[data-seat-id]:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
  .backend-admin.workspace-open #app #registrationScreen .registration-seats-table tbody tr[aria-selected=true]{background:#dbeafe}
  .backend-admin.workspace-open #app #registrationScreen .registration-seats-table tbody tr[aria-selected=true] td{color:#1e3a8a}
  .backend-admin .reset-data-details-sidebar{position:fixed;top:var(--ide-title-height);right:0;bottom:var(--ide-status-height);z-index:19;display:flex;flex-direction:column;width:320px;padding:12px;background:var(--ide-panel);color:var(--text);border-left:1px solid var(--border);overflow:hidden}
  .backend-admin .reset-data-details-sidebar[hidden]{display:none}
  .backend-admin .reset-data-details-header{padding-bottom:8px;border-bottom:1px solid var(--border)}
  .backend-admin .reset-data-details-header h2{margin:0;font-size:16px}
  .backend-admin .reset-data-details-body{display:flex;flex:1;min-height:0;flex-direction:column;gap:10px;padding:12px 0;overflow-y:auto}
  .backend-admin .reset-data-details-body p{margin:0;font-size:13px}
  .backend-admin .reset-data-confirmation-note{color:var(--muted)}
  .backend-admin .reset-data-detail-action{margin-top:auto}
  .backend-admin .reset-data-detail-action[hidden]{display:none}
  .backend-admin .reset-data-detail-action button{width:100%;min-height:34px}
  .backend-admin #userGroupForm{display:flex;flex:1;flex-direction:column;gap:8px;min-height:0;padding:12px 0 0;overflow-y:auto}
  .backend-admin #userGroupForm[hidden]{display:none}
  .backend-admin #userGroupForm label:not(.check){display:flex;flex-direction:column;gap:2px;font-size:12px}
  .backend-admin #userGroupForm label.check{display:flex;flex-direction:row;align-items:center;gap:6px}
  .backend-admin #userGroupForm input:not([type=hidden]):not([type=checkbox]),
  .backend-admin #userGroupForm select,
  .backend-admin #userGroupForm textarea{min-height:28px;padding:2px 7px;font-size:12px;font-weight:400}
  .backend-admin #userGroupForm input[type=checkbox]{width:14px;height:14px;min-height:14px;padding:0}
  .backend-admin #userGroupPermissionSections{display:grid;gap:6px}
  .backend-admin #userGroupPermissionSections .permission-section{margin:0;padding:4px 8px}
  .backend-admin #userGroupPermissionSections .permission-section summary{padding:2px 0;font-size:12px}
  .backend-admin #userGroupPermissionSections .permission-table{margin-top:4px}
  .backend-admin #userGroupPermissionSections .permission-table th,
  .backend-admin #userGroupPermissionSections .permission-table td{padding:2px 4px;font-size:11px}
  .backend-admin #userGroupForm .modal-actions{position:sticky;bottom:0;gap:6px;margin-top:auto;padding:8px 0 0;background:var(--ide-panel);border-top:1px solid var(--border)}
  .backend-admin #userGroupForm .modal-actions button{min-height:28px;padding:0 10px;font-size:12px}
  .backend-admin .ide-sidebar nav{display:flex;flex-direction:column;gap:12px}
  .backend-admin .ide-sidebar-title{padding-left:8px}
  .backend-admin .workspace-nav-group{min-width:0}
  .backend-admin .workspace-nav-group summary{display:flex;align-items:center;gap:6px;min-height:28px;padding:0 20px;color:var(--muted);font-size:10px;font-weight:600;letter-spacing:.4px;text-transform:uppercase;list-style:none;cursor:pointer;user-select:none}
  .backend-admin .workspace-nav-group summary::-webkit-details-marker{display:none}
  .backend-admin .workspace-nav-group summary:hover{color:var(--text);background:var(--ide-hover)}
  .backend-admin .workspace-nav-chevron{width:14px;height:14px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;transition:transform .12s ease}
  .backend-admin .workspace-nav-group[open] .workspace-nav-chevron{transform:rotate(90deg)}
  .backend-admin .workspace-nav-items{display:grid;gap:2px;margin-top:3px}
  .backend-admin .workspace-nav-group:not([open]) > .workspace-nav-items{display:none}
  .backend-admin .workspace-nav-items .workspace-nav-button{display:flex;align-items:center;gap:9px;width:100%;min-height:34px;padding:0 24px;border:0;border-radius:4px;background:transparent;color:var(--text);font-size:14px;font-weight:400;text-align:left}
  .backend-admin .workspace-nav-items .workspace-nav-button:hover{background:var(--ide-hover)}
  .backend-admin .workspace-nav-items .workspace-nav-button[aria-current=page]{background:var(--ide-hover);box-shadow:inset 2px 0 var(--accent);font-weight:600}
  .backend-admin .workspace-nav-icon{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
  .backend-admin .workspace-nav-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  @media(min-width:701px){
    :root:has(body.backend-admin){--font-scale:1;--ide-sidebar-width:232px;--ide-audit-sidebar-width:320px}
    .backend-admin{--ide-title-height:56px;--ide-tab-height:36px;--ide-status-height:28px;--control-h-sm:28px;--control-h-md:32px;--control-h-lg:36px;--input-h:32px}
    .backend-admin .ide-titlebar strong{font-size:15px}
    .backend-admin .ide-titlebar span,
    .backend-admin .ide-titlebar button,
    .backend-admin .ide-tabs button{font-size:14px}
    .backend-admin .ide-sidebar-title{font-size:12px}
    .backend-admin .ide-sidebar nav button{font-size:14px}
    body.backend-admin .device-theme-control{font-size:14px}
    body.backend-admin .device-theme-control select{font-size:14px}
    .backend-admin .page-head h2{font-size:24px}
    .backend-admin .ide-titlebar{display:flex;align-items:center;gap:12px;padding:0 12px;background:var(--chrome)}
    .backend-admin .ide-titlebar #ideWorkspaceLabel{font-size:13px}
    body.backend-admin .ide-titlebar .backend-titlebar-theme{display:flex;align-items:center;gap:6px;flex:0 0 auto;margin:0 0 0 auto;color:var(--muted);font-size:12px;font-weight:500}
    body.backend-admin .ide-titlebar .backend-titlebar-theme select{width:auto;min-width:86px;height:32px;min-height:32px;padding:2px 8px;font-size:12px}
    body.backend-admin .ide-titlebar .backend-titlebar-theme .theme-slide-toggle{width:88px;height:32px;min-height:32px;padding:2px;font-size:11px}
    .backend-admin .ide-titlebar .backend-titlebar-theme-message:empty{display:none}
    .backend-admin .ide-titlebar .backend-titlebar-theme-message:not(:empty){display:block;margin:0;color:var(--danger);font-size:12px}
    .backend-admin .ide-sidebar{padding:14px 8px;background:var(--ide-panel)}
    .backend-admin .ide-tabs{height:var(--ide-tab-height);gap:2px;padding:3px 6px 0;align-items:end}
    .backend-admin #ideTabs #lotteryRowCount{position:sticky;right:0;z-index:1;display:flex;flex:0 0 auto;align-items:center;margin-left:auto;padding:0 12px;background:var(--ide-panel);color:var(--accent);font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}
    .backend-admin .ide-tab{display:flex;flex:none;align-items:center;min-height:31px;border:1px solid transparent;border-bottom:0;border-radius:4px 4px 0 0;background:var(--ide-panel)}
    .backend-admin .ide-tab.is-active{background:var(--surface);border-color:var(--border);box-shadow:inset 0 2px var(--accent)}
    .backend-admin .ide-tab-open{min-height:30px;padding:0 8px;border:0;border-radius:0;background:transparent;color:var(--muted);font-size:13px;font-weight:400}
    .backend-admin .ide-tab-open[aria-current=page]{color:var(--text);background:transparent;box-shadow:none;font-weight:500}
    .backend-admin .ide-tab-close{width:20px;height:20px;min-height:20px;margin:0 4px 0 0;padding:0;border:0;border-radius:3px;background:transparent;color:var(--muted);font-size:16px;font-weight:400;line-height:1}
    .backend-admin .ide-tab-close:hover{background:var(--ide-hover);color:var(--text)}
    .backend-admin .ide-tab-close{visibility:hidden;opacity:0}
    .backend-admin .ide-tab:hover .ide-tab-close,
    .backend-admin .ide-tab.is-active .ide-tab-close,
    .backend-admin .ide-tab-close:focus-visible{visibility:visible;opacity:1}
    .backend-admin .ide-tab.is-dirty .ide-tab-open::after{content:"";display:inline-block;width:6px;height:6px;margin-left:7px;border-radius:50%;background:var(--text);vertical-align:middle}
    .backend-admin.workspace-open #app .screen .page-head h2{display:none}
    .backend-admin .ide-statusbar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center}
    .backend-admin .ide-statusbar #shiftCurrentDateTime{grid-column:2;justify-self:center;white-space:nowrap;font-size:12px}
    .backend-admin .ide-statusbar #ideVersionButton{grid-column:1;justify-self:start}
  }
  .backend-admin .ide-brand-stack{display:grid;grid-template-columns:36px max-content;grid-template-rows:1fr 1fr;align-items:center;column-gap:8px;flex:none;height:100%}
  .backend-admin .ide-titlebar .ide-brand-stack{min-width:0}
  .backend-admin .ide-titlebar #ideMenuBtn{grid-column:1;grid-row:1 / 3;align-self:center}
  .backend-admin .ide-titlebar #ideWorkspaceLabel{grid-column:2;grid-row:2;align-self:start;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;font-size:12px;line-height:14px}
  .backend-admin .ide-titlebar #ideHeaderSearch{flex:1;display:flex;align-items:center;width:100%;min-width:140px;max-width:560px;margin:0 auto}
  .backend-admin .ide-titlebar #ideHeaderSearch[hidden],
  .backend-admin .ide-titlebar #ideHeaderSearch input[hidden]{display:none}
  .backend-admin .ide-titlebar #ideHeaderSearch input{width:100%;min-width:0;max-width:none;height:34px;min-height:34px;padding:5px 10px;font-size:14px}
  .backend-admin .ide-titlebar .backend-titlebar-actions{display:flex;align-items:center;gap:12px;min-width:0;margin-left:auto}
  body.backend-admin .ide-titlebar .backend-titlebar-theme{display:flex;align-items:center;gap:8px;flex:0 0 auto;margin:0;color:var(--muted);font-size:12px;font-weight:500}
  body.backend-admin .ide-titlebar .backend-titlebar-theme select{width:auto;min-width:82px;height:30px;min-height:30px;padding:3px 6px;font-size:12px}
  body.backend-admin .ide-titlebar .backend-titlebar-theme .theme-slide-toggle{width:88px;height:30px;min-height:30px;padding:2px;font-size:11px}
  .backend-admin .ide-titlebar .backend-titlebar-theme-message:empty{display:none}
  .backend-admin .ide-titlebar .backend-titlebar-theme-message:not(:empty){display:block;margin:0;color:var(--danger);font-size:12px}
  .device-frontend .ide-statusbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,1fr);align-items:center}
  .device-frontend .ide-statusbar #ideVersionButton{grid-column:1;justify-self:start}
  .device-frontend .ide-statusbar #ideStatusUser{grid-column:2;justify-self:center}
  .device-frontend .ide-statusbar #shiftCurrentDateTime{grid-column:3;justify-self:end}
  .device-frontend .ide-statusbar #ideShiftTabLabel{grid-column:3;justify-self:end}
  .backend-admin #employeeSetupScreen #employeeArchiveToggleBtn[aria-checked=true]{background:var(--accent);border-color:var(--accent);color:#fff}
  .backend-admin #employeeSetupScreen #employeeArchiveToggleBtn[aria-checked=true]:hover{background:var(--accent-dark);border-color:var(--accent-dark);color:#fff}
  .backend-admin .ide-sidebar .backend-sidebar-account{display:block;margin-top:auto;padding:12px 8px 0;border-top:1px solid var(--border);color:var(--muted)}
  .backend-admin .ide-sidebar .backend-sidebar-account .sidebar-user{display:flex;align-items:center;gap:9px}
  .backend-admin .ide-sidebar .backend-sidebar-account .sidebar-user span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .backend-admin .ide-sidebar .backend-sidebar-account .user-avatar{width:32px;height:32px;min-height:32px;flex:none;display:grid;place-items:center;padding:0;border:0;border-radius:50%;color:#fff;background:var(--accent);font-size:14px;font-weight:600}
  .backend-admin .ide-sidebar .backend-sidebar-account .user-avatar:hover{color:#fff;background:#168ddd}
  .backend-admin .ide-sidebar .backend-sidebar-account .user-avatar:focus-visible{outline-offset:2px}
  .backend-admin .ide-brand-stack strong{grid-column:2;grid-row:1;align-self:end;text-align:center;font-size:16px;line-height:18px;color:var(--accent);text-transform:uppercase}
  .backend-admin .ide-titlebar .sidebar-toggle-icon{width:36px;height:36px;min-height:36px;padding:2px;display:flex;align-items:center;justify-content:center;background:transparent;border:0;border-radius:4px;flex-shrink:0}
  .backend-admin .ide-titlebar .sidebar-toggle-icon svg{width:22px;height:22px}
  .backend-admin .ide-titlebar .sidebar-toggle-icon:hover,
  .backend-admin .ide-titlebar .backend-audit-toggle:hover{background:var(--ide-hover)}
  .backend-admin .ide-titlebar .backend-audit-toggle{display:flex;align-items:center;justify-content:center;width:36px;height:36px;min-height:36px;margin-left:6px;padding:2px;border:0;border-radius:4px;background:transparent;flex:none}
  .backend-admin .ide-titlebar .backend-audit-toggle svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
  .backend-admin .ide-titlebar .backend-audit-toggle[hidden]{display:none}
  .backend-admin #loginScreen .backend-login-logo{width:56px;height:56px;margin:0 auto 10px;border:0;border-radius:8px;background:var(--accent);color:#fff;font-size:30px;font-weight:700}
  .backend-admin #loginScreen .backend-login-eyebrow{margin:0;color:var(--accent);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
  .backend-admin #loginScreen .backend-login-brand h1{margin:4px 0 6px;font-size:28px;letter-spacing:-.4px}
  .backend-admin #loginScreen .backend-login-brand > p:last-child{margin:0;color:var(--muted)}
  .backend-admin #loginScreen.active{display:grid;place-items:center;min-height:100vh;padding:24px;background:var(--bg)}
  .backend-admin #loginScreen > .card.login-card{width:min(440px,100%);min-height:0;margin:0;padding:36px;border:1px solid var(--border);border-radius:6px;background:var(--surface);box-shadow:0 8px 32px rgb(0 0 0 / 10%)}
  .backend-admin #loginScreen .device-theme-control{position:fixed;top:16px;right:20px;z-index:2;display:flex;flex-direction:row;align-items:center;gap:8px;margin:0;font-size:12px}
  .backend-admin #loginScreen .device-theme-control select{width:auto;min-width:82px;min-height:30px;font-size:12px}
  html[data-theme],body:is(.device-frontend,.backend-admin){
    --bg:#f3f3f3;--surface:#fff;--text:#252526;--muted:#616161;--border:#cecece;
    --accent:#007acc;--accent-dark:#005fa3;--danger:#b52020;--ok:#20753c;
    --radius-sm:3px;--radius-md:4px;--radius-lg:6px;--shadow:none;
    --ide-chrome:#e8e8e8;--ide-panel:#f3f3f3;--ide-hover:#e4e6e9;
    color-scheme:light;
  }
  html[data-theme=dark],html[data-theme=dark] body:is(.device-frontend,.backend-admin){
    --bg:#1e1e1e;--surface:#1e1e1e;--text:#d4d4d4;--muted:#aaa;--border:#454545;
    --accent:#007acc;--accent-dark:#168ddd;--danger:#f48771;--ok:#89d185;
    --ide-chrome:#323233;--ide-panel:#252526;--ide-hover:#37373d;
    color-scheme:dark;
  }
  html[data-theme] body{background:var(--bg);color:var(--text)}
  .backend-admin .backend-sidebar-account .sidebar-user span{font-size:16px}
  #ideShell[hidden]{display:none}
  .ide-titlebar{position:fixed;inset:0 0 auto;z-index:20;height:var(--ide-title-height);display:flex;align-items:center;gap:20px;padding:0 16px;background:var(--ide-chrome);border-bottom:1px solid var(--border);color:var(--text)}
  .ide-titlebar span{color:var(--muted);font-size:16px}
  .ide-titlebar button{min-height:44px;font-size:16px}
  .ide-sidebar{position:fixed;left:0;top:var(--ide-title-height);bottom:var(--ide-status-height);width:var(--ide-sidebar-width);z-index:19;background:var(--ide-panel);border-right:1px solid var(--border);padding:16px 8px;overflow:auto}
  .ide-sidebar-title{font-size:14px;letter-spacing:1px;padding:0 12px 16px;color:var(--muted)}
  .ide-sidebar nav{display:grid;gap:4px}
  .ide-sidebar nav button{text-align:left;min-height:52px;font-size:18px;font-weight:500;background:transparent;border:0;border-radius:0;padding:10px 12px;color:var(--text)}
  .ide-sidebar nav button:hover{background:var(--ide-hover)}
  .ide-sidebar .device-theme-control{margin-top:24px;flex-direction:column;align-items:stretch;font-size:16px}
  .ide-sidebar .device-theme-control select{width:100%}
  .ide-tabs{position:fixed;top:var(--ide-title-height);left:var(--ide-sidebar-width);right:0;height:var(--ide-tab-height);display:flex;overflow:auto;background:var(--ide-panel);z-index:18;border-bottom:1px solid var(--border)}
  .ide-tabs button{flex:none;min-height:var(--ide-tab-height);padding:0 20px;font-size:18px;font-weight:500;border:0;border-right:1px solid var(--border);border-radius:0;background:var(--ide-panel);color:var(--muted)}
  .ide-tabs button[aria-current=page]{background:var(--surface);color:var(--text);box-shadow:inset 0 3px var(--accent)}
  .ide-statusbar{position:fixed;inset:auto 0 0;z-index:20;height:var(--ide-status-height);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;background:#007acc;color:#fff;font-size:14px}
  .backend-admin .ide-sidebar{bottom:0;display:flex;flex-direction:column;padding-bottom:10px;transform:translateX(0);visibility:visible;transition:transform 180ms ease,visibility 0s}
  .backend-admin.sidebar-collapsed .ide-sidebar{display:flex;transform:translateX(-100%);visibility:hidden;pointer-events:none;transition:transform 180ms ease,visibility 0s 180ms}
  .backend-admin .ide-tabs{transition:left 180ms ease,right 180ms ease}
  .backend-admin .ide-statusbar{left:var(--ide-sidebar-width);transition:left 180ms ease}
  .backend-admin.sidebar-collapsed .ide-statusbar{left:0}
  body:is(.device-frontend,.backend-admin) .ide-statusbar #ideVersionButton{min-height:24px;padding:0 4px;border:0;background:transparent;color:#fff;font-size:inherit;font-weight:500}
  body:is(.device-frontend,.backend-admin) .ide-statusbar #ideVersionButton:hover{text-decoration:underline}
  body:is(.device-frontend,.backend-admin) .ide-statusbar #ideVersionButton:focus-visible{outline:2px solid #fff;outline-offset:2px}
  .workspace-open #app{margin-left:var(--ide-sidebar-width);padding-top:calc(var(--ide-title-height) + var(--ide-tab-height));padding-bottom:var(--ide-status-height);min-width:0}
  .backend-admin.workspace-open #app .screen>.card{padding-top:0}
  .backend-admin.workspace-open #app .screen .page-head{margin-top:0;margin-bottom:0;padding-top:0;padding-bottom:0}
  .backend-admin.workspace-open #app .screen>.card>.msg:empty{display:none}
  .backend-admin.workspace-open #storeSetupScreen .store-sticky-head{display:none}
  .backend-admin.workspace-open #app .screen .inventory-panel:first-of-type{margin-top:0}
  .backend-admin .screen details>summary{display:none}
  .backend-admin.workspace-open{height:100vh;height:100dvh;overflow:hidden}
  .backend-admin.workspace-open #app{position:fixed;top:calc(var(--ide-title-height) + var(--ide-tab-height));right:var(--ide-audit-sidebar-width);bottom:var(--ide-status-height);left:var(--ide-sidebar-width);margin:0;padding:0;overflow-y:auto;overscroll-behavior:contain;transition:left 180ms ease,right 180ms ease}
  .backend-admin.workspace-open.sidebar-collapsed #app{left:0}
  .backend-admin.workspace-open #remoteSupportScreen.active{position:fixed;top:calc(var(--ide-title-height) + var(--ide-tab-height));right:var(--ide-audit-sidebar-width);bottom:var(--ide-status-height);left:var(--ide-sidebar-width);min-height:0;max-width:none;margin:0;padding:0;overflow-y:auto;overscroll-behavior:contain;transition:left 180ms ease,right 180ms ease}
  .backend-admin.workspace-open.sidebar-collapsed #remoteSupportScreen.active{left:0}
  .backend-admin .ide-audit-sidebar{position:fixed;top:var(--ide-title-height);right:0;bottom:var(--ide-status-height);z-index:19;display:flex;flex-direction:column;width:320px;padding:12px;background:var(--ide-panel);border-left:1px solid var(--border);overflow:hidden;transition:transform 180ms ease,visibility 0s}
  .backend-admin .ide-audit-sidebar[hidden]{display:none}
  .backend-admin .audit-sidebar-header{display:flex;align-items:center;justify-content:space-between;gap:8px}
  .backend-admin .audit-sidebar-header h2{margin:0;font-size:16px}
  .backend-admin .audit-search{width:100%;min-height:34px;margin-top:10px;padding:6px 8px}
  .backend-admin .audit-sidebar-description{margin:8px 0;color:var(--muted);font-size:12px}
  .backend-admin .audit-events{flex:1;min-height:0;overflow-y:auto}
  .backend-admin .audit-event{padding:10px 2px;border-top:1px solid var(--border)}
  .backend-admin .audit-event-heading{display:flex;justify-content:space-between;gap:8px;font-size:13px}
  .backend-admin .audit-event-heading strong{min-width:0;overflow-wrap:anywhere}
  .backend-admin .audit-event time,.backend-admin .audit-event-meta{color:var(--muted);font-size:11px}
  .backend-admin .audit-event-description{margin:5px 0;font-size:12px;overflow-wrap:anywhere}
  .backend-admin .audit-empty{padding:12px 2px;color:var(--muted);font-size:13px}
  .backend-admin .audit-empty.error{color:var(--danger)}
  .backend-admin.workspace-open #lotteryInventoryScreen .card{padding-top:0}
  .backend-admin.workspace-open #lotteryInventoryScreen .shift-sticky-head{display:none}
  .backend-admin.workspace-open #lotteryInventoryScreen #shiftOpenPanel{margin-top:0}
  .backend-admin.workspace-open #lotteryInventoryScreen #shiftOpenPanel > summary{display:none}
  .backend-admin.workspace-open #lotteryInventoryScreen #shiftHistoryWrap{display:none}
  .backend-admin .ide-tabs{right:var(--ide-audit-sidebar-width)}
  .backend-admin.audit-sidebar-collapsed{--ide-audit-sidebar-width:0px}
  .backend-admin.audit-sidebar-collapsed .ide-audit-sidebar{visibility:hidden;transform:translateX(100%)}
  .backend-admin.user-group-details-open.audit-sidebar-collapsed{--ide-audit-sidebar-width:320px}
  .backend-admin.reset-data-details-open.audit-sidebar-collapsed{--ide-audit-sidebar-width:320px}
  .backend-admin.lottery-details-open.audit-sidebar-collapsed{--ide-audit-sidebar-width:320px}
  .backend-admin.registration-seat-details-open.audit-sidebar-collapsed{--ide-audit-sidebar-width:320px}
  @media(prefers-reduced-motion:reduce){
    .backend-admin .ide-sidebar,
    .backend-admin.sidebar-collapsed .ide-sidebar,
    .backend-admin .ide-tabs,
    .backend-admin .ide-statusbar,
    .backend-admin.workspace-open #app,
    .backend-admin.workspace-open #remoteSupportScreen.active,
    .backend-admin .ide-audit-sidebar{transition:none}
  }
  .backend-admin .workspace-search-hidden{display:none!important}
  @media(min-width:701px) and (max-width:1100px){
    .backend-admin{--ide-audit-sidebar-width:0px}
    .backend-admin .ide-audit-sidebar{width:min(320px,88vw);box-shadow:-5px 0 16px rgb(0 0 0 / 12%)}
    .backend-admin .user-group-details-sidebar{width:min(320px,88vw);box-shadow:-5px 0 16px rgb(0 0 0 / 12%)}
    .backend-admin .registration-seat-details-sidebar{width:min(320px,88vw);box-shadow:-5px 0 16px rgb(0 0 0 / 12%)}
    .backend-admin .reset-data-details-sidebar{width:min(320px,88vw);box-shadow:-5px 0 16px rgb(0 0 0 / 12%)}
    .backend-admin .lottery-details-sidebar{width:min(320px,88vw);box-shadow:-5px 0 16px rgb(0 0 0 / 12%)}
    .backend-admin.user-group-details-open.audit-sidebar-collapsed{--ide-audit-sidebar-width:0px}
    .backend-admin.registration-seat-details-open.audit-sidebar-collapsed{--ide-audit-sidebar-width:0px}
    .backend-admin.reset-data-details-open.audit-sidebar-collapsed{--ide-audit-sidebar-width:0px}
    .backend-admin.lottery-details-open.audit-sidebar-collapsed{--ide-audit-sidebar-width:0px}
  }
  .workspace-open #app .screen{min-height:calc(100dvh - var(--ide-title-height) - var(--ide-tab-height) - var(--ide-status-height));max-width:none;padding:0}
  .workspace-open #app .screen > .card{min-height:calc(100dvh - var(--ide-title-height) - var(--ide-tab-height) - var(--ide-status-height));border-radius:0;border:0;box-shadow:none}
  .sidebar-collapsed .ide-sidebar{display:none}
  .sidebar-collapsed .ide-tabs{left:0}
  .sidebar-collapsed #app{margin-left:0}
  body:is(.device-frontend,.backend-admin) .device-theme-control{display:flex;align-items:center;justify-content:flex-end;gap:12px;font-size:18px;margin-bottom:20px;color:var(--text)}
  body:is(.device-frontend,.backend-admin) .device-theme-control select{width:132px;min-height:48px;font-size:20px}
  body:is(.device-frontend,.backend-admin) .device-theme-message:not(:empty){display:block;color:var(--danger)}
  html[data-theme] body :is(label,h1,h2,h3,th,td,.module,.toolbar-button,.report-store-name,.shift-history-title){color:var(--text)}
  html[data-theme] body :is(.muted,.module small,.page-subtitle,.report-store-meta,.book-value-line,.location-assigned-line,.shift-history-summary,.report-summary-card .label){color:var(--muted)}
  html[data-theme] body :is(.card,.modal-card,.table-wrap){background:var(--surface);border-color:var(--border);box-shadow:none;border-radius:4px}
  html[data-theme] body :is(.inventory-panel summary,.panel-toolbar,.book-actions,th,.shift-history-toggle,.shift-history-details,.report-summary-card,.modal-head,.modal-actions,.form-card){background:var(--ide-panel);border-color:var(--border)}
  html[data-theme] body :is(input,select,textarea,button){background:var(--surface);color:var(--text);border-color:var(--border)}
  html[data-theme] body :is(input,select,textarea):focus{border-color:var(--accent);box-shadow:0 0 0 2px rgba(0,122,204,.3)}
  html[data-theme] body :is(button:hover,tbody tr:hover){background:var(--ide-hover)}
  html[data-theme] body :is(.primary,.primary:hover){background:var(--accent);border-color:var(--accent);color:#fff}
  html[data-theme] body :is(.selected-row,.selected-row:hover,.shift-book-row.selected){background:var(--ide-hover)!important;box-shadow:inset 3px 0 var(--accent)}
  html[data-theme] body #loginScreen{background:var(--bg)}
  html[data-theme] body #loginScreen .login-card{background:var(--surface);border:1px solid var(--border);border-radius:6px;box-shadow:0 8px 32px rgba(0,0,0,.1)}
  html[data-theme] body #loginScreen .brand h1{color:var(--text);letter-spacing:-.5px}
  html[data-theme] body.device-frontend #loginScreen .brand h1{color:var(--accent)}
  html[data-theme] body #loginScreen :is(.brand p,.hint){color:var(--muted)}
  html[data-theme] body #loginScreen .logo{background:#007acc;color:#fff;border-radius:8px;box-shadow:none}
  html[data-theme] body :is(#loginUser,#loginPassword,#loginPasswordToggle,#backendSetupOpenBtn),
  html[data-theme] body #loginPinPad .pin-key{background:var(--ide-panel);color:var(--text);border-color:var(--border);border-radius:4px}
  html[data-theme] body #loginForm label,html[data-theme] body #loginPinPad .pin-pad-label{color:var(--text)}
  html[data-theme] body #loginForm > button[type=submit]{background:#007acc;color:#fff;border-color:#007acc;border-radius:4px;box-shadow:none}
  html[data-theme] body #loginForm > button[type=submit]:hover{background:#168ddd}
  html[data-theme] body #loginPinPad .pin-key:active{background:var(--ide-hover)}
  html[data-theme] body #loginPinPad .pin-dot.filled{background:#007acc;border-color:#007acc}
  html[data-theme=dark] body .badge.on{background:#24452b;color:#b5e7bf}
  html[data-theme=dark] body .badge.off{background:#512b2b;color:#ffb4ab}
  html[data-theme=dark] body.backend-admin .badge.book-status-assigned{background:#24452b;color:#b5e7bf}
  html[data-theme=dark] body.backend-admin .badge.book-status-archived,
  html[data-theme=dark] body.backend-admin .badge.book-status-unknown{background:#374151;color:#d1d5db}
  html[data-theme=dark] body.backend-admin .badge.book-status-returned{background:#1e3a5f;color:#bfdbfe}
  html[data-theme=dark] body.backend-admin .badge.book-status-unassigned{background:#553e17;color:#fcd34d}
  html[data-theme=dark] body.backend-admin .badge.book-status-stolen{background:#512b2b;color:#ffb4ab}
  html[data-theme=dark] body.backend-admin .badge.book-status-damaged{background:#653415;color:#fdba74}
  html[data-theme] body .receipt-preview-paper{background:#fff;color:#000}
  html[data-theme=dark] body.backend-admin{
    --bg:#1e1e1e;--surface:#1e1e1e;--text:#cccccc;--muted:#9d9d9d;--border:#3c3c3c;
    --accent:#007acc;--accent-dark:#006bb3;--danger:#f48771;--ok:#89d185;
    --ide-chrome:#3c3c3c;--ide-panel:#252526;--ide-hover:#2a2d2e;
  }
  html[data-theme=dark] body.backend-admin .ide-titlebar{background:#3c3c3c;border-color:#333}
  html[data-theme=dark] body.backend-admin .ide-sidebar{background:#252526;border-color:#333}
  html[data-theme=dark] body.backend-admin .user-group-details-sidebar{border-left-color:#333}
  html[data-theme=dark] body.backend-admin .registration-seat-details-sidebar{border-left-color:#333}
  html[data-theme=dark] body.backend-admin.workspace-open #app #registrationScreen .registration-seats-table tbody tr[aria-selected=true]{background:#1e3a5f}
  html[data-theme=dark] body.backend-admin.workspace-open #app #registrationScreen .registration-seats-table tbody tr[aria-selected=true] td{color:#bfdbfe}
  html[data-theme=dark] body.backend-admin #userGroupDetailsSidebar .permission-section,
  html[data-theme=dark] body.backend-admin #userGroupDetailsSidebar .permission-table th,
  html[data-theme=dark] body.backend-admin #userGroupDetailsSidebar .permission-table td{border-color:var(--border)}
  html[data-theme=dark] body.backend-admin .ide-tabs{background:#181818;border-color:#333}
  html[data-theme=dark] body.backend-admin .ide-tab{background:#2d2d30;border-color:#383838;color:#9d9d9d}
  html[data-theme=dark] body.backend-admin .ide-tab.is-active{background:#1e1e1e;border-color:#3c3c3c;box-shadow:inset 0 2px #007acc}
  html[data-theme=dark] body.backend-admin .ide-tab-open[aria-current=page]{color:#cccccc}
  html[data-theme=dark] body.backend-admin #lotterySetupScreen .inventory-panel,
  html[data-theme=dark] body.backend-admin #storeSetupScreen .inventory-panel,
  html[data-theme=dark] body.backend-admin #registrationScreen .inventory-panel,
  html[data-theme=dark] body.backend-admin #printerSetupScreen :is(.printer-panel,.audit-panel){background:#1e1e1e;border-color:#3c3c3c}
  html[data-theme=dark] body.backend-admin #storeSetupScreen .store-setup-panel,
  html[data-theme=dark] body.backend-admin #registrationScreen .device-provisioning-controls{background:#1e1e1e;border-color:#3c3c3c}
  html[data-theme=dark] body.backend-admin #registrationScreen .device-provisioning-qr-panel{background:#fff;border-color:#3c3c3c}
  html[data-theme=dark] body.backend-admin #storeSetupScreen :is(.store-setup-panel-title,.inventory-panel-title),
  html[data-theme=dark] body.backend-admin #registrationScreen .inventory-panel-title,
  html[data-theme=dark] body.backend-admin #printerSetupScreen .printer-panel-head{background:#2d2d30;border-color:#3c3c3c}
  html[data-theme=dark] body.backend-admin #storeSetupScreen .store-setup-panel-title h3,
  html[data-theme=dark] body.backend-admin #storeSetupScreen .inventory-panel-title h3,
  html[data-theme=dark] body.backend-admin #registrationScreen .inventory-panel-title h3{color:#cccccc}
  html[data-theme=dark] body.backend-admin #lotterySetupScreen .inventory-panel-title h3{color:#cccccc}
  html[data-theme=dark] body.backend-admin #printerSetupScreen .printer-discover-results,
  html[data-theme=dark] body.backend-admin #printerSetupScreen .printer-discover-list li{background:#252526;border-color:#3c3c3c}
  html[data-theme=dark] body.backend-admin :is(input,select,textarea):focus{border-color:#007acc;outline:1px solid #007acc;outline-offset:0;box-shadow:0 0 0 1px #007acc}
  html[data-theme=dark] body.backend-admin :is(button,a,[tabindex]):focus-visible{outline:1px solid #007acc;outline-offset:2px}
  @media(max-width:700px){
    .backend-admin{--ide-sidebar-width:210px;--ide-audit-sidebar-width:min(300px,88vw);--ide-title-height:52px;--ide-tab-height:36px;--ide-status-height:26px}
    .backend-admin .ide-titlebar{gap:7px;padding:0 7px}
    .backend-admin.workspace-open #app #employeeSetupScreen > .card{--employee-card-padding:12px;padding:0 0 12px}
    .backend-admin #employeeModalOverlay{padding:8px}
    .backend-admin #employeeModalOverlay .modal-card{max-height:calc(100% - 16px)}
    .backend-admin #employeeModalOverlay .modal-form{padding:10px}
    .backend-admin .user-group-details-sidebar{width:min(300px,88vw);box-shadow:-5px 0 16px rgb(0 0 0 / 12%)}
    .backend-admin .registration-seat-details-sidebar{width:min(300px,88vw);box-shadow:-5px 0 16px rgb(0 0 0 / 12%)}
    .backend-admin.workspace-open #app #registrationScreen .device-provisioning-panels{grid-template-columns:minmax(0,1fr)}
    .backend-admin.workspace-open #app #registrationScreen .device-provisioning-qr-panel{min-height:150px}
    .backend-admin.workspace-open #app #registrationScreen .registration-seats-table{min-width:480px}
    .backend-admin.user-group-details-open.audit-sidebar-collapsed{--ide-audit-sidebar-width:0px}
    .backend-admin.registration-seat-details-open.audit-sidebar-collapsed{--ide-audit-sidebar-width:0px}
    .backend-admin .reset-data-details-sidebar{width:min(300px,88vw);box-shadow:-5px 0 16px rgb(0 0 0 / 12%)}
    .backend-admin.reset-data-details-open.audit-sidebar-collapsed{--ide-audit-sidebar-width:0px}
    .backend-admin .lottery-details-sidebar{width:min(300px,88vw);box-shadow:-5px 0 16px rgb(0 0 0 / 12%)}
    .backend-admin.lottery-details-open.audit-sidebar-collapsed{--ide-audit-sidebar-width:0px}
    .backend-admin .ide-titlebar #ideWorkspaceLabel{display:block;font-size:10px;line-height:11px}
    .backend-admin .ide-titlebar .backend-titlebar-theme{font-size:0}
    .backend-admin .ide-titlebar .backend-titlebar-theme select{min-width:56px}
    .backend-admin .ide-titlebar .backend-titlebar-actions{gap:6px}
    .backend-admin .ide-titlebar #ideHeaderSearch{min-width:80px;margin:0}
    .backend-admin .ide-titlebar #ideHeaderSearch input{height:34px;min-height:34px;padding:4px 6px;font-size:12px}
    .backend-admin .ide-sidebar nav button{font-size:14px}
    .backend-admin .ide-tabs button{padding:0 10px;font-size:14px}
    .backend-admin #loginScreen > .card.login-card{padding:28px 20px}
    .backend-admin #loginScreen .device-theme-control{top:10px;right:10px}
    .backend-admin .ide-audit-sidebar{width:min(300px,88vw);box-shadow:-5px 0 16px rgb(0 0 0 / 12%)}
    .backend-admin.audit-sidebar-collapsed .ide-audit-sidebar{visibility:hidden}
    .backend-admin .ide-titlebar .backend-titlebar-theme{gap:3px;font-size:10px}
    .backend-admin .ide-titlebar .backend-titlebar-theme select{min-width:66px;height:30px;min-height:30px;padding:2px 4px;font-size:11px}
    .backend-admin .ide-titlebar .backend-audit-toggle{width:32px;height:32px;min-height:32px;margin-left:0}
  }
  @media(max-width:450px){
    .backend-admin .ide-statusbar #shiftCurrentDateTime{display:none}
  }
}
@media print{
  .lottery-screen-price{display:none!important}
  #ideShell,.device-theme-control,.device-theme-message{display:none!important}
  .workspace-open #app{margin:0;padding:0}
}

@media screen{
  .device-frontend{--ide-sidebar-width:248px;--ide-title-height:calc(80px + env(safe-area-inset-top, 0px));--ide-tab-height:0px;--ide-status-height:36px}
  .device-frontend.workspace-open #app .screen .page-head h2{display:none}
  body.device-frontend .ide-statusbar{font-weight:400}
  body.device-frontend .ide-statusbar #ideVersionButton,
  body.device-frontend .ide-statusbar #ideStatusUser,
  body.device-frontend .ide-statusbar #shiftCurrentDateTime{font-weight:400}
  .device-frontend #loginScreen{position:relative;padding-top:max(100px,env(safe-area-inset-top))}
  .device-frontend #loginScreen > .frontend-top-theme{
    position:absolute;
    top:max(20px,env(safe-area-inset-top));
    left:50%;
    right:auto;
    margin:0;
    transform:translateX(-50%);
  }
  .device-frontend .ide-titlebar .frontend-top-theme{margin:0 0 0 auto;flex-shrink:0;font-size:18px}
  .device-frontend .ide-titlebar .frontend-top-theme select{width:112px;min-height:48px}
  .device-frontend .ide-device-account{margin-top:0}
  .device-frontend .ide-titlebar{gap:16px;padding-top:env(safe-area-inset-top, 0px);background:var(--surface)}
  .device-frontend .ide-titlebar .frontend-titlebar-logout{flex:none;margin-left:auto}
  .lottery-id-name,.lottery-id-detail{display:block}
  .lottery-id-detail{margin-top:2px;font-size:.78em;opacity:.72;font-variant-numeric:tabular-nums}
  .device-frontend #lotteryInventoryScreen .shift-table tbody td{padding-top:8px;padding-bottom:8px;height:52px}
  html[data-theme=light] body.device-frontend :is(#app,#ideShell) :is(input,select,textarea):not(:focus){border-color:#a6a6a6}
  html[data-theme=dark] body.device-frontend :is(#app,#ideShell) :is(input,select,textarea):not(:focus){border-color:#686868}
  .device-frontend .login-sign-in-options{display:grid;gap:12px}
  .device-frontend .login-sign-in-options[hidden],
  .device-frontend .login-option-buttons button[hidden]{display:none}
  .device-frontend #loginOptionsLabel{font-size:20px;font-weight:650;color:var(--text)}
  .device-frontend .login-option-buttons{display:flex;gap:12px}
  .device-frontend .login-option-buttons button{display:flex;align-items:center;justify-content:center;gap:12px;flex:1;min-height:64px;font-size:22px;padding:12px}
  .device-frontend .login-option-buttons svg{width:28px;height:28px;flex-shrink:0}
  .device-frontend .login-option-buttons button[aria-pressed=true]{border-color:var(--accent);box-shadow:inset 0 -3px var(--accent);background:var(--ide-hover)}
  .device-frontend .login-credential-card{max-width:656px}
  .device-frontend #loginForm > #loginSubmitBtn{display:none}
  .device-frontend #loginCredentialBody{gap:24px;padding:24px}
  .device-frontend #loginCredentialBody label{font-size:24px;gap:8px}
  .device-frontend #loginCredentialBody #loginPassword{font-size:24px;min-height:64px}
  .device-frontend #loginCredentialBody #loginPasswordToggle{font-size:20px;min-height:64px;min-width:88px}
  .device-frontend #loginCredentialBody #loginSubmitBtn{min-height:88px;font-size:28px}
  .device-frontend #loginCredentialBody #loginCredentialCancel{min-height:56px;font-size:22px}
  .device-frontend #loginCredentialMsg:empty{display:none}
  .device-frontend .ide-titlebar .sidebar-toggle-icon{width:48px;height:48px;padding:10px;display:flex;align-items:center;justify-content:center;background:transparent;border:0;border-radius:4px;flex-shrink:0}
  .device-frontend .ide-titlebar .sidebar-toggle-icon:hover{background:var(--ide-hover)}
  .device-frontend .sidebar-toggle-icon svg{width:26px;height:26px}
  .device-frontend .ide-titlebar strong{font-size:24px;letter-spacing:-.5px}
  .device-frontend .ide-brand-stack{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;flex-shrink:0;height:100%}
  .device-frontend .ide-brand-stack .ide-brand-title{font-size:21px;line-height:24px;color:var(--accent);text-transform:uppercase}
  .device-frontend .ide-brand-stack .sidebar-toggle-icon{width:60px;height:52px;min-height:52px;padding:4px}
  .device-frontend .ide-brand-stack .sidebar-toggle-icon svg{width:38px;height:38px}
  .device-frontend #ideHeaderSearch{flex:1;min-width:0;max-width:760px;margin:0 auto;display:flex;align-items:center;gap:8px}
  /* Brand left, search box centred, scan button right: equal side columns keep the search box in the middle. */
  .device-frontend .ide-titlebar:has(.ide-brand-stack){display:grid;grid-template-columns:minmax(140px,1fr) minmax(0,760px) minmax(140px,1fr);align-items:center}
  .device-frontend .ide-titlebar:has(.ide-brand-stack) .ide-brand-stack{grid-column:1;grid-row:1;justify-self:start}
  .device-frontend .ide-titlebar:has(.ide-brand-stack) #ideHeaderSearch:not([hidden]){display:contents}
  .device-frontend .ide-titlebar #ideHeaderSearch input{min-height:64px;font-size:24px}
  .device-frontend .ide-titlebar:has(.ide-brand-stack) #ideHeaderSearch input{grid-column:2;grid-row:1}
  .device-frontend .frontend-titlebar-actions{grid-column:3;grid-row:1;justify-self:end;display:flex;align-items:center;gap:8px;min-width:0}
  .device-frontend .frontend-titlebar-logout{flex:none;margin-left:0}
  .device-frontend #ideHeaderScanBtn{flex:0 0 64px;width:64px;height:64px;min-height:64px;padding:0;display:flex;align-items:center;justify-content:center;border-radius:6px}
  .device-frontend #ideHeaderScanBtn svg{width:36px;height:28px;fill:currentColor}
  .device-frontend #ideHeaderSearch[hidden],
  .device-frontend #ideHeaderSearch input[hidden]{display:none}
  .device-frontend #ideHeaderSearch input{width:100%;max-width:none;min-height:64px;height:64px;font-size:24px;padding:10px 16px}
  .device-frontend #shiftOpenToolbar .shift-open-controls,
  .device-frontend #shiftCloseToolbar{display:none}
  .device-frontend.workspace-open #app .full-bleed-screen > .card{padding:0}
  .device-frontend.workspace-open #app .full-bleed-screen .inventory-panel,
  .device-frontend.workspace-open #app .full-bleed-screen .table-wrap{width:100%;margin-left:0;margin-right:0;border:0;border-radius:0}
  .device-frontend .shift-location-details-sidebar[hidden]{display:none}
  .device-frontend .shift-location-details-sidebar{position:fixed;top:calc(var(--ide-title-height) + var(--ide-tab-height));right:0;bottom:var(--ide-status-height);z-index:19;display:flex;width:340px;max-width:calc(100vw - var(--ide-sidebar-width));flex-direction:column;overflow:hidden;border-left:1px solid var(--border);background:var(--surface);color:var(--text)}
  .device-frontend.workspace-open.shift-location-details-open #app{margin-right:340px}
  .device-frontend .shift-location-details-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px;border-bottom:1px solid var(--border);background:var(--surface)}
  .device-frontend .shift-location-details-head p{margin:0;color:var(--muted);font-size:16px}
  .device-frontend .shift-location-details-head h2{margin:4px 0 0;color:var(--text);font-size:22px}
  .device-frontend .shift-location-details-head button{flex-shrink:0;min-height:48px}
  .device-frontend .shift-location-details-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:16px}
  .device-frontend .shift-location-details-list{display:grid;gap:0;margin:0}
  .device-frontend .shift-location-details-list > div{display:grid;grid-template-columns:minmax(100px,1fr) minmax(0,1.4fr);gap:12px;padding:12px 0;border-bottom:1px solid var(--border)}
  .device-frontend .shift-location-details-list dt{color:var(--muted)}
  .device-frontend .shift-location-details-list dd{margin:0;color:var(--text);font-weight:600;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
  .device-frontend #shiftLocationDetailsStatus{margin:16px 0 0}
  .device-frontend .shift-location-actions{display:grid;gap:10px;margin-top:20px}
  .device-frontend .shift-location-actions[hidden]{display:none}
  .device-frontend .shift-location-actions button{min-height:56px;font-size:20px}
  .device-frontend #lotteryInventoryScreen .shift-book-row:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
  .device-frontend .ide-sidebar{padding:24px 12px;display:flex;flex-direction:column;gap:12px}
  .device-frontend .ide-sidebar-title{font-size:16px;padding:0 12px 8px}
  .device-frontend .ide-sidebar nav button{min-height:60px;border-radius:6px;font-size:20px;padding:12px}
  .device-frontend .ide-sidebar nav button[aria-current=page]{background:var(--ide-hover);box-shadow:inset 3px 0 var(--accent);font-weight:650}
  .device-frontend .ide-page-actions{margin-top:auto;border-top:1px solid var(--border);padding:16px 0 0}
  .device-frontend .ide-page-actions h2{font-size:18px;font-weight:650;margin:0 8px 12px;color:var(--muted)}
  .device-frontend .ide-page-action-group{display:grid;gap:10px}
  .device-frontend .ide-page-actions[hidden],
  .device-frontend .ide-page-action-group[hidden],
  .device-frontend .ide-page-actions button[hidden]{display:none}
  .device-frontend .ide-page-actions button{width:100%;min-height:56px;font-size:20px;text-align:left;padding:12px;white-space:normal}
  .device-frontend .ide-page-actions .toolbar-button{flex-direction:row;justify-content:flex-start;gap:12px}
  .device-frontend .ide-page-actions #shiftOpenToolbar{display:grid;gap:10px;background:transparent;border:0;padding:0;margin:0;box-shadow:none}
  .device-frontend .ide-page-actions #shiftOpenToolbar[hidden]{display:none}
  .device-frontend .ide-page-actions .shift-history-edit-header{position:static}
  .device-frontend.workspace-open #lotterySetupScreen .page-head{display:none}
  .device-frontend #lotterySetupScreen .book-actions :is(.toolbar-group,.toolbar-separator){display:none}
  .device-frontend .ide-sidebar .device-theme-control{margin-top:auto;flex-direction:column;align-items:stretch}
  .device-frontend .ide-sidebar .device-theme-control select{width:100%}
  .device-frontend .ide-tabs{padding-left:8px;gap:4px;align-items:end}
  .device-frontend .ide-tabbar{position:fixed;top:var(--ide-title-height);left:var(--ide-sidebar-width);right:0;height:var(--ide-tab-height);display:flex;align-items:stretch;z-index:18;background:var(--ide-panel);border-bottom:1px solid var(--border)}
  .device-frontend .ide-tabbar .ide-tabs{position:static;flex:1;min-width:0;height:100%;border-bottom:0}
  .device-frontend.sidebar-collapsed .ide-tabbar{left:0}
  .device-frontend #ideShiftTabLabel{display:flex;align-items:center;justify-content:flex-end;flex-shrink:0;padding:0 20px;font-size:20px;font-weight:650;color:var(--text)}
  .device-frontend #ideShiftTabLabel[hidden]{display:none}
  .device-frontend :is(#shiftOpenPanel,#shiftClosePanel) > summary{display:none}
  .device-frontend .ide-tabs button{min-height:54px;font-size:20px;border:1px solid var(--border);border-bottom:0;border-radius:6px 6px 0 0}
  .device-frontend .ide-tab{display:flex;flex:none;align-items:center;min-height:54px;border:1px solid var(--border);border-bottom:0;border-radius:6px 6px 0 0;background:var(--ide-panel)}
  .device-frontend .ide-tab:has([aria-current=page]){background:var(--surface);box-shadow:inset 0 3px var(--ok)}
  .device-frontend .ide-tab.is-dirty{box-shadow:inset 0 3px var(--danger)}
  .device-frontend .ide-tab .ide-tab-open{border:0;background:transparent;box-shadow:none;padding:0 12px}
  .device-frontend .ide-tab .ide-tab-close{width:44px;min-height:44px;padding:0;font-size:28px;border:0;border-radius:4px;background:transparent;margin:4px}
  .device-frontend .ide-tab.is-dirty .ide-tab-open::after{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--text);margin-left:10px;vertical-align:middle}
  .device-frontend .ide-tab button:focus-visible{outline:2px solid var(--accent);outline-offset:-3px}
  .device-frontend .workspace-empty{padding:40px;color:var(--muted)}
  .device-frontend.workspace-open .screen .modal-overlay{top:calc(var(--ide-title-height) + var(--ide-tab-height));bottom:var(--ide-status-height);left:var(--ide-sidebar-width)}
  .device-frontend.workspace-open.sidebar-collapsed .screen .modal-overlay{left:0}
  .device-frontend #addLocationPanel .modal-card{max-width:860px;max-height:100%;min-width:0}
  .device-frontend :is(#lotterySetupScreen,#bookQuickAddGame){display:none!important}
  .device-frontend #addLocationPanel .modal-head{padding:24px 28px;z-index:1}
  .device-frontend #addLocationPanel .modal-form{padding:28px;gap:24px}
  .device-frontend #addLocationPanel :is(#addLocationLotterySection,#addLocationNewBookSection,#addLocationExistingSection){display:grid;gap:24px}
  .device-frontend #addLocationPanel :is(#addLocationLotterySection,#addLocationNewBookSection,#addLocationExistingSection)[hidden]{display:none}
  .device-frontend #addLocationPanel label{min-width:0;gap:8px}
  .device-frontend #addLocationPanel .modal-form-row{gap:24px;grid-template-columns:repeat(2,minmax(0,1fr))}
  .device-frontend #addLocationPanel .book-confirm-panel{padding:20px;gap:20px}
  .device-frontend #addLocationPanel .modal-actions{gap:16px;padding-top:20px;border-top:1px solid var(--border);margin-top:0}
  .device-frontend #addLocationPanel .modal-actions button{min-height:56px;padding:12px 24px}
  @media(max-width:600px){
    .device-frontend #addLocationPanel .modal-head{padding:20px}
    .device-frontend #addLocationPanel .modal-form{padding:20px}
    .device-frontend #addLocationPanel .modal-form-row{grid-template-columns:1fr}
  }
  #tabCloseOverlay{z-index:100}
  html[data-theme=dark] body.device-frontend #app :is(th,summary,h2,h3,.panel-toolbar-info,.shift-history-title){color:#fff}
  .device-frontend .ide-statusbar{font-size:16px}
  .device-frontend .ide-statusbar #shiftCurrentDateTime{white-space:nowrap;flex-shrink:0}
  .ide-device-account{display:none}
  .device-frontend .ide-device-account{display:grid;gap:12px;padding:16px 8px 0;border-top:1px solid var(--border)}
  .device-frontend .ide-device-account span{font-size:18px;overflow-wrap:anywhere}
  .device-frontend .ide-device-account button{min-height:52px;font-size:20px}
  .device-frontend.workspace-open #app .page-head [data-back="switchboardScreen"]{display:none}
  .device-frontend.workspace-open #app .page-head > h2,
  .device-frontend.workspace-open #app .page-head .page-title-block > h2{display:none}
  .device-frontend.workspace-open #lotteryInventoryScreen .page-head-left{display:none}
  .device-frontend.workspace-open #lotteryInventoryScreen .page-head{display:flex;justify-content:flex-end}
  .device-frontend.workspace-open #lotteryInventoryScreen .shift-sticky-head{top:calc(var(--ide-title-height) + var(--ide-tab-height))}
  .device-frontend.workspace-open #app :is(#reportsScreen,#placeholderScreen,#hardwareScreen) .page-head{display:none}
  .device-frontend.workspace-open #auditHistoryScreen .page-head{display:none}
  .device-frontend #auditHistoryScreen .audit-history-actions{display:flex;justify-content:flex-end;padding:12px 16px}
  .device-frontend #auditHistoryScreen #auditHistoryMsg:empty{display:none}
  .device-frontend #auditHistoryScreen #auditHistoryMsg:not(:empty){margin:8px 16px}
  .device-frontend #auditHistoryScreen .audit-history-group{margin:0}
  .device-frontend #auditHistoryScreen .table-wrap{margin-top:0}
  .device-frontend #auditHistoryScreen #shiftHistoryPanel,
  .device-frontend #auditHistoryScreen #lotteryAuditPanel{width:100%;margin:0;border:0;border-radius:0}
  .device-frontend #auditHistoryScreen .shift-history-edit-header{right:48px}
  .device-frontend #auditHistoryScreen .audit-history-subheading{margin:16px}
  .device-frontend #auditHistoryScreen .audit-group-toggle{color:var(--text)}
  .device-frontend #auditHistoryScreen .audit-group-year .audit-group-toggle,
  .device-frontend #auditHistoryScreen .audit-group-month .audit-group-toggle,
  .device-frontend #auditHistoryScreen .audit-group-day .audit-group-toggle{color:var(--text)}
  .device-frontend #auditHistoryScreen .audit-group > td,
  .device-frontend #auditHistoryScreen .audit-group-count{background:var(--ide-panel)}
  .device-frontend #auditHistoryScreen .audit-group-count{color:var(--text)}
  .device-frontend .ide-sidebar{transform:translateX(0);visibility:visible;transition:transform 180ms ease,visibility 0s}
  .device-frontend.sidebar-collapsed .ide-sidebar{display:flex;transform:translateX(-100%);visibility:hidden;pointer-events:none;transition:transform 180ms ease,visibility 0s 180ms}
  .device-frontend.workspace-open #app{transition:margin-left 180ms ease}
  .device-frontend .ide-tabbar,
  .device-frontend.workspace-open .screen .modal-overlay{transition:left 180ms ease}
  @media(prefers-reduced-motion:reduce){
    .device-frontend .ide-sidebar,
    .device-frontend.sidebar-collapsed .ide-sidebar,
    .device-frontend.workspace-open #app,
    .device-frontend .ide-tabbar,
    .device-frontend.workspace-open .screen .modal-overlay{transition:none}
  }
  @media(max-width:700px){
    .device-frontend{--ide-sidebar-width:200px}
    .device-frontend .ide-sidebar nav button{font-size:18px}
    .device-frontend .shift-location-details-head{align-items:stretch;flex-direction:column;gap:12px;padding:12px}
    .device-frontend .shift-location-details-head h2{font-size:20px}
    .device-frontend .shift-location-details-head button{width:100%;min-height:52px}
    .device-frontend .shift-location-details-body{padding:12px}
    .device-frontend .shift-location-details-list > div{grid-template-columns:minmax(84px,1fr) minmax(0,1.2fr);gap:8px}
  }
  @media(max-width:900px){
    .device-frontend .shift-location-details-sidebar{top:calc(var(--ide-title-height) + var(--ide-tab-height) + 52px);width:min(320px,calc(100vw - 48px));max-width:calc(100vw - 48px)}
    .device-frontend.workspace-open.shift-location-details-open #app{margin-right:0}
  }
}
  #appToast{position:fixed;left:50%;bottom:calc(var(--ide-status-height,28px) + 24px);transform:translateX(-50%);z-index:1000;max-width:min(90vw,640px);padding:14px 22px;border-radius:8px;background:#323232;color:#fff;font-size:20px;box-shadow:0 6px 20px rgba(0,0,0,.35);text-align:center}
  #appToast.error{background:#b3261e}
  #appToast[hidden]{display:none}
  html.camera-scanning,html.camera-scanning body{background:transparent!important}
  html.camera-scanning body>*:not(#cameraScanOverlay){visibility:hidden!important}
  #cameraScanOverlay{position:fixed;inset:0;z-index:2000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;color:#fff;overflow:hidden}
  #cameraScanOverlay[hidden]{display:none}
  #cameraScanOverlay .camera-scan-window{position:relative;width:min(80vw,720px);height:min(30vh,280px);border:4px solid #fff;border-radius:16px;box-shadow:0 0 0 100vmax rgba(0,0,0,.55);overflow:hidden}
  #cameraScanOverlay .camera-scan-line{position:absolute;left:4%;right:4%;top:50%;height:3px;background:#ff3b30;box-shadow:0 0 12px #ff3b30;animation:camera-scan-sweep 1.8s ease-in-out infinite alternate}
  @keyframes camera-scan-sweep{from{top:12%}to{top:88%}}
  #cameraScanOverlay .camera-scan-hint{position:relative;margin:0;font-size:24px;text-shadow:0 1px 4px rgba(0,0,0,.8)}
  #cameraScanOverlay .camera-scan-cancel{position:relative;min-width:200px;min-height:64px;font-size:24px;border-radius:32px;border:2px solid #fff;background:rgba(0,0,0,.45);color:#fff}  html.camera-scanning-inline,html.camera-scanning-inline body{background:transparent!important}
  html.camera-scanning-inline .ide-titlebar{background:transparent!important;overflow:hidden}
  html.camera-scanning-inline .camera-scan-frame{visibility:hidden}
  #cameraScanBackdrop{position:fixed;z-index:-1;pointer-events:none}
  #cameraScanWindow{position:absolute;z-index:-1;pointer-events:none;box-sizing:border-box;border:3px solid #ff3b30;border-radius:6px;overflow:hidden}
  #cameraScanWindow .camera-scan-line{position:absolute;left:3%;right:3%;top:50%;height:2px;background:#ff3b30;box-shadow:0 0 8px #ff3b30;animation:camera-scan-sweep 1.2s ease-in-out infinite alternate}
  #cameraScanTouch{position:fixed;z-index:2100;display:flex;align-items:center;justify-content:center;cursor:ew-resize;touch-action:none;user-select:none;-webkit-user-select:none}
  #cameraScanTouch .camera-scan-width-label{padding:2px 12px;border-radius:12px;background:rgba(0,0,0,.6);color:#fff;font-size:18px;font-weight:600;font-variant-numeric:tabular-nums;opacity:0;transition:opacity .2s;pointer-events:none}
  #cameraScanTouch.adjusting .camera-scan-width-label{opacity:1}
  #cameraScanWindow .camera-scan-line::before,#cameraScanWindow .camera-scan-line::after{content:"";position:absolute;top:-5px;width:3px;height:12px;background:#ff3b30;border-radius:2px}
  #cameraScanWindow .camera-scan-line::before{left:0}
  #cameraScanWindow .camera-scan-line::after{right:0}
  .device-frontend #ideHeaderScanBtn.scanning{background:#b3261e;border-color:#b3261e;color:#fff}
  .device-frontend #ideHeaderScanBtn.scanning svg{width:26px;height:26px}

@media screen and (max-width:480px) and (max-height:900px){
  .device-frontend{
    --ide-sidebar-width:min(184px,82vw);
    --ide-title-height:calc(56px + env(safe-area-inset-top, 0px));
    --ide-tab-height:0px;
    --ide-status-height:28px;
    --font-scale:1;
    --control-h-sm:40px;
    --control-h-md:44px;
    --control-h-lg:48px;
    --input-h:44px;
  }
  .device-frontend .ide-titlebar{gap:4px;padding-right:6px;padding-left:6px}
  .device-frontend .ide-brand-stack .ide-brand-title{font-size:15px;line-height:18px}
  .device-frontend .ide-brand-stack .sidebar-toggle-icon{width:42px;height:42px;min-height:42px;padding:4px}
  .device-frontend .ide-brand-stack .sidebar-toggle-icon svg{width:30px;height:30px}
  .device-frontend .ide-titlebar:has(.ide-brand-stack){grid-template-columns:42px minmax(0,1fr) auto}
  .device-frontend #ideHeaderSearch{gap:4px}
  .device-frontend .ide-titlebar #ideHeaderSearch input,
  .device-frontend #ideHeaderSearch input{height:42px;min-height:42px;padding:4px 7px;font-size:15px}
  .device-frontend #ideHeaderScanBtn{flex-basis:42px;width:42px;height:42px;min-height:42px}
  .device-frontend #ideHeaderScanBtn svg{width:28px;height:22px}
  .device-frontend .ide-sidebar{padding:12px 8px}
  .device-frontend .ide-sidebar nav button{min-height:48px;padding:8px;font-size:15px}
  .device-frontend .ide-sidebar-title{font-size:13px;padding:0 8px 6px}
  .device-frontend .ide-tabs{padding-left:4px;gap:2px}
  .device-frontend .ide-tabbar{height:var(--ide-tab-height)}
  .device-frontend .ide-tab,
  .device-frontend .ide-tabs button{min-height:40px;font-size:14px}
  .device-frontend .ide-tab .ide-tab-open{padding:0 6px}
  .device-frontend .ide-tab .ide-tab-close{width:32px;min-height:32px;margin:3px;font-size:22px}
  .device-frontend #ideShiftTabLabel{max-width:88px;padding:0 6px;font-size:12px;white-space:nowrap}
  .device-frontend .ide-statusbar{gap:4px;padding:0 6px;font-size:12px}
  .device-frontend .ide-device-account{gap:8px;padding:10px 4px 0}
  .device-frontend .ide-device-account span{font-size:14px}
  .device-frontend .ide-device-account button{min-height:44px;font-size:15px}
  .device-frontend #loginScreen{padding:12px}
  .device-frontend #loginScreen .login-card{min-height:0;max-height:calc(100dvh - 24px);overflow-y:auto;padding:24px 16px}
  .device-frontend #loginScreen .brand{margin-bottom:20px}
  .device-frontend #loginScreen .brand h1{font-size:26px}
  .device-frontend #loginScreen #loginForm{gap:14px}
  .device-frontend #loginPinPad{gap:10px}
  .device-frontend #loginPinPad .pin-pad-label{font-size:18px}
  .device-frontend #loginPinPad .pin-keys{gap:8px}
  .device-frontend #loginPinPad .pin-key{height:56px;font-size:24px}
  .device-frontend #loginCredentialBody{gap:12px;padding:14px}
  .device-frontend #loginCredentialBody label{font-size:16px}
  .device-frontend #loginCredentialBody #loginPassword{min-height:44px;font-size:18px}
  .device-frontend #loginCredentialBody #loginPasswordToggle{min-height:44px;min-width:64px;font-size:15px}
  .device-frontend #loginCredentialBody #loginSubmitBtn{min-height:52px;font-size:18px}
  .device-frontend #loginCredentialBody #loginCredentialCancel{min-height:44px;font-size:16px}
  .device-frontend #lotteryInventoryScreen .shift-table th,
  .device-frontend #lotteryInventoryScreen .shift-table td{padding:4px;font-size:12px}
  .device-frontend #lotteryInventoryScreen .shift-table tbody td{height:44px;padding-top:4px;padding-bottom:4px}
  .device-frontend #shiftOpenPanel .shift-table th:nth-child(1),
  .device-frontend #shiftOpenPanel .shift-table td:nth-child(1){width:8%}
  .device-frontend #shiftOpenPanel .shift-table th:nth-child(2),
  .device-frontend #shiftOpenPanel .shift-table td:nth-child(2){width:52%}
  .device-frontend #shiftOpenPanel .shift-table th:nth-child(3),
  .device-frontend #shiftOpenPanel .shift-table td:nth-child(3){width:22%}
  .device-frontend #shiftOpenPanel .shift-table th:nth-child(4),
  .device-frontend #shiftOpenPanel .shift-table td:nth-child(4){width:18%}
  .device-frontend #shiftClosePanel .table-wrap{overflow-x:auto}
  .device-frontend #shiftClosePanel .shift-table{min-width:520px}
  .device-frontend .scan-tickets-entry{grid-template-columns:minmax(0,1fr) 92px;gap:8px}
  .device-frontend .scan-tickets-entry .scan-tickets-code{grid-column:1/-1}
  .device-frontend .scan-tickets-entry label{gap:3px;font-size:13px}
  .device-frontend .scan-tickets-entry input{min-height:42px;padding:4px 7px;font-size:16px}
  .device-frontend .scan-tickets-entry button{min-height:42px;padding:0 8px}
  .device-frontend .scan-tickets-result{min-height:38px;padding:6px 8px;font-size:13px}
  body.device-frontend #app button:not(.pin-key):not(.sidebar-toggle-icon):not(#ideVersionButton),
  body.device-frontend #ideShell button:not(.pin-key):not(.sidebar-toggle-icon):not(#ideVersionButton){min-height:40px;padding:6px 10px;font-size:14px}
  .device-frontend .ide-titlebar .frontend-top-theme{font-size:14px}
  .device-frontend .ide-titlebar .frontend-top-theme select,
  .device-frontend .device-theme-control select{min-height:36px;font-size:14px}
  .device-frontend .ide-brand-stack .ide-brand-title{font-size:17px;line-height:20px}
  .device-frontend .ide-sidebar nav button{min-height:40px;padding:6px 8px;font-size:14px}
  .device-frontend .ide-sidebar-title{font-size:12px}
  .device-frontend .ide-device-account span{font-size:13px}
  .device-frontend .ide-device-account button{min-height:40px;font-size:14px}
  .device-frontend #ideHeaderScanBtn{width:42px;height:42px;min-height:42px;padding:0}
  .device-frontend #ideHeaderScanBtn svg{width:24px;height:22px}
  .device-frontend #ideShiftTabLabel{font-size:12px}
  .device-frontend .ide-statusbar{font-size:12px}
  .device-frontend #loginScreen{padding:8px}
  .device-frontend #loginScreen .login-card{max-height:calc(100dvh - 16px);padding:16px 12px;border-radius:14px}
  .device-frontend #loginScreen .brand{margin-bottom:12px}
  .device-frontend #loginScreen .logo{width:40px;height:40px;margin-bottom:6px;font-size:22px}
  .device-frontend #loginScreen .brand h1{font-size:20px}
  .device-frontend #loginScreen .brand > p:last-child{font-size:14px}
  .device-frontend #loginScreen #loginForm{gap:10px}
  .device-frontend #loginScreen #loginForm label,
  .device-frontend #loginCredentialBody label{font-size:15px;gap:5px}
  .device-frontend #loginUser,
  .device-frontend #loginPassword,
  .device-frontend #loginCredentialBody #loginPassword{min-height:40px;padding:6px 8px;font-size:16px}
  .device-frontend #loginPasswordToggle,
  .device-frontend #loginCredentialBody #loginPasswordToggle{min-width:60px;min-height:40px;padding:0 8px;font-size:14px}
  .device-frontend #loginForm > button[type=submit],
  .device-frontend #loginCredentialBody #loginSubmitBtn{min-height:44px;padding:6px 10px;font-size:16px}
  .device-frontend #loginScreen #backendSetupOpenBtn{min-height:40px;margin-top:10px;font-size:14px}
  .device-frontend .login-option-buttons{gap:8px}
  .device-frontend .login-option-buttons button{min-height:48px;padding:8px;font-size:16px}
  .device-frontend .login-option-buttons svg{width:20px;height:20px}
  .device-frontend #loginOptionsLabel,
  .device-frontend #loginPinPad .pin-pad-label{font-size:16px}
  .device-frontend #loginPinPad{gap:10px}
  .device-frontend #loginPinPad .pin-keys{gap:8px}
  .device-frontend #loginPinPad .pin-key{height:48px;font-size:22px}
  .device-frontend #loginPinPad .pin-key-alt{font-size:15px}
  .device-frontend #loginCredentialBody{gap:10px;padding:12px}
  .device-frontend #loginCredentialBody #loginCredentialCancel{min-height:40px;font-size:14px}
  .device-frontend #loginMsg,
  .device-frontend #loginScreen .hint{font-size:14px;line-height:1.4}
  .device-frontend #licenseRecoveryPanel h2{font-size:18px}
  .device-frontend #licenseRecoveryPanel p{font-size:14px}
  .device-frontend #licenseRecoveryPanel label{font-size:14px}
  .device-frontend #licenseRecoveryPanel input,
  .device-frontend #licenseRecoveryPanel select{min-height:40px;font-size:15px}
  .device-frontend #licenseRecoveryPanel button{min-height:40px;font-size:14px}
  .device-frontend .shift-location-details-head{gap:8px;padding:10px}
  .device-frontend .shift-location-details-head p{font-size:14px}
  .device-frontend .shift-location-details-head h2{font-size:18px}
  .device-frontend .shift-location-details-head button{min-height:40px}
  .device-frontend .shift-location-details-body{padding:10px}
  .device-frontend .shift-location-details-list > div{gap:8px;padding:8px 0}
  .device-frontend .shift-location-actions{gap:6px;margin-top:12px}
  .device-frontend .shift-location-actions button{min-height:40px;font-size:14px}
  .device-frontend #addLocationPanel .modal-head{padding:12px}
  .device-frontend #addLocationPanel .modal-head h3{font-size:16px}
  .device-frontend #addLocationPanel .modal-form{gap:12px;padding:12px}
  .device-frontend #addLocationPanel :is(#addLocationLotterySection,#addLocationNewBookSection,#addLocationExistingSection){gap:12px}
  .device-frontend #addLocationPanel label{gap:4px;font-size:14px}
  .device-frontend #addLocationPanel .modal-form-row{gap:12px}
  .device-frontend #addLocationPanel .book-confirm-panel{gap:12px;padding:12px}
  .device-frontend #addLocationPanel .modal-actions{gap:8px;padding-top:12px}
  .device-frontend #addLocationPanel .modal-actions button{min-height:40px;padding:6px 10px;font-size:14px}
}

@media screen and (max-width:520px){
  body.device-frontend{
    --ide-sidebar-width:min(280px,calc(100vw - 56px));
    --ide-title-height:calc(56px + env(safe-area-inset-top,0px));
    --ide-tab-height:0px;
    --ide-status-height:28px;
    --font-scale:1;
    --control-h-sm:44px;
    --control-h-md:48px;
    --control-h-lg:52px;
    --input-h:48px;
    --handheld-accent-soft:#e8f2fb;
    --handheld-shadow:0 8px 24px rgb(15 23 42 / 8%);
    background:var(--bg);
  }
  html[data-theme=dark] body.device-frontend{
    --handheld-accent-soft:#20394d;
    --handheld-shadow:0 8px 24px rgb(0 0 0 / 24%);
  }
  .device-frontend [hidden]{display:none!important}
  .device-frontend #app{margin-left:0;margin-right:0;min-width:0}
  .device-frontend.workspace-open #app{margin-left:0;margin-right:0}
  .device-frontend.workspace-open #app .screen{
    min-height:calc(100dvh - var(--ide-title-height) - var(--ide-status-height));
    padding:8px;
    background:transparent;
  }
  .device-frontend.workspace-open #app .screen > .card{
    min-height:calc(100dvh - var(--ide-title-height) - var(--ide-status-height) - 16px);
    padding:14px;
    border:1px solid var(--border);
    border-radius:16px;
    background:var(--surface);
    box-shadow:var(--handheld-shadow);
  }
  .device-frontend .ide-titlebar{
    height:var(--ide-title-height);
    gap:8px;
    padding:env(safe-area-inset-top,0px) 10px 0;
    border-bottom:1px solid var(--border);
    background:var(--surface);
  }
  .device-frontend .ide-titlebar:has(.ide-brand-stack){grid-template-columns:44px minmax(0,1fr) auto}
  .device-frontend .ide-brand-stack{gap:0}
  .device-frontend .ide-brand-stack .ide-brand-title{font-size:14px;line-height:16px}
  .device-frontend .ide-brand-stack .sidebar-toggle-icon{
    width:44px;height:44px;min-height:44px;padding:7px;
  }
  .device-frontend .ide-brand-stack .sidebar-toggle-icon svg{width:28px;height:28px}
  .device-frontend #ideHeaderSearch{gap:6px}
  .device-frontend .ide-titlebar #ideHeaderSearch input,
  .device-frontend #ideHeaderSearch input{
    height:44px;min-height:44px;padding:6px 10px;border-radius:11px;
    background:var(--ide-panel);font-size:15px;
  }
  .device-frontend #ideHeaderScanBtn{
    flex-basis:44px;width:44px;height:44px;min-height:44px;border-radius:11px;
  }
  .device-frontend #ideHeaderScanBtn svg{width:24px;height:22px}
  .device-frontend.workspace-open:not(.sidebar-collapsed)::before{
    position:fixed;
    z-index:18;
    inset:var(--ide-title-height) 0 var(--ide-status-height);
    background:rgb(7 16 28 / 38%);
    content:"";
  }
  .device-frontend .ide-sidebar{
    z-index:30;
    top:var(--ide-title-height);
    bottom:var(--ide-status-height);
    width:min(280px,calc(100vw - 56px));
    padding:14px 10px;
    border-right:1px solid var(--border);
    background:var(--surface);
    box-shadow:8px 0 28px rgb(0 0 0 / 18%);
  }
  .device-frontend.sidebar-collapsed .ide-sidebar{
    display:none;
    transform:translateX(-100%);
    visibility:hidden;
  }
  .device-frontend.workspace-open:not(.sidebar-collapsed) .ide-sidebar{
    display:flex;
    transform:translateX(0);
    visibility:visible;
  }
  .device-frontend .ide-sidebar-title{
    padding:4px 10px 10px;
    color:var(--muted);
    font-size:10px;
    letter-spacing:.1em;
  }
  .device-frontend .ide-sidebar nav{gap:5px}
  .device-frontend .ide-sidebar nav button{
    min-height:46px;
    padding:8px 12px;
    border:1px solid transparent;
    border-radius:11px;
    font-size:15px;
    text-align:left;
  }
  .device-frontend .ide-sidebar nav button[aria-current=page]{
    border-color:var(--border);
    background:var(--handheld-accent-soft);
    box-shadow:inset 3px 0 var(--accent);
  }
  .device-frontend .ide-sidebar .device-theme-control{
    gap:8px;
    margin-top:auto;
    padding:12px 4px 4px;
    border-top:1px solid var(--border);
    font-size:13px;
  }
  .device-frontend .ide-sidebar .device-theme-control select{
    min-height:44px;
    border-radius:10px;
    font-size:15px;
  }
  .device-frontend .ide-device-account{
    gap:6px;
    padding:10px 4px 0;
  }
  .device-frontend .ide-device-account button{
    min-height:44px;
    border-radius:10px;
    font-size:14px;
  }
  .device-frontend .ide-statusbar{
    z-index:21;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,1fr);
    height:var(--ide-status-height);
    gap:6px;
    padding:0 8px;
    border-top:1px solid var(--border);
    background:var(--ide-chrome);
    font-size:11px;
    font-weight:400;
  }
  .device-frontend .ide-statusbar #ideVersionButton{
    grid-column:1;
    justify-self:start;
    max-width:28vw;
    min-height:24px;
    padding:0;
    overflow:hidden;
    color:var(--muted);
    font-size:11px;
    font-weight:400;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .device-frontend .ide-statusbar #ideStatusUser{
    grid-column:2;
    justify-self:center;
    max-width:34vw;
    overflow:hidden;
    color:var(--text);
    font-size:11px;
    font-weight:400;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .device-frontend .ide-statusbar #shiftCurrentDateTime{
    grid-column:3;
    justify-self:end;
    max-width:34vw;
    overflow:hidden;
    color:var(--muted);
    font-size:11px;
    font-weight:400;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .device-frontend .ide-statusbar #ideShiftTabLabel{display:none}
  .device-frontend .ide-titlebar .frontend-titlebar-logout{flex:none;margin-left:auto;min-height:36px;padding:4px 10px;border-radius:10px;font-size:13px}
  .device-frontend #loginScreen{
    display:flex;
    min-height:100dvh;
    flex-direction:column;
    align-items:center;
    gap:0;
    padding:calc(env(safe-area-inset-top,0px) + 8px) 12px calc(env(safe-area-inset-bottom,0px) + 12px);
    background:var(--bg);
  }
  .device-frontend #loginScreen > .frontend-top-theme{
    position:static;
    inset:auto;
    transform:none;
    width:88px;
    min-height:24px;
    margin:0 auto 8px;
    padding:0;
    justify-content:center;
    gap:0;
    font-size:12px;
  }
  .device-frontend #loginScreen > .frontend-top-theme select{
    width:96px;
    min-height:36px;
    padding:4px 8px;
    border-radius:10px;
    font-size:14px;
  }
  .device-frontend #loginScreen > .login-card{
    width:min(100%,560px);
    min-height:0;
    max-height:none;
    flex:0 1 auto;
    justify-content:flex-start;
    overflow:visible;
    margin:0 auto;
    padding:18px;
    border:1px solid var(--border);
    border-radius:18px;
    background:var(--surface);
    box-shadow:var(--handheld-shadow);
  }
  .device-frontend #loginScreen .brand{
    display:grid;
    grid-template-columns:40px minmax(0,1fr);
    grid-template-rows:auto auto auto;
    align-items:center;
    row-gap:0;
    column-gap:12px;
    margin:0 0 16px;
    text-align:left;
  }
  .device-frontend #loginScreen .logo{
    grid-column:1;
    grid-row:1 / span 3;
    width:40px;
    height:40px;
    margin:0;
    border-radius:12px;
    background:var(--accent);
    color:#fff;
    font-size:22px;
  }
  .device-frontend #loginScreen .brand-eyebrow{
    grid-column:2;
    grid-row:1;
    color:var(--muted);
    font-size:11px;
    line-height:1;
    margin:0;
  }
  .device-frontend #loginScreen .brand h1{
    grid-column:2;
    grid-row:2;
    margin:0;
    font-size:18px;
    line-height:1;
  }
  .device-frontend #loginScreen .brand > p:last-child{
    grid-column:2;
    grid-row:3;
    margin:0;
    font-size:12px;
    line-height:1;
  }
  .device-frontend #loginForm[hidden],
  .device-frontend .license-recovery[hidden]{display:none!important}
  .device-frontend #loginScreen #loginForm{
    gap:12px;
    margin:0;
  }
  .device-frontend #loginScreen #loginForm label,
  .device-frontend #loginCredentialBody label{
    gap:5px;
    color:var(--text);
    font-size:13px;
    font-weight:650;
  }
  .device-frontend #loginUser,
  .device-frontend #loginPassword,
  .device-frontend #loginCredentialBody #loginPassword{
    min-height:46px;
    padding:8px 12px;
    border-radius:11px;
    background:var(--ide-panel);
    color:var(--text);
    font-size:16px;
  }
  .device-frontend #loginForm > button[type=submit],
  .device-frontend #loginCredentialBody #loginSubmitBtn{
    min-height:48px;
    border-radius:11px;
    font-size:16px;
  }
  .device-frontend #loginScreen #loginMsg,
  .device-frontend #loginScreen .hint{font-size:13px;line-height:1.4}
  .device-frontend #loginScreen #loginPinPad .pin-key{
    height:52px;
    border-radius:11px;
    font-size:23px;
  }
  .device-frontend #devicePairingPanel,
  .device-frontend #licenseRecoveryPanel{
    width:100%;
    gap:10px;
    margin:0;
    padding:14px;
    border:1px solid var(--border);
    border-radius:14px;
    background:var(--ide-panel);
  }
  .device-frontend #devicePairingPanel h2,
  .device-frontend #licenseRecoveryPanel h2{
    margin:0;
    color:var(--text);
    font-size:18px;
    line-height:1.25;
  }
  .device-frontend #devicePairingPanel > p,
  .device-frontend #licenseRecoveryPanel > p{
    margin:0;
    color:var(--muted);
    font-size:13px;
    line-height:1.4;
  }
  .device-frontend #devicePairingForm{gap:10px}
  .device-frontend .device-pairing-code-row{grid-template-columns:minmax(0,1fr) 84px;gap:8px}
  .device-frontend .device-pairing-code-row label{font-size:12px}
  .device-frontend #devicePairingCode{
    min-height:46px;
    padding:8px;
    border-radius:10px;
    font-family:ui-monospace,Consolas,monospace;
    font-size:18px;
    letter-spacing:.12em;
    text-transform:uppercase;
  }
  .device-frontend #devicePairingScanBtn{
    min-height:46px;
    padding:0 8px;
    border-radius:10px;
    font-size:13px;
  }
  .device-frontend #devicePairingSubmit,
  .device-frontend #licenseRecoverySubmit{
    width:100%;
    min-height:48px;
    border-radius:11px;
    font-size:15px;
  }
  .device-frontend #devicePairingMsg{margin:0;font-size:13px}
  .device-frontend #switchboardScreen > .card{
    display:flex;
    flex-direction:column;
    gap:14px;
    padding:18px;
  }
  .device-frontend #switchboardScreen .page-head{
    align-items:center;
    gap:8px;
    margin:0;
    padding:0 0 12px;
    border-bottom:1px solid var(--border);
  }
  .device-frontend #switchboardScreen .page-head h2{
    margin:0;
    font-size:22px;
    line-height:1.2;
  }
  .device-frontend #switchboardScreen #signedInAs{font-size:12px}
  .device-frontend #switchboardScreen .grid2{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:10px;
    width:100%;
    max-width:none;
    margin:0;
  }
  .device-frontend #switchboardScreen .module{
    display:grid;
    grid-template-columns:44px minmax(0,1fr);
    grid-template-rows:auto auto;
    align-items:center;
    column-gap:12px;
    row-gap:3px;
    min-height:82px;
    padding:12px;
    border:1px solid var(--border);
    border-radius:14px;
    background:var(--surface);
    box-shadow:var(--handheld-shadow);
    text-align:left;
  }
  .device-frontend #switchboardScreen .module .icon{
    grid-column:1;
    grid-row:1 / span 2;
    display:grid;
    width:44px;
    height:44px;
    place-items:center;
    margin:0;
    border-radius:12px;
    background:var(--handheld-accent-soft);
    color:var(--accent);
  }
  .device-frontend #switchboardScreen .module .icon svg{width:23px;height:23px}
  .device-frontend #switchboardScreen .module strong{
    grid-column:2;
    grid-row:1;
    font-size:15px;
    line-height:1.25;
  }
  .device-frontend #switchboardScreen .module small{
    grid-column:2;
    grid-row:2;
    font-size:12px;
    line-height:1.3;
  }
  .device-frontend #switchboardScreen .module:active{
    border-color:var(--accent);
    background:var(--handheld-accent-soft);
  }
  .device-frontend.workspace-open #lotteryInventoryScreen .shift-sticky-head{
    padding:0 0 8px;
    border-bottom:1px solid var(--border);
    background:var(--surface);
  }
  .device-frontend.workspace-open #lotteryInventoryScreen .page-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    margin:0;
    padding:2px 0 8px;
    border:0;
  }
  .device-frontend.workspace-open #lotteryInventoryScreen .page-head-left{
    display:flex;
    min-width:0;
    align-items:center;
  }
  .device-frontend.workspace-open #app .screen .page-head h2{display:none}
  .device-frontend.workspace-open #lotteryInventoryScreen .page-title-block{min-width:0}
  .device-frontend.workspace-open #lotteryInventoryScreen .page-title-block > h2{
    display:block;
    overflow:hidden;
    font-size:18px;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .device-frontend #lotteryInventoryScreen .page-head-actions{
    display:flex;
    flex:none;
    gap:6px;
  }
  .device-frontend #lotteryInventoryScreen .page-head-actions button{
    min-height:44px;
    padding:6px 10px;
    border-radius:10px;
    font-size:13px;
  }
  .device-frontend #lotteryInventoryScreen #shiftMsg{
    margin:6px 0;
    font-size:13px;
    line-height:1.35;
  }
  .device-frontend #lotteryInventoryScreen .shift-table th,
  .device-frontend #lotteryInventoryScreen .shift-table td{
    padding:7px 5px;
    font-size:12px;
    line-height:1.25;
  }
  .device-frontend #lotteryInventoryScreen .shift-table tbody td{height:48px}
  .device-frontend #lotteryInventoryScreen .shift-table input{
    min-width:0;
    min-height:40px;
    padding:4px 6px;
    font-size:16px;
  }
  .device-frontend #reportsScreen .report-filter-row{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:10px;
    margin:0;
  }
  .device-frontend #reportsScreen .report-toolbar,
  .device-frontend #reportsScreen .report-date-filters{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    min-width:0;
  }
  .device-frontend #reportsScreen .report-date-filters label{min-width:0;font-size:12px}
  .device-frontend #reportsScreen .report-date-filters input{min-width:0;font-size:14px}
  .device-frontend #reportsScreen .report-summary-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .device-frontend #hardwareScreen .actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .device-frontend #hardwareScreen .actions button{min-height:44px;padding:6px 8px;font-size:13px}
  .device-frontend .shift-location-details-sidebar{
    top:var(--ide-title-height);
    right:0;
    bottom:var(--ide-status-height);
    left:0;
    z-index:32;
    width:100%;
    max-width:none;
    border-left:0;
    box-shadow:0 -8px 24px rgb(0 0 0 / 18%);
  }
  .device-frontend.workspace-open.shift-location-details-open #app{margin-right:0}
  .device-frontend .shift-location-details-head{padding:12px}
  .device-frontend .shift-location-details-body{padding:12px}
  .device-frontend.workspace-open .screen .modal-overlay{
    top:var(--ide-title-height);
    right:0;
    bottom:var(--ide-status-height);
    left:0;
    z-index:40;
  }
  .device-frontend button:focus-visible,
  .device-frontend input:focus-visible,
  .device-frontend select:focus-visible,
  .device-frontend textarea:focus-visible{
    outline:3px solid var(--accent);
    outline-offset:2px;
  }
}

@media screen{
  .device-frontend #loginScreen:not(.active){display:none}
}

@media screen{
  .device-frontend.handheld-navigation .ide-sidebar[hidden]{display:none!important}
  .device-frontend.handheld-navigation.workspace-open #app{margin-left:0;margin-right:0}
  .device-frontend #lotteryInventoryScreen .shift-table thead th:first-child,
  .device-frontend #lotteryInventoryScreen .shift-table tbody td:first-child{
    position:sticky;
    left:0;
    width:56px;
    min-width:56px;
    box-shadow:1px 0 var(--border);
    text-align:center;
  }
  .device-frontend #lotteryInventoryScreen .shift-table thead th:first-child{
    z-index:3;
    background:var(--ide-panel);
  }
  .device-frontend #lotteryInventoryScreen .shift-table tbody td:first-child{
    z-index:2;
    background:var(--surface);
  }
  .device-frontend #lotteryInventoryScreen .shift-book-row.selected > td:first-child{background:inherit}
}

@media screen and (max-width:700px){
  .device-frontend .ide-statusbar{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,1fr);
    font-weight:400;
  }
  .device-frontend .ide-statusbar #ideVersionButton{
    grid-column:1;
    justify-self:start;
    max-width:28vw;
    overflow:hidden;
    color:var(--muted);
    font-weight:400;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .device-frontend .ide-statusbar #ideStatusUser{
    grid-column:2;
    justify-self:center;
    max-width:34vw;
    overflow:hidden;
    color:var(--text);
    font-weight:400;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .device-frontend .ide-statusbar #shiftCurrentDateTime{
    grid-column:3;
    justify-self:end;
    max-width:34vw;
    overflow:hidden;
    color:var(--muted);
    font-weight:400;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .device-frontend .ide-statusbar #ideShiftTabLabel{display:none}
  .device-frontend .ide-titlebar .frontend-titlebar-logout{flex:none;margin-left:auto}
  .device-frontend.workspace-open #app .screen .page-head h2{display:none}
  .device-frontend.handheld-navigation.workspace-open #app #lotteryInventoryScreen.screen{padding:0}
  .device-frontend.handheld-navigation.workspace-open #app #lotteryInventoryScreen > .card{
    padding:0;
    border:0;
    border-radius:0;
    box-shadow:none;
  }
  .device-frontend.handheld-navigation.workspace-open #app #lotteryInventoryScreen .shift-sticky-head{padding-right:14px;padding-left:14px}
  .device-frontend.handheld-navigation.workspace-open #app #lotteryInventoryScreen #shiftOpenPanel,
  .device-frontend.handheld-navigation.workspace-open #app #lotteryInventoryScreen #shiftClosePanel{
    width:100%;
    margin:0;
    border:0;
    border-radius:0;
  }
  .device-frontend.handheld-navigation.workspace-open #app #lotteryInventoryScreen .table-wrap{
    width:100%;
    margin:0;
    border:0;
    border-radius:0;
    overflow-x:auto;
  }
  .device-frontend.handheld-navigation.workspace-open #lotteryInventoryScreen #shiftMsg{margin-right:14px;margin-left:14px}
  .device-frontend.handheld-navigation.workspace-open #lotteryInventoryScreen .scan-tickets-inline{margin-right:14px;margin-left:14px}
}

@media screen{
  body.device-frontend .device-theme-control{
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:0;
    margin:0;
    font-size:12px;
  }
  .device-frontend .theme-slide-toggle{
    position:relative;
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:center;
    width:88px;
    height:28px;
    min-height:28px;
    padding:2px;
    overflow:hidden;
    border:1px solid #93a4b8;
    border-radius:999px;
    background:#e4ebf3;
    color:#53657a;
    box-shadow:none;
    font-size:11px;
    line-height:1;
  }
  .device-frontend .theme-slide-toggle[aria-checked=true]{
    border-color:#40556d;
    background:#26384d;
    color:#aebcce;
  }
  .device-frontend .theme-slide-light,
  .device-frontend .theme-slide-dark{
    position:relative;
    z-index:1;
    font-size:10px;
    line-height:10px;
    text-align:center;
  }
  .device-frontend .theme-slide-toggle[aria-checked=false] .theme-slide-light,
  .device-frontend .theme-slide-toggle[aria-checked=true] .theme-slide-dark{
    color:#172b43;
    font-weight:700;
  }
  .device-frontend .theme-slide-toggle[aria-checked=true] .theme-slide-dark{color:#f8fafc}
  .device-frontend .theme-slide-thumb{
    position:absolute;
    top:2px;
    left:2px;
    width:40px;
    height:22px;
    border-radius:999px;
    background:#fff;
    box-shadow:0 1px 3px rgb(15 23 42 / 24%);
    transition:transform .18s ease,background-color .18s ease;
  }
  .device-frontend .theme-slide-toggle[aria-checked=true] .theme-slide-thumb{
    transform:translateX(42px);
    background:#12243a;
  }
  body.device-frontend #app button.theme-slide-toggle:not(.pin-key):not(.sidebar-toggle-icon):not(#ideVersionButton){
    height:28px;
    min-height:28px;
    padding:2px;
    font-size:10px;
  }
  body.device-frontend #ideShell button.theme-slide-toggle:not(.pin-key):not(.sidebar-toggle-icon):not(#ideVersionButton){
    height:28px;
    min-height:28px;
    padding:2px;
    font-size:10px;
  }
  .device-frontend .frontend-titlebar-actions > #openShiftBtn,
  .device-frontend .frontend-titlebar-actions > #closeShiftBtn{
    flex:0 0 68px;
    width:68px;
    height:38px;
    min-height:38px;
    padding:2px 4px;
    border:0;
    border-radius:6px;
    background:transparent;
    box-shadow:none;
    color:var(--accent);
    font-size:12px;
    line-height:12px;
    white-space:normal;
  }
  .device-frontend .frontend-titlebar-actions > :is(#openShiftBtn,#closeShiftBtn) span{
    display:block;
    color:var(--accent);
    font-size:12px;
    line-height:12px;
  }
}

@media screen and (max-width:520px){
  .device-frontend.handheld-navigation .ide-titlebar:has(.ide-brand-stack){
    grid-template-columns:minmax(94px,max-content) minmax(0,1fr) auto;
    padding-left:6px;
  }
  .device-frontend.handheld-navigation .ide-brand-stack{
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:0;
  }
  .device-frontend.handheld-navigation .ide-brand-title{font-size:12px;line-height:17px}
  .device-frontend .frontend-brand-home-button .home-navigation-icon{width:17px;height:17px}
  .device-frontend .frontend-brand-home-button{color:#3f3f46}
  html[data-theme=dark] body.device-frontend .frontend-brand-home-button{color:#fff}
  body.device-frontend #ideShell button.frontend-brand-home-button:not(.pin-key):not(.sidebar-toggle-icon):not(#ideVersionButton){
    display:flex;
    width:max-content;
    height:38px;
    min-height:38px;
    flex-direction:row;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:2px 8px 2px 4px;
    border:0;
    border-radius:6px;
    background:transparent;
    box-shadow:none;
    line-height:1;
  }
  .device-frontend .frontend-brand-home-button:focus-visible{
    outline:2px solid var(--accent);
    outline-offset:1px;
  }
  .device-frontend .frontend-titlebar-actions > #openShiftBtn,
  .device-frontend .frontend-titlebar-actions > #closeShiftBtn{
    flex-basis:68px;
    width:68px;
    height:38px;
    min-height:38px;
    padding:2px 4px;
    font-size:12px;
  }
  .device-frontend #loginScreen > .frontend-top-theme{top:max(10px,env(safe-area-inset-top))}
}