:root{--primary: #d31922;--primary-dark: #b3121b;--primary-light: rgba(211, 25, 34, .1);--gradient-primary: linear-gradient(135deg, #d31922 0%, #b3121b 100%);--white: #ffffff;--gray-50: #f8f9fa;--gray-100: #f1f3f5;--gray-200: #e9ecef;--gray-300: #dee2e6;--gray-400: #ced4da;--gray-500: #adb5bd;--gray-600: #6c757d;--gray-700: #495057;--gray-800: #343a40;--gray-900: #212529;--success: #198754;--success-bg: #d1e7dd;--success-border: #a3cfbb;--warning: #ffc107;--warning-bg: #fff3cd;--warning-border: #ffecb5;--danger: #d31922;--danger-bg: #f8d7da;--danger-border: #f1aeb5;--bg: var(--gray-100);--card: var(--white);--border: var(--gray-200);--shadow-sm: 0 1px 3px rgba(0,0,0,.08);--shadow: 0 4px 12px rgba(0,0,0,.1);--shadow-lg: 0 8px 24px rgba(0,0,0,.12);--radius: 10px;--radius-lg: 14px}*,*:before,*:after{box-sizing:border-box}html,body{height:100%;margin:0;padding:0}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--gray-100);color:var(--gray-800);line-height:1.5;-webkit-font-smoothing:antialiased}.container{width:100%;max-width:1100px;margin:0 auto;padding:20px}.btn{width:100%;border:none;padding:16px 24px;border-radius:var(--radius);font-weight:700;font-size:15px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:var(--shadow);min-height:54px}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed}.btnPrimary{background:var(--gradient-primary);color:#fff;border:none}.btnPrimary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #d3192266}.btnSuccess{background:var(--success);color:#fff;border:none}.btnSuccess:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #19875466}.btnDanger{background:var(--danger);color:#fff;border:none}.btnDanger:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #d3192266}.btnSecondary{background:var(--gray-700);color:#fff;border:none}.btnSecondary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #343a4066}.btnActionGrid--secondary{background:var(--gray-700);color:#fff;border:none}.btnActionGrid--secondary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #343a4066}.input{width:100%;padding:16px;border-radius:var(--radius);border:2px solid var(--gray-300);outline:none;background:var(--white);font-weight:500;font-size:16px;transition:all .2s;min-height:54px}.input:focus{border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-light)}.card{background:var(--card);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:24px;transition:all .2s}.label-badge{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;font-weight:700;font-size:13px}.label-badge--success{background:var(--success-bg);color:var(--success)}.label-badge--danger{background:var(--danger-bg);color:var(--danger)}.label-badge--primary{background:var(--primary);color:#fff}.grid{display:grid;gap:16px}.grid--2{grid-template-columns:repeat(2,1fr)}@media(max-width:768px){.container{padding:12px;max-width:100%}.grid--2,.grid--3{grid-template-columns:1fr}.card{padding:16px;border-radius:12px}.btn{min-height:50px;padding:14px 16px;font-size:14px;width:100%}.input{min-height:48px;padding:12px 14px;font-size:15px}.header{padding:12px 16px;flex-direction:column;gap:10px}.headerTitle{font-size:18px}.tabs{display:flex;flex-wrap:wrap;gap:8px;padding:8px}.tab{flex:1 1 calc(50% - 8px);min-width:calc(50% - 8px);padding:10px 8px;font-size:12px;text-align:center}.sectionHeader{flex-direction:column;gap:12px;align-items:stretch}.sectionHeader h3{font-size:16px;text-align:center}table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}thead{display:none}tbody,tr,td{display:block;width:100%}tr{margin-bottom:12px;border:1px solid var(--gray-300);border-radius:8px;background:var(--white);padding:8px}td{padding:8px 4px;text-align:left;border:none}td:before{content:attr(data-label);font-weight:600;color:var(--primary);display:block;font-size:11px;text-transform:uppercase;margin-bottom:2px}.shiftsGrid{grid-template-columns:1fr;gap:12px}.shiftCard{padding:14px}.shiftHeader{flex-direction:column;gap:8px;align-items:flex-start}.shiftTimes,.shiftMeta{flex-direction:column;gap:4px}.shiftDays{flex-wrap:wrap}.shiftActions{flex-direction:column;gap:8px}.shiftActions .btn{width:100%}.statsGrid{grid-template-columns:1fr;gap:10px}.statCard{padding:14px;flex-direction:row;justify-content:space-between;align-items:center}.statIcon{font-size:20px}.statValue{font-size:18px}.modal{width:95%;max-width:95%;padding:16px;max-height:90vh;overflow-y:auto}.modal h3{font-size:18px}.formGroup{margin-bottom:14px}.formGroup label{font-size:13px}.formGrid{grid-template-columns:1fr;gap:12px}.badge{font-size:10px;padding:4px 8px}.coordsGrid{grid-template-columns:1fr;gap:8px}.statusCard{padding:20px 16px;flex-direction:column;text-align:center;gap:12px}.statusIcon{font-size:36px}.statusTitle{font-size:20px}.statusTime{width:100%}.breakCard{padding:14px}.breakHeader{flex-direction:column;gap:8px;align-items:flex-start}.breakTimer{padding:12px}.breakTime{font-size:28px}.exerciseList{gap:8px}.exerciseItem{padding:12px;flex-direction:column;gap:6px}.exerciseActions{width:100%;justify-content:flex-end}.usersTable{overflow-x:auto}.sectionTitleWrap{flex-direction:row;align-items:center;gap:8px}.sectionTitle{font-size:16px}.sectionIcon{font-size:18px}.statusBadge{font-size:11px;padding:4px 8px}.checkInActions{gap:10px}.btnActionLarge{padding:18px 16px;font-size:15px}.grid,.grid--2,.grid--3,.grid--4{grid-template-columns:1fr}.actionButtons{flex-direction:column;gap:8px}.loginPage{padding:20px}.loginCard{padding:24px 20px}.loginLogo{width:80px;height:80px}.loginTitle{font-size:22px}.loginSubtitle{font-size:13px}}@media(max-width:400px){.container{padding:8px}.tab{flex:1 1 100%;min-width:100%;padding:12px 8px;font-size:13px}.btn{padding:12px 14px;font-size:13px}.card{padding:14px}h3{font-size:15px}.shiftCard{padding:12px}.statusCard{padding:16px 12px}.statusIcon{font-size:32px}.statusTitle{font-size:18px}.timerValue{font-size:24px}}@media(min-width:769px)and (max-width:1024px){.container{padding:16px;max-width:90%}.grid--2,.grid--3{grid-template-columns:repeat(2,1fr)}.tab{padding:12px 16px;font-size:13px}.shiftsGrid,.statsGrid{grid-template-columns:repeat(2,1fr)}}