/* Shared presentation layer. Page-specific files continue to own behavior/layout hooks. */
body { font-size:14px; line-height:1.65; -webkit-font-smoothing:antialiased; }
body .page { width:100%; max-width:var(--content-max); margin-inline:auto; padding:40px 40px 56px; }
body .page-head { margin-bottom:24px; border:0; padding-bottom:0; gap:16px; }
body .page-head h1 { font-size:30px; font-weight:600; letter-spacing:normal; line-height:1.5; }
body .page-head .sub { font-size:13px; line-height:1.8; margin-top:6px; }
body h2 { font-size:17px; }
body .card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); box-shadow:none; min-width:0; }
body .card-hover:hover { transform:none; border-color:var(--border-strong); box-shadow:var(--shadow-sm); }
body .card-pad { padding:24px; }
body .section-title { margin:0 0 18px; align-items:center; }
body .section-title p { margin-top:4px; }
body .section-title h2 { font-size:17px; }
body .btn { min-height:44px; padding:10px 16px; border-radius:var(--radius-sm); font-size:13px; gap:8px; }
body .btn-primary,body .btn-danger { box-shadow:none; }
body .btn-primary { box-shadow:none; }
body .btn-sm { min-height:34px; padding:6px 12px; font-size:12px; }
body .btn-lg { min-height:48px; font-size:15px; }
body .btn-icon { width:40px; height:40px; border-radius:var(--radius-sm); flex-shrink:0; }
body .btn:disabled,body button:disabled { cursor:not-allowed; opacity:.55; }
body .row-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
body .chips { display:flex; flex-wrap:wrap; gap:8px; }
body .chip { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:38px; padding:8px 14px;
  border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); color:var(--text-2); font-size:13px; font-weight:500; }
body .chip:hover { border-color:var(--gray-300); background:var(--surface-2); }
body .chip.active { background:var(--red-50); border-color:var(--red-200); color:var(--red-700); }
body .view-toggle { border:1px solid var(--border); background:var(--gray-100); border-radius:10px; padding:3px; }
body .view-toggle button { min-height:32px; padding:6px 12px; }
body .view-toggle button.active { color:var(--text); }
body .input,body .select,body .textarea { min-height:44px; padding:10px 12px; border:1px solid var(--border-strong); border-radius:var(--radius-sm); font-size:14px; background:var(--surface-inset); }
body .input:focus,body .select:focus,body .textarea:focus { background:var(--surface); }
body .field label,body .field>span { font-size:12.5px; font-weight:500; color:var(--text-2); }
body .field { margin-bottom:18px; }
body .badge { font-size:11.5px; font-weight:500; line-height:1.5; padding:4px 10px; }
body .table-wrap { width:100%; border-radius:inherit; overflow-x:auto; }
body .tbl { font-size:13px; }
body .tbl th { font-size:12px; color:var(--text-2); text-transform:none; letter-spacing:normal; padding:16px; background:var(--surface-2); font-weight:500; }
body .tbl td { padding:16px; line-height:1.7; border-color:var(--border); }
body .tbl tbody tr:hover { background:var(--surface-2); }
body .cell-sub { font-size:12px; color:var(--text-2); }
body .center-empty { padding:42px 20px; color:var(--text-2); font-size:13px; }
body .sidebar { background:var(--sidebar-bg); border-right:1px solid var(--border); }
body .sidebar-brand { padding:28px 20px; gap:12px; border-bottom:0; }
body .brand-name { color:var(--text); font-size:14px; line-height:1.5; }
body .brand-sub { color:var(--text-3); font-size:11px; letter-spacing:normal; text-transform:none; }
body .sidebar-nav { padding:0 12px 16px; }
body .nav-group-label { letter-spacing:normal; color:var(--text-3); padding:24px 12px 8px; }
body .nav-item { font-size:13px; color:var(--text-2); padding:12px; margin-bottom:4px; }
body .nav-item:hover { background:var(--sidebar-hover); color:var(--text); }
body .nav-item.active { background:var(--sidebar-active); color:var(--text); box-shadow:var(--shadow-xs); font-weight:500; }
body .nav-badge { background:var(--gray-100); color:var(--text-2); }
body .nav-item.active .nav-badge { background:var(--red-100); color:var(--red-700); }
body .sidebar-foot { padding:16px; border-color:var(--border); }
body .sidebar-foot .name { color:var(--text); }
body .sidebar-foot .role { color:var(--text-3); }
body .sidebar-foot .btn-icon { color:var(--text-2); }
body .loading-brand { color:var(--text); }
body .loading-nav i { background:var(--gray-200); }
body .topbar { height:var(--topbar-h); padding:0 40px; background:var(--bg); backdrop-filter:none; }
body .topbar-title { font-size:14px; color:var(--text-2); font-weight:500; }
body .topbar-search { width:min(300px,30vw); }
body:not([data-page="projects"]) .topbar-search { display:none; }
body .dropdown-menu { border-radius:var(--radius-md); box-shadow:var(--shadow-lg); }
body .dash-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:24px; }
body .stat-card { padding:24px; gap:16px; }
body .stat-ico { width:40px; height:40px; border-radius:var(--radius-md); }
body .stat-num { font-size:32px; font-weight:600; line-height:1.25; }
body .stat-label { font-size:13px; margin-top:8px; }
body .filter-bar { padding:18px!important; gap:12px; background:var(--surface); border-radius:16px 16px 0 0; }
body .filter-bar>select { width:auto; min-width:170px; }
body .filter-bar .field { display:grid; gap:6px; margin:0; }
body .data-tabs { padding:4px; gap:4px; width:fit-content; max-width:100%; margin-bottom:24px; background:var(--gray-100); border:1px solid var(--border); }
body .data-tabs .chip { background:transparent; border-color:transparent; color:var(--text-2); }
body .data-tabs .chip.active { background:var(--surface); box-shadow:var(--shadow-xs); color:var(--text); }
body .data-section-fold { padding:20px 24px; margin-top:24px; border-radius:16px; }
body .data-section-fold>summary { font-weight:500; }
body .data-section-fold>summary small { margin-left:18px; font-size:12px; }
body .dx-explorer { gap:24px; }
body .dx-dashboard-search { flex:1; min-width:240px; }
body .dx-dashboard-search .input { flex:1; width:100%; min-width:0; }
body .data-section-fold .dash-two { grid-template-columns:minmax(0,1fr); gap:24px; }
body .data-section-fold .dash-right { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
body .dx-site { box-shadow:none; border-radius:var(--radius-md); padding:16px; }
body .dx-thumb-empty { background:var(--surface-inset); color:var(--text-3); }
body .dx-site:hover,body .dx-row:hover { transform:none; background:var(--surface-2); border-color:var(--gray-300); }
body .dx-row { padding:14px; }
body .ent-grid { gap:24px; }
body .ent-grid>.card>.section-title { padding:20px 20px 16px!important; margin:0; }
body .entity-card-list,body .user-card-list { gap:16px; }
body .entity-card,body .user-card,body .attendance-card { padding:20px; }
body .settings-grid { max-width:1120px; gap:24px; }
body .settings-grid>.card { padding:24px; }
body .loc-item { padding:12px 14px; background:var(--surface); margin-bottom:10px; }
body .loc-actions { gap:4px; }
body .shift-config-row { background:var(--surface-2); padding:18px; border-radius:12px; }
body .board { gap:18px; }
body .col { background:var(--surface-inset); border-color:var(--border); border-radius:var(--radius-lg); }
body .col-head { padding:16px; border-bottom:0; }
body .col-body { padding:0 12px 14px; gap:12px; }
body .k-card { padding:16px; border-radius:12px; box-shadow:var(--shadow-xs); }
body .user-topbar { padding:12px max(24px,calc((100vw - 1200px)/2)); gap:12px; background:var(--surface); }
body .user-topbar .b-name { font-size:14px; }
body .user-topbar .u-name { max-width:240px; }
body[data-page="timesheet"] .ts-wrap { max-width:1264px; }
body[data-page="profile"] .ts-wrap { max-width:1024px; }
body .back-btn,body .install-btn { border-radius:8px; box-shadow:none; min-height:36px; padding:8px 12px; font-size:12px; }
body .back-btn { background:var(--surface); color:var(--text-2); border:1px solid var(--border); }
body .profile-head { padding:28px; gap:24px; }
body .profile-name { font-size:24px; font-weight:600; }
body .profile-sub { margin-top:6px; }
body .profile-settings { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:24px; align-items:start; margin-top:24px; }
body .profile-tools { display:grid; gap:18px; }
body .profile-tools .install-forever { margin:0; padding:24px; }
body .profile-tools .btn-checkin { margin-top:6px; }
body .help-request { padding:18px; margin-bottom:12px; border:1px solid var(--border); border-radius:12px; background:var(--surface); }
body .help-request:last-child { border-bottom:1px solid var(--border); margin-bottom:0; }
body .help-form label { margin:18px 0 8px; color:var(--text-2); font-size:13px; font-weight:500; }
body .help-form input,body .help-form select,body .help-form textarea { min-height:44px; font-size:14px; border-color:var(--border-strong); border-radius:var(--radius-sm); }
body .modal-overlay { padding:24px; background:rgba(17,29,45,.48); backdrop-filter:none; }
body:has(#modal-overlay.open) { overflow:hidden; }
body .modal { display:flex; flex-direction:column; max-height:min(90vh,900px); max-height:min(90dvh,900px); overflow:hidden; border-radius:var(--radius-lg); max-width:580px; box-shadow:var(--shadow-lg); }
body .modal-overlay[data-size="wide"] .modal { max-width:760px; }
body .modal-head { padding:20px 24px; flex-shrink:0; }
body .modal-head h3 { font-size:17px; font-weight:600; }
body .modal-body { padding:24px; overflow:auto; overscroll-behavior:contain; min-height:0; }
body .modal-foot { padding:16px 24px; flex-shrink:0; background:var(--surface-2); align-items:center; }
body .cam-guidance { background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-md); padding:16px; font-size:12px; line-height:1.85; color:var(--text-2); }
body .cam-guidance b { color:var(--text); font-weight:500; }
body .cam-guidance ol { gap:2px; margin-top:6px; }
body .site-open { border:1px solid var(--border-strong); border-radius:var(--radius-md); padding:16px; background:var(--surface); text-align:left; }
body .site-name { line-height:1.7; font-size:13.5px; }
body .site-code { border-radius:5px; font-size:11.5px; padding:2px 7px; letter-spacing:0; }
body .site-results { display:grid; gap:8px; padding:2px; max-height:32vh; overflow:auto; overscroll-behavior:contain; }
body .site-option { display:flex; align-items:center; justify-content:space-between; width:100%; text-align:left; gap:12px; padding:12px 14px; border:1px solid var(--border); border-radius:10px; min-height:68px; background:var(--surface); }
body .site-option-text { display:grid; gap:4px; min-width:0; }
body .site-option-check { font-size:18px; color:var(--gray-400); flex-shrink:0; }
body .site-option.is-selected { background:var(--red-50); border-color:var(--red-400); padding:12px 14px; }
body .site-option.is-selected .site-option-check { color:var(--red-700); }
body .site-choice { padding:12px 14px; margin-top:14px; background:var(--surface-2); border:1px solid var(--border); border-radius:10px; }
body .site-choice>div { display:grid; gap:4px; }
body .site-picker>label { display:block; font-size:13px; color:var(--text-2); margin-bottom:8px; }
body .site-picker #site-results-count { padding:10px 0; font-size:12px; color:var(--text-2); }
body .site-selected-label { display:grid; gap:4px; }
body .work-overview { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:24px; align-items:start; }
body .clock-card { margin:0; padding:24px; max-width:none; width:100%; text-align:left; border-top:3px solid var(--work-clock-accent); }
body .work-clock-header { display:flex; justify-content:space-between; align-items:center; gap:16px; padding-bottom:20px; border-bottom:1px solid var(--border); }
body .work-clock-header .ts-status { margin:0; text-align:right; }
body .clock-time { font-size:48px; letter-spacing:normal; color:var(--text); font-weight:500; line-height:1.15; }
body .clock-date { margin-top:4px; font-size:12px; }
body .work-context { padding:24px; }
body .work-context h2 { font-size:16px; font-weight:500; }
body .work-day-summary { grid-template-columns:repeat(2,minmax(0,1fr)); margin:16px 0 20px; gap:12px; }
body .work-day-summary>div { padding:16px; background:var(--shift-panel-bg); border:1px solid var(--border); border-radius:var(--radius-md); }
body .work-day-summary span { color:var(--text-2); font-size:12px; }
body .work-day-summary b { font-size:19px; font-weight:500; margin-top:6px; }
body .work-day-summary .work-ot { background:var(--red-50); border-color:var(--red-100); }
body .work-day-info { background:var(--surface-2); margin:18px 0 0; border:1px solid var(--border); border-radius:10px; padding:14px; }
body .work-day-info summary { font-size:12.5px; font-weight:500; }
body .work-day-info p { font-size:12px; line-height:1.85; }
body .clock-card>.cam-guidance { margin:24px 0 0; }
body .ts-active-session { padding:0; margin:24px 0 0; border:0; background:var(--surface); display:block; text-align:left; justify-items:stretch; }
body .ts-active-session h2 { font-size:18px; margin:6px 0; }
body .ts-active-session .work-section-heading { font-size:12px; margin-bottom:8px; color:var(--text-2); }
body .ts-active-session .field { width:100%; margin-top:18px; }
body .ts-new-checkin { margin-top:18px; }
body .ts-new-checkin .field { margin-bottom:0; }
body .ts-checkin-time { text-align:left; font-size:12px; }
body .btn-checkin { min-height:52px; margin-top:24px; border-radius:var(--radius-md); padding:16px; font-size:15px; width:100%; white-space:normal; line-height:1.5; }
body .work-more { text-align:left; margin-top:12px; }
body .work-more summary { width:auto; min-height:44px; height:auto; padding:8px 12px; font-size:13px; gap:8px; color:var(--text-2); border-color:var(--border); }
body .work-more summary::after { content:"＋"; font-size:16px; }
body .work-more[open] summary::after { content:"−"; }
body .work-more .btn { width:100%; margin:12px 0 0; }
body #ts-end-day { background:var(--success); box-shadow:none; }
body .work-context-note { padding-top:16px; font-size:12px; color:var(--text-2); line-height:1.85; }
body .work-site-total { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; padding:14px 0; font-size:13px; }
body .work-site-total span { overflow-wrap:anywhere; }
body .work-site-total b { font-size:13px; font-weight:500; }
body .work-history { margin-top:30px; }
body .work-history-table { min-width:900px; table-layout:fixed; }
body .work-history-table th:nth-child(1) { width:24%; }
body .work-history-table th:nth-child(2),body .work-history-table th:nth-child(3) { width:12%; }
body .work-history-table th:nth-child(4) { width:21%; }
body .work-history-table th:nth-child(5) { width:10%; }
body .work-history-table th:nth-child(6) { width:21%; }
body .work-history-table td { white-space:normal; padding:16px 14px; min-width:0!important; max-width:none!important; }
body .work-history-table .row-actions { gap:6px; }
body .work-history-table .his-thumb { width:34px; height:34px; border-radius:7px; }
body .history-item { padding:18px; gap:16px; margin-bottom:14px; }
body .history-item-actions { max-width:none; display:flex; gap:6px; align-items:center; }
body .history-item .his-date { font-size:14px; font-weight:500; }
body .ts-event-line .badge { min-width:86px; justify-content:center; }
body.page-login { background:var(--bg); }
body .login-card { border:1px solid var(--border); max-width:440px; padding:32px; box-shadow:var(--shadow-sm); border-radius:var(--radius-lg); animation:none; }
body .login-card h1 { font-size:28px; }
body .login-logo { margin-bottom:18px; }
body .login-foot { line-height:1.7; }
body :is(button,a,input,select,textarea,summary):focus-visible { outline:2px solid var(--focus-ring); outline-offset:3px; }
body :is(h1,h2,h3,h4) { text-wrap:balance; }
body :is(p,.sub,.cell-sub,.cam-guidance) { text-wrap:pretty; }
body :is(.clock-time,.stat-num,.work-day-summary b,.tbl,.site-code,.dx-mini .v,.stat-mini .v) { font-variant-numeric:tabular-nums; }
body .user-topbar { backdrop-filter:none; padding-top:calc(12px + env(safe-area-inset-top)); }
body .topbar { padding-top:env(safe-area-inset-top); height:calc(var(--topbar-h) + env(safe-area-inset-top)); }
body .bottom-nav { background:var(--surface); backdrop-filter:none; z-index:var(--z-bottom-nav); }
body .site-code { background:var(--site-code-bg); }
body .site-open:hover { border-color:var(--red-400); background:var(--red-50); }
body .skip-link { position:fixed; top:8px; left:16px; z-index:var(--z-toast); padding:12px 16px; border-radius:var(--radius-sm); background:var(--surface); color:var(--red-700); border:2px solid var(--focus-ring); transform:translateY(-160%); }
body .skip-link:focus { transform:none; }
body #page-root { scroll-margin-top:calc(var(--topbar-h) + 16px); }
@media(max-width:1100px){body .dash-grid{grid-template-columns:repeat(2,minmax(0,1fr))}body .work-overview{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:18px}body .clock-card,body .work-context{padding:20px}}
@media(max-width:992px){body .main{margin-left:0}body .work-overview{grid-template-columns:minmax(0,1fr)}body .work-context .work-day-summary{grid-template-columns:repeat(4,minmax(0,1fr))}body .sidebar{visibility:hidden}body .sidebar.open{visibility:visible}body:has(.sidebar.open){overflow:hidden}}
@media(max-width:768px){
 body .page{padding:24px 16px calc(88px + env(safe-area-inset-bottom))}body .page-head h1{font-size:24px}body .page-head{margin-bottom:24px}
 body .topbar{padding:0 12px;height:60px}body .user-topbar{padding:10px 16px;gap:8px}body .user-topbar .u-name{max-width:28vw}
 body .topbar-search{display:none}
 body .card-pad,body .settings-grid>.card{padding:18px}body .work-overview{gap:16px}body .clock-card,body .work-context{padding:20px}
 body .work-clock-header{gap:12px;flex-wrap:wrap}body .clock-time{font-size:40px}body .ts-status .badge{font-size:12px}
 body .work-context .work-day-summary{grid-template-columns:repeat(2,minmax(0,1fr))}body .work-day-summary b{font-size:18px}
 body .filter-bar{padding:16px!important}body .filter-bar>select{min-width:0;width:100%}
 body .dash-grid{gap:12px;margin-bottom:20px}body .stat-card{padding:14px;gap:10px}body .stat-ico{width:36px;height:36px}body .stat-num{font-size:23px}body .stat-label{font-size:11px}
 body .ent-grid,body .dx-explorer{gap:18px}body .data-tabs{width:100%;gap:4px}body .data-tabs .chip{flex:1;padding:8px 10px;font-size:12px}
 body[data-page="settings"] .data-tabs{flex-wrap:nowrap;overflow-x:auto;padding:5px;scrollbar-width:thin}
 body[data-page="settings"] .data-tabs .chip{flex:none;white-space:nowrap}
 body .loc-item{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;padding:14px}
 body .loc-actions{justify-content:flex-end;border-top:1px solid var(--border);padding-top:8px}
 body .data-section-fold .dash-right{grid-template-columns:minmax(0,1fr)}body .data-section-fold{padding:18px}body .data-section-fold>summary small{display:block;margin:6px 0 0}
 body .dx-dashboard-search{min-width:0;width:100%;flex-basis:100%}
 body .user-toolbar .select{max-width:100%}body .profile-head{padding:20px;gap:16px}body .profile-name{font-size:21px}
 body .profile-settings{grid-template-columns:minmax(0,1fr);gap:18px;margin-top:20px}
 body .input,body .select,body .textarea,body .help-form input,body .help-form select,body .help-form textarea{font-size:16px}
 body .modal-overlay{padding:12px;align-items:center}body .modal{max-height:calc(100dvh - 24px);border-radius:16px;max-width:580px;transform:translateY(12px)}
 body .modal-head,body .modal-body{padding:18px}body .modal-foot{padding:14px 18px;padding-bottom:max(14px,env(safe-area-inset-bottom))}body .modal-head h3{font-size:16px}
 body .history-item{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}body .history-item-actions{border-top:1px solid var(--border);padding-top:12px;justify-content:flex-end;width:100%;flex-wrap:wrap}
 body .work-history{margin-top:24px}body .work-history .section-title{gap:14px}
 body .tbl-responsive .tbl td{padding:8px 0}body .tbl-responsive .tbl tr{box-shadow:none}
 body .site-results{max-height:230px}body .btn-icon,body .icon-btn{width:44px;height:44px;min-width:44px;min-height:44px}body .cam-guidance{padding:16px;font-size:12px}
 body .btn-sm,body .chip,body .view-toggle button,body .bnav-item{min-height:44px}
 body .user-topbar{padding-left:12px;padding-right:12px;flex-wrap:wrap}
 body .user-topbar .u-name{display:none}body .user-topbar .b-name{max-width:36vw}
 body .user-topbar .spacer{min-width:0}body .user-topbar .avatar{width:32px;height:32px}
 body .topbar{height:calc(64px + env(safe-area-inset-top))}
 body #dd-notif .dropdown-menu{position:fixed;top:calc(72px + env(safe-area-inset-top));left:12px;right:12px;width:auto;min-width:0;max-width:none}
 body .back-btn,body .install-btn{min-height:44px}
 body .back-btn{padding:8px 10px}body .help-request{padding:16px}body .login-card{padding:28px 24px}
}
@media(max-width:360px){body .user-topbar{gap:4px}body .user-topbar .brand-logo{width:32px;height:32px}body .user-topbar .b-name{max-width:34vw;font-size:12px}}
@media(prefers-reduced-motion:reduce){body *,body *::before,body *::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* One calm workspace: shared rhythm, flat metric bands, and details on demand. */
body .page-head {align-items:center;margin-bottom:28px}
body .page-head .sub {max-width:64ch;color:var(--text-2);font-size:13px}
body .head-actions {gap:8px;align-items:center}
body .topbar-title {display:flex;align-items:center;gap:12px;font-size:12px}
body .workspace-label,body .workspace-divider {color:var(--text-3);font-weight:400}
body .nav-group-label {font-size:10px;padding:24px 12px 10px}
body .nav-item {border-radius:8px;font-size:13px;min-height:44px}
body .nav-item.active>.ic {color:var(--red-600)}
body .nav-badge,body .nav-item.active .nav-badge {background:transparent;color:var(--text-3);padding:0 2px}
body .brand-logo {width:38px;height:38px;border:1px solid var(--border);border-radius:8px}
body .brand-sub {font-size:10px}
body .sidebar-foot {border:0;background:var(--bg);padding:20px 16px}
body .dash-grid {gap:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}
body .dash-grid>.stat-card {border:0;border-right:1px solid var(--border);border-radius:0;padding:22px 26px;background:transparent;box-shadow:none}
body .dash-grid>.stat-card:last-child {border-right:0}
body .dash-grid .stat-ico {display:none}
body .dash-grid .stat-num {font-size:28px;line-height:1.3;font-weight:500;color:var(--text)}
body .dash-grid .stat-label {font-size:12px;margin-top:6px;color:var(--text-2)}
body .input,body .select,body .textarea {background:var(--surface-inset);border-color:var(--border);box-shadow:none}
body .input:hover,body .select:hover {border-color:var(--border-strong)}
body .input:focus,body .select:focus,body .textarea:focus {border-color:var(--text-2)}
body .tbl th {background:var(--surface);padding:16px 20px;border-bottom:1px solid var(--border);font-size:11px}
body .tbl td {padding:18px 20px;border-color:var(--border);vertical-align:middle}
body .tbl td b,body .cell-main {font-weight:500}
body .tbl tbody tr:last-child td {border-bottom:0}
body .tbl tbody tr:hover {background:var(--bg)}
body .badge {border-radius:5px;font-size:11px;padding:3px 8px;font-weight:400}
body .row-actions .btn-soft {background:var(--surface-2);color:var(--text-2)}
body .row-actions .btn-icon {color:var(--text-3)}
body .view-toggle {border:0;background:var(--surface-2);border-radius:8px;gap:2px}
body .view-toggle button {font-size:12px;border-radius:6px;min-height:36px}
body .view-toggle button.active {box-shadow:var(--shadow-xs);background:var(--surface);color:var(--text)}
body .chips .chip {background:transparent;border-color:transparent;color:var(--text-2);border-radius:6px}
body .chips .chip.active {background:var(--surface-2);color:var(--text);border-color:var(--border)}
body .data-tabs {background:transparent;border:0;border-bottom:1px solid var(--border);border-radius:0;padding:0;gap:20px;width:100%}
body .data-tabs .chip {min-height:48px;padding:10px 2px;border:0;border-bottom:2px solid transparent;border-radius:0;box-shadow:none}
body .data-tabs .chip.active {background:transparent;border-bottom-color:var(--text);color:var(--text);box-shadow:none}
body .data-view-control {margin-bottom:20px}
body .page-toolbar {display:flex;gap:16px;align-items:center;justify-content:space-between;margin-bottom:24px}
body .page-toolbar .data-tabs {margin:0;min-width:0;width:auto;flex:1}
body .page-toolbar .data-view-control {margin:0;flex:none}
body .ent-grid.entities-focused {grid-template-columns:minmax(0,1fr)}
body .ent-grid>.card>.section-title {padding:24px!important}
body .entity-card-list,body .user-card-list {padding:16px;gap:12px}
body .entity-card,body .user-card,body .attendance-card {box-shadow:none;border-color:var(--border);padding:20px}
body .entity-card-meta,body .user-card-meta {padding:6px 0}
body .user-card .row-actions {border-top:1px solid var(--border);padding-top:14px;margin-top:14px}
body .user-toolbar,body .pj-toolbar {gap:16px;margin-bottom:24px}
body .pj-toolbar-controls {gap:12px}
body .pj-toolbar .chips {gap:4px}
body .pj-card {padding:24px!important}
body .pj-card h3 {font-size:16px!important;line-height:1.65}
body .dx-datebar {padding:16px!important;gap:12px;margin-bottom:20px}
body .dx-site {background:var(--surface);padding:18px;border-color:var(--border);border-radius:10px}
body .dx-row {background:var(--surface);border-color:var(--border);border-radius:10px;padding:16px}
body .dx-explorer.dx-focused {grid-template-columns:minmax(0,1fr)}
body .dx-focused .dx-sites {grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:14px}
body .dx-focused>.card>.section-title {padding:24px!important}
body .dx-focused>.card>div:not(.section-title) {padding:0 24px 24px!important}
body .dashboard-sections {margin:28px 0 24px}
body .dx-focused .dx-row:last-child {margin-bottom:0}
body .dx-thumb-empty {border-radius:8px;background:var(--surface-2);color:var(--text-3)}
body .data-section-fold {background:transparent;border:1px solid var(--border);border-radius:10px;padding:18px 20px}
body .data-section-fold>summary {font-size:13px;color:var(--text-2)}
body .data-section-fold>summary small {font-size:11px}
body .settings-grid.settings-focused {max-width:1040px;grid-template-columns:minmax(0,1fr)}
body .settings-grid>.card {padding:28px}
body .settings-grid .section-title h2 {font-size:16px}
body .shift-config-row {background:var(--bg);border:1px solid var(--border);padding:16px}
body .loc-item {border-color:var(--border);border-radius:8px}
body .settings-category-mobile {display:none}
body .loc-more {position:relative;flex:none}
body .loc-more>summary {width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:8px;color:var(--text-2);list-style:none}
body .loc-more>summary::-webkit-details-marker {display:none}
body .loc-more>summary:hover {background:var(--surface-2)}
body .loc-more-items {position:absolute;right:0;top:44px;z-index:5;width:168px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:6px;box-shadow:var(--shadow-md)}
body .loc-more-items>button {min-height:44px;width:100%;display:flex;gap:8px;align-items:center;text-align:left;padding:10px 12px;border-radius:6px;font-size:13px}
body .loc-more-items>button:hover {background:var(--surface-2)}
body .loc-more-items>[data-delloc] {color:var(--red-700)}
body .board {gap:16px;align-items:start}
body .col {background:transparent;border:0;min-height:0}
body .col-head {padding:14px 8px 20px;gap:8px}
body .col-head .name {font-size:13px;font-weight:500}
body .col-head .count {background:transparent;color:var(--text-3)}
body .col-body {padding:0;gap:12px}
body .k-card {border:1px solid var(--border);box-shadow:none;padding:18px;border-radius:10px}
body .k-card .title {font-size:14px;line-height:1.7}
body .add-card {background:transparent;border:1px dashed var(--border-strong);border-radius:8px;color:var(--text-2)}
body .profile-head {padding:28px;background:var(--surface)}
body .install-btn {background:transparent;color:var(--text-2);border:1px solid var(--border);box-shadow:none}
body .pstat {gap:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}
body .pstat>.card {background:transparent;border:0;border-right:1px solid var(--border);border-radius:0;padding:20px 14px;box-shadow:none}
body .pstat>.card:last-child {border-right:0}
body .pstat .v {color:var(--text);font-size:26px;font-weight:500}
body .pstat .l {font-size:11px;color:var(--text-2)}
body .profile-tools>details>summary {display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer;font-weight:500}
body .profile-tools>details>summary::after {content:'＋';margin-left:auto;color:var(--text-3)}
body .profile-tools>details[open]>summary::after {content:'−'}
body .profile-tools>details>summary::-webkit-details-marker {display:none}
body .profile-tools>details[open]>summary {margin-bottom:16px}
body .profile-tools .install-forever {text-align:left}
body .work-overview {grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr);gap:24px}
body .clock-card {border-top:1px solid var(--border);padding:28px}
body .clock-time {font-size:56px;font-weight:500;line-height:1.2}
body .work-clock-header {padding-bottom:24px}
body .work-context {padding:24px;background:transparent;border:0}
body .work-day-summary {gap:24px 20px;margin-top:24px}
body .work-day-summary>div,body .work-day-summary .work-ot {background:transparent;border:0;padding:0;border-radius:0}
body .work-day-summary b {font-size:20px;margin-top:8px}
body .work-day-summary .work-ot b {color:var(--red-700)}
body .work-day-info {background:transparent;padding:16px 0 0;border:0;border-top:1px solid var(--border);border-radius:0}
body .work-site-total {border-top:1px solid var(--border)}
body #ts-checkout-current {background:var(--text);border-color:var(--text);color:var(--surface)}
body .work-more summary {border:0;padding:8px 0;color:var(--text-2);justify-content:flex-start}
body .work-shift-choice {padding:4px 0}
body .history-item {border:1px solid var(--border);box-shadow:none;border-radius:10px}
body .labor-filters {padding:18px;margin-bottom:24px}
body .labor-stats {gap:0;background:var(--surface);border:1px solid var(--border);border-radius:14px}
body .labor-stats>.labor-stat {border:0;border-right:1px solid var(--border);border-radius:0;padding:24px;background:transparent}
body .labor-stats>.labor-stat:last-child {border:0}
body .labor-stat strong {font-size:26px;font-weight:500}
body .labor-stat-total strong {font-size:38px}
body .labor-site {padding:24px}
body .labor-site-price {font-size:30px;font-weight:500}
body .labor-site-split {padding:16px 0}
body .labor-site-split b {font-weight:500}
body .labor-review {border-left:3px solid var(--warning);padding:20px 24px}
body .labor-review h2 {font-size:16px}
body .labor-section-head h2 {font-size:17px}
body .login-wrap {gap:64px;max-width:960px}
body .login-intro h2 {font-size:40px;line-height:1.45;max-width:12ch;color:var(--text)}
body .login-brand {margin-bottom:48px}
body .login-card {padding:36px;box-shadow:none;border-radius:16px}
body .login-card h1 {font-size:24px}
body .login-guide {margin-top:24px;max-width:400px;color:var(--text-2);font-size:13px}
body .login-guide>summary {cursor:pointer;min-height:44px;display:flex;align-items:center;gap:8px}
body .login-guide>summary::after {content:'＋';margin-left:auto}
body .login-guide[open]>summary::after {content:'−'}
body .login-guide .login-steps {margin-top:16px;gap:18px}
body .login-step-number {background:transparent;border:0;border-radius:0;width:24px;height:24px;font-size:11px}
body .login-steps b {font-size:12px;font-weight:400}
@media(max-width:1100px){body .page{padding:32px 24px 48px}body .topbar{padding-inline:24px}body .dash-grid>.stat-card:nth-child(2){border-right:0}body .dash-grid>.stat-card:nth-child(-n+2){border-bottom:1px solid var(--border)}}
@media(max-width:992px){body .work-overview{grid-template-columns:minmax(0,1fr)}body .work-context{padding:20px 4px}body .labor-stat-total strong{font-size:32px}body .workspace-label,body .workspace-divider{display:none}}
@media(max-width:768px){
 body .page{padding:24px 16px calc(96px + env(safe-area-inset-bottom))}
 body .page-head{gap:16px;margin-bottom:24px}body .page-head h1{font-size:25px}
 body .page-head .head-actions{width:100%;gap:8px}body .head-actions .btn{flex:1;font-size:12px;padding:10px 12px}
 body .topbar{padding-inline:12px}body .topbar-title{font-size:12px}
 body .dash-grid>.stat-card{padding:18px 20px}body .dash-grid .stat-num{font-size:26px}
 body .dash-grid .stat-label{font-size:11px}
 body .data-tabs{gap:16px;flex-wrap:wrap}body .data-tabs .chip{font-size:12px;padding:8px 0}
 body .page-toolbar{align-items:flex-start;flex-wrap:wrap;gap:12px}body .page-toolbar .data-tabs{flex-basis:100%}
 body .view-toggle button,body .btn-sm{min-height:44px}
 body .settings-grid>.card{padding:20px}body .settings-focused{gap:16px}
 body[data-page="settings"] .data-tabs{display:none}
 body .settings-category-mobile{display:grid;gap:8px;margin-bottom:24px;font-size:12px;color:var(--text-2)}
 body .settings-category-mobile .select{width:100%}
 body .loc-item{grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:12px;margin-bottom:8px}
 body .loc-actions{border:0;padding:0;gap:0;align-items:center}
 body .loc-more>summary{width:44px;height:44px}
 body .ent-grid>.card>.section-title{padding:18px!important;flex-wrap:wrap;gap:12px}
 body .entity-card-list,body .user-card-list{padding:12px}
 body .user-toolbar,.pj-toolbar{gap:12px;margin-bottom:20px}
 body .dx-explorer{gap:20px}body .dx-datebar{padding:14px!important}
 body .work-overview{gap:12px}body .clock-card{padding:22px}body .clock-time{font-size:46px}
 body .work-context .work-day-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
 body .work-context{padding:20px 4px}body .work-day-summary b{font-size:19px}
 body .labor-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 body .labor-stats>.labor-stat{padding:18px;border:0}
 body .labor-stats>.labor-stat-total{border-bottom:1px solid var(--border)}
 body .labor-stats>.labor-stat:nth-child(2){border-right:1px solid var(--border)}
 body .labor-stat strong{font-size:24px}body .labor-stat-total strong{font-size:34px}
 body .labor-site{padding:20px}body .labor-site-price{font-size:28px}
 body .labor-review{padding:18px}body .labor-filters{padding:16px}
 body .login-wrap{gap:24px}body .login-card{padding:28px 24px}
 body .login-brand{margin-bottom:0}body .login-guide{margin:12px 0 0;display:none}
 body .dx-focused>.card>.section-title{padding:18px!important}body .dx-focused>.card>div:not(.section-title){padding:0 18px 18px!important}
 body .modal-foot .btn{flex:1}body .bottom-nav{border-top:1px solid var(--border)}
}
body #attendance-help {display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}