@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap";@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";:root{--primary: #5B6CF6;--primary-light: #EEF0FF;--primary-dark: #4556E0;--success: #22C55E;--success-light: #DCFCE7;--success-text: #15803D;--danger: #EF4444;--danger-light: #FEE2E2;--danger-text: #B91C1C;--warning: #F59E0B;--warning-light: #FEF3C7;--warning-text: #92400E;--info: #3B82F6;--info-light: #DBEAFE;--info-text: #1D4ED8;--header-bg: #FFFFFF;--header-text: #1E2A3B;--header-border: rgba(91,108,246,.15);--sidebar-bg: #F0F2FF;--sidebar-bg2: #FAFBFF;--sidebar-border: #E0E4FF;--menu-hover-bg: #F4F6FB;--menu-active-bg: #EEF0FF;--menu-active-text: #5B6CF6;--menu-active-border: #5B6CF6;--card-bg: #FFFFFF;--card-border: #E8ECF4;--table-header-bg: #F4F6FB;--table-header-text: #64748B;--table-row-hover: #FAFBFD;--table-cell-text: #1E2A3B;--table-border: #E8ECF4;--table-divider: #F4F6FB;--input-bg: #FFFFFF;--input-border: #E8ECF4;--input-text: #1E2A3B;--input-placeholder: #A0ADBF;--label-color: #64748B;--btn-bg: #5B6CF6;--btn-text: #FFFFFF;--btn-hover: #4556E0;--bg: #F4F6FB;--surface: #FFFFFF;--border: #E8ECF4;--text-primary: #1E2A3B;--text-secondary: #64748B;--text-muted: #A0ADBF;--stat-bg: #FFFFFF;--stat-border: #E8ECF4;--stat-label: #64748B;--stat-value: #1E2A3B;--stat-sub: #A0ADBF;--stat-income-bg: #F0FDF4;--stat-income-value: #15803D;--stat-income-label: #22C55E;--stat-expense-bg: #FFF5F5;--stat-expense-value: #991B1B;--stat-expense-label: #EF4444;--stat-warning-bg: #FFFBEB;--stat-warning-value: #92400E;--stat-warning-label: #F59E0B;--stat-primary-bg: #EEF0FF;--stat-primary-color: #5B6CF6;--pick-outline: #5B6CF6;--shadow-sm: 0 1px 3px rgba(30,42,59,.06), 0 1px 2px rgba(30,42,59,.04);--shadow-md: 0 4px 12px rgba(30,42,59,.08), 0 2px 4px rgba(30,42,59,.04);--shadow-lg: 0 10px 30px rgba(30,42,59,.1), 0 4px 8px rgba(30,42,59,.06);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-xl: 20px;--sidebar-width: 130px;--header-height: 60px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,Segoe UI,sans-serif;color:var(--text-primary);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;background:var(--bg-gradient, radial-gradient(ellipse 65% 55% at 10% 18%, rgba(100,150,255,.45) 0%, transparent 100%), radial-gradient(ellipse 55% 65% at 90% 12%, rgba(120,80,240,.35) 0%, transparent 100%), radial-gradient(ellipse 60% 55% at 70% 88%, rgba(60,100,220,.4) 0%, transparent 100%), radial-gradient(ellipse 40% 45% at 30% 82%, rgba(40,130,200,.28) 0%, transparent 100%), linear-gradient(155deg, #2d4575 0%, #334d8a 45%, #263c70 100%) );background-attachment:fixed;min-height:100vh}.app-container{min-height:100vh;display:flex;flex-direction:column}.app-header{height:var(--header-height);background:transparent;color:#ffffffe6;padding:0 1.5rem;display:flex;justify-content:space-between;align-items:center;border-bottom:none;box-shadow:none;position:sticky;top:8px;z-index:100;margin:8px 10px 0;border-radius:16px;flex-shrink:0}.app-header h1{font-size:1rem;font-weight:700;color:#ffffffeb;letter-spacing:-.3px}.user-info{display:flex;align-items:center;gap:.75rem}.user-info span{font-size:.875rem;font-weight:500;color:#ffffffc7}.logout-btn{background:rgba(255,255,255,.14);color:#ffffffeb;border:1px solid rgba(255,255,255,.28);padding:.45rem 1rem;border-radius:var(--radius-md);cursor:pointer;font-size:.8rem;font-weight:600;transition:all .15s ease;font-family:inherit}.logout-btn:hover{background:rgba(255,255,255,.24);color:#fff}.main-container{display:flex;flex:1;overflow:visible;padding:8px 10px 10px;gap:10px;height:calc(100vh - var(--header-height) - 26px)}.sidebar{width:var(--sidebar-width);background:transparent;padding:1rem .6rem;box-shadow:none;border-right:none;overflow-y:auto;height:100%;flex-shrink:0;border-radius:16px}.sidebar nav{display:flex;flex-direction:column;gap:2px}.menu-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;padding:.6rem .5rem;margin:0;background:none;border:none;color:var(--text-secondary);cursor:pointer;text-align:center;font-size:.8rem;font-weight:500;border-radius:var(--radius-md);transition:all .15s ease;width:100%;font-family:inherit;border-left:none}.menu-item:hover{background:var(--menu-hover-bg);color:var(--text-primary)}.menu-item.active{background:var(--menu-active-bg);color:var(--menu-active-text);font-weight:700;border-left:none;border-bottom:3px solid var(--menu-active-border);padding-bottom:calc(.6rem - 3px)}.menu-item.active .menu-icon{filter:none}.menu-icon{display:flex;align-items:center;justify-content:center;width:26px;height:26px;flex-shrink:0}.menu-label{line-height:1.2;font-size:.72rem;word-break:keep-all}.content{flex:1;padding:1rem 1.25rem;overflow-y:auto;height:100%;min-height:0}.content-section h2{color:var(--text-primary);margin-bottom:1.25rem;font-size:1.4rem;font-weight:700;letter-spacing:-.4px;border-left:4px solid var(--primary);padding-left:.75rem}.card{background:var(--card-bg);border-radius:14px;padding:1.25rem;border:1.5px solid var(--card-border);box-shadow:0 2px 8px #1e2a3b0d}.card:has(form){background:var(--table-header-bg)}.content-section{padding:0}.stock-table{width:100%;border-collapse:collapse;font-size:.875rem;background:var(--card-bg);border-radius:14px;overflow:hidden;border:1.5px solid var(--table-border)}.stock-table th{background:var(--table-header-bg);color:var(--table-header-text);padding:.75rem 1rem;text-align:left;font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.4px;border-bottom:1.5px solid var(--table-border);white-space:nowrap}.stock-table td{padding:.8rem 1rem;border-bottom:1px solid var(--table-divider);color:var(--table-cell-text);vertical-align:middle}.stock-table tr:last-child td{border-bottom:none}.stock-table tr:hover td{background:var(--table-row-hover)}.attendance-table th{padding:.5rem .4rem;font-size:.72rem;white-space:nowrap}.attendance-table td{padding:.4rem;font-size:.72rem}.attendance-table button{padding:.2rem .4rem!important;font-size:.68rem!important}.status-badge{display:inline-flex;align-items:center;padding:.25rem .65rem;border-radius:20px;font-size:.75rem;font-weight:600;line-height:1}.status-badge.available{background:var(--success-light);color:#15803d}.status-badge.low{background:var(--warning-light);color:#92400e}.production-form{max-width:100%}.form-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.75rem;margin-bottom:.75rem}.form-row.single{grid-template-columns:1fr}.form-group{display:flex;flex-direction:column;gap:.35rem}.form-group label{color:var(--label-color);font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.4px}.form-input,.form-select{width:100%;padding:.6rem .875rem;border:1.5px solid var(--input-border);border-radius:8px;font-size:.875rem;font-family:Inter,Segoe UI,sans-serif;color:var(--input-text);background:var(--input-bg);transition:border-color .15s,box-shadow .15s;outline:none}.form-input:focus,.form-select:focus{border-color:var(--primary);box-shadow:0 0 0 3px #5b6cf61a}.form-input::placeholder{color:var(--input-placeholder)}.file-input{font-size:.82rem;cursor:pointer;max-width:100%}.image-preview{display:inline-flex;align-items:center;margin-top:.35rem;gap:.4rem}.image-preview img{width:52px;height:52px;border-radius:6px;object-fit:cover;border:1px solid #E8ECF4}.submit-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.6rem 1.4rem;background:var(--btn-bg);color:var(--btn-text);border:none;border-radius:8px;font-size:.875rem;font-weight:600;cursor:pointer;transition:background .15s,transform .1s,box-shadow .15s;font-family:Inter,Segoe UI,sans-serif;line-height:1}.submit-btn:hover:not(:disabled){background:var(--btn-hover);box-shadow:0 4px 12px #5b6cf64d;transform:translateY(-1px)}.submit-btn:active:not(:disabled){transform:translateY(0)}.wage-display{background:var(--primary-light);padding:1.25rem;border-radius:var(--radius-lg);border:1.5px solid rgba(91,108,246,.2);margin-bottom:1.25rem}.wage-amount{font-size:1.75rem;font-weight:800;color:var(--primary);margin-top:.4rem;letter-spacing:-.5px}.wage-calculation{font-size:.82rem;color:var(--text-secondary);margin-top:.4rem}.chat-container{background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--border);display:flex;flex-direction:column;height:580px;overflow:hidden}.chat-messages{flex:1;padding:1.25rem;overflow-y:auto;display:flex;flex-direction:column;gap:.75rem;scroll-behavior:smooth}.chat-messages::-webkit-scrollbar{width:4px}.chat-messages::-webkit-scrollbar-track{background:transparent}.chat-messages::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}.message{display:flex;margin-bottom:.25rem;width:100%}.message-content{max-width:68%;padding:.65rem 1rem;border-radius:16px;position:relative;word-wrap:break-word;font-size:.875rem;line-height:1.5}.message-time{font-size:.7rem;opacity:.65;display:block;margin-top:.25rem}.chat-input{display:flex;padding:1rem;border-top:1px solid var(--border);gap:.5rem;background:var(--bg)}.chat-input input{flex:1;padding:.6rem 1rem;border:1.5px solid var(--border);border-radius:24px;font-size:.875rem;font-family:inherit;background:var(--surface);outline:none;transition:border-color .15s}.chat-input button{padding:.6rem 1.25rem;background:var(--primary);color:#fff;border:none;border-radius:24px;cursor:pointer;font-size:.875rem;font-weight:600;font-family:inherit;transition:background .15s}.chat-input button:hover{background:var(--primary-dark)}@media (max-width: 1100px){:root{--sidebar-width: 110px}.content{padding:1.25rem 1rem}.app-header{padding:0 1rem}}@media (max-width: 850px){:root{--sidebar-width: 90px}.app-header h1{font-size:.88rem}.menu-label{font-size:.66rem}.content{padding:1rem .875rem}.form-row{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}}@media (max-width: 680px){:root{--sidebar-width: 70px;--header-height: 52px}.app-header{padding:0 .75rem}.app-header h1{font-size:.8rem}.sidebar{padding:.75rem .25rem}.menu-item{padding:.55rem .15rem;gap:.2rem}.menu-label{font-size:.6rem}.content{padding:.875rem .625rem}.form-row{grid-template-columns:1fr 1fr}.user-info{gap:.4rem}.logout-btn{padding:.4rem .7rem;font-size:.75rem}}@media (max-width: 480px){:root{--sidebar-width: 56px;--header-height: 50px}.menu-label{display:none}.menu-item{padding:.65rem .1rem;border-radius:8px}.menu-icon{width:24px;height:24px}.content{padding:.75rem .5rem}.app-header h1{display:none}.user-info>div:first-child>div:first-child>span:not(.badge-modern){max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.logout-btn{padding:.35rem .55rem;font-size:.72rem}.form-row{grid-template-columns:1fr}.message-content{max-width:85%}}@media (max-width: 850px){.stock-table-wrapper,.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:14px;border:1.5px solid var(--table-border);margin-bottom:1.25rem}.stock-table-wrapper .stock-table,.table-scroll .stock-table{border-radius:0;border:none}}@media (max-width: 600px){.modal-overlay{align-items:flex-end;padding:0}.modal-box,.modal-content{width:100%!important;max-width:100%!important;border-radius:20px 20px 0 0;max-height:90vh;overflow-y:auto}}.app-container{background-image:var(--bg-image, none);background-size:cover;background-position:center;background-attachment:fixed;min-height:100vh}.app-header{background:rgba(255,255,255,.11)!important;backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border:1px solid rgba(255,255,255,.26);box-shadow:0 8px 32px #00000038,inset 0 1.5px #ffffff7a}.sidebar{background:rgba(255,255,255,.1)!important;backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border:1px solid rgba(255,255,255,.22);box-shadow:4px 0 28px #0003,inset 1.5px 0 #ffffff61;padding:1rem .6rem}.menu-label{font-size:var(--menu-font-size, .72rem)!important;color:var(--menu-text-color, rgba(210,225,255,.82))}.menu-item{color:var(--menu-text-color, rgba(210,225,255,.85));transition:background .15s,color .15s}.menu-item:hover{background:rgba(255,255,255,.14)!important;color:#fffffff5!important}.menu-item.active{background:rgba(255,255,255,.2)!important;color:#fff!important;box-shadow:inset 0 1.5px #ffffff61}.content{background:transparent;padding:1.25rem 1rem}.sidebar nav{gap:4px}.menu-item{padding:.65rem .5rem;border-radius:12px}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.25rem;flex-wrap:wrap;gap:.75rem}.section-header h2,.section-header h3{margin:0;font-weight:700;color:#1e2a3b;letter-spacing:-.3px}.section-title{font-size:1.1rem;font-weight:700;color:#1e2a3b;margin:0 0 1rem;letter-spacing:-.3px}.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.55rem 1.1rem;border:none;border-radius:8px;cursor:pointer;font-size:.82rem;font-weight:600;font-family:Inter,Segoe UI,sans-serif;transition:background .15s,box-shadow .15s,transform .1s;white-space:nowrap;line-height:1}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--btn-bg, #5B6CF6);color:var(--btn-text, white)}.btn-primary:hover:not(:disabled){background:var(--btn-hover, #4556E0);box-shadow:0 3px 10px #5b6cf64d}.btn-success{background:var(--btn-success-bg, #22C55E);color:#fff}.btn-success:hover:not(:disabled){background:var(--btn-success-hover, #16A34A);box-shadow:0 3px 10px #22c55e4d}.btn-danger{background:var(--btn-danger-bg, #EF4444);color:#fff}.btn-danger:hover:not(:disabled){background:var(--btn-danger-hover, #DC2626);box-shadow:0 3px 10px #ef44444d}.btn-secondary{background:var(--btn-secondary-bg, #F4F6FB);color:var(--btn-secondary-text, #64748B);border:1.5px solid var(--border, #E8ECF4)}.btn-secondary:hover:not(:disabled){background:var(--border, #E8ECF4);color:var(--text-primary, #1E2A3B)}.btn-warning{background:var(--btn-warning-bg, #F59E0B);color:#fff}.btn-warning:hover:not(:disabled){background:var(--btn-warning-hover, #D97706)}.btn-outline{background:transparent;color:var(--btn-bg, #5B6CF6);border:1.5px solid var(--btn-bg, #5B6CF6)}.btn-outline:hover:not(:disabled){background:var(--primary-light, #EEF0FF)}.btn-sm{padding:.35rem .75rem;font-size:.75rem}.btn-lg{padding:.75rem 1.75rem;font-size:.95rem;border-radius:10px}.filter-box{background:#FAFBFF;border:1.5px solid #E8ECF4;border-radius:14px;padding:1rem 1.25rem;margin-bottom:1.25rem}.filter-box-title{font-size:.78rem;font-weight:700;color:#64748b;text-transform:uppercase;letter-spacing:.5px;margin-bottom:.75rem}.filter-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:.625rem}.filter-grid input,.filter-grid select{width:100%;padding:.55rem .75rem;border:1.5px solid #E8ECF4;border-radius:8px;font-size:.85rem;font-family:Inter,Segoe UI,sans-serif;color:#1e2a3b;background:#FAFBFD;outline:none;transition:border-color .15s,box-shadow .15s}.filter-grid input:focus,.filter-grid select:focus{border-color:#5b6cf6;box-shadow:0 0 0 3px #5b6cf61a;background:#FFFFFF}.filter-grid input::placeholder{color:#a0adbf}.date-lbl-wrap{display:inline-flex;flex-direction:column;gap:1px;width:100%}.date-lbl-wrap:before{content:attr(data-label);font-size:.62rem;color:#94a3b8;font-weight:500;line-height:1.2;padding-left:2px}.date-lbl-wrap input{width:100%}.filter-input,.filter-select{padding:.55rem .75rem;border:1.5px solid #E8ECF4;border-radius:8px;font-size:.85rem;font-family:Inter,Segoe UI,sans-serif;color:#1e2a3b;background:#FAFBFD;outline:none;transition:border-color .15s,box-shadow .15s;box-sizing:border-box}.filter-input:focus,.filter-select:focus{border-color:#5b6cf6;box-shadow:0 0 0 3px #5b6cf61a;background:#FFFFFF}.filter-input::placeholder{color:#a0adbf}.filter-summary{margin-top:.75rem;padding-top:.75rem;border-top:1px solid #E8ECF4;display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}.filter-tag{display:inline-flex;align-items:center;padding:.2rem .6rem;border-radius:20px;font-size:.75rem;font-weight:600;background:#F4F6FB;color:#64748b;border:1px solid #E8ECF4}.filter-tag.income{background:#DCFCE7;color:#15803d;border-color:#22c55e33}.filter-tag.expense{background:#FEE2E2;color:#991b1b;border-color:#ef444433}.stat-cards{display:flex;flex-direction:row;align-items:stretch;gap:.875rem;margin-bottom:1.25rem;flex-wrap:wrap}.stat-card{flex:1 1 0;min-width:140px;min-height:86px;background:var(--stat-bg, #FFFFFF);border:1.5px solid var(--stat-border, #E8ECF4);border-radius:14px;padding:1rem 1.25rem;display:flex;flex-direction:column;justify-content:center;gap:.25rem;box-sizing:border-box;box-shadow:0 2px 8px #5b6cf60f,0 1px 3px #1e2a3b0a}.stat-card-value,.stat-value{font-size:1.35rem;font-weight:800;color:var(--stat-value, #1E2A3B);letter-spacing:-.5px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stat-card-label,.stat-label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--stat-label, #64748B);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stat-card-sub{font-size:.72rem;color:var(--stat-sub, #A0ADBF)}.stat-card-period{font-size:.58rem;font-weight:600;color:var(--stat-period, #94A3B8);letter-spacing:.2px;margin-top:.2rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.month-picker-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.6rem}.month-picker-row span{font-size:.75rem;font-weight:700;color:#64748b;white-space:nowrap}.month-picker-row input[type=month]{font-size:.8rem;padding:.28rem .55rem;border:1.5px solid #e2e8f0;border-radius:8px;color:#374151;background:#f8fafc;cursor:pointer;outline:none;transition:border-color .15s}.month-picker-row input[type=month]:hover,.month-picker-row input[type=month]:focus{border-color:#667eea}.month-picker-row input[type=month]:disabled{background:#f1f5f9;border-color:#e2e8f0;pointer-events:none}.month-picker-hint{font-size:.7rem;color:#9ca3af;font-style:italic;white-space:nowrap}.stat-card.income{border-color:color-mix(in srgb,var(--stat-income-label,#22C55E) 20%,transparent);background:var(--stat-income-bg, #F0FDF4)}.stat-card.income .stat-card-value,.stat-card.income .stat-value{color:var(--stat-income-value, #15803D)}.stat-card.income .stat-card-label,.stat-card.income .stat-label{color:var(--stat-income-label, #22C55E)}.stat-card.expense{border-color:color-mix(in srgb,var(--stat-expense-label,#EF4444) 20%,transparent);background:var(--stat-expense-bg, #FFF5F5)}.stat-card.expense .stat-card-value,.stat-card.expense .stat-value{color:var(--stat-expense-value, #991B1B)}.stat-card.expense .stat-card-label,.stat-card.expense .stat-label{color:var(--stat-expense-label, #EF4444)}.stat-card.profit-pos{border-color:color-mix(in srgb,var(--stat-income-label,#22C55E) 20%,transparent);background:var(--stat-income-bg, #F0FDF4)}.stat-card.profit-pos .stat-card-value,.stat-card.profit-pos .stat-value{color:var(--stat-income-value, #15803D)}.stat-card.profit-neg{border-color:color-mix(in srgb,var(--stat-expense-label,#EF4444) 20%,transparent);background:var(--stat-expense-bg, #FFF5F5)}.stat-card.profit-neg .stat-card-value,.stat-card.profit-neg .stat-value{color:var(--stat-expense-value, #991B1B)}.stat-card.primary{border-color:color-mix(in srgb,var(--stat-primary-color,#5B6CF6) 20%,transparent);background:var(--stat-primary-bg, #EEF0FF)}.stat-card.primary .stat-card-value,.stat-card.primary .stat-value,.stat-card.primary .stat-card-label,.stat-card.primary .stat-label{color:var(--stat-primary-color, #5B6CF6)}.stat-card.warning{border-color:color-mix(in srgb,var(--stat-warning-label,#F59E0B) 20%,transparent);background:var(--stat-warning-bg, #FFFBEB)}.stat-card.warning .stat-card-value,.stat-card.warning .stat-value{color:var(--stat-warning-value, #92400E)}.stat-card.warning .stat-card-label,.stat-card.warning .stat-label{color:var(--stat-warning-label, #F59E0B)}body.theme-picking .stat-card{cursor:crosshair!important;position:relative;transition:outline .1s,box-shadow .1s}body.theme-picking .stat-card:after{content:"🎨";position:absolute;top:5px;right:6px;font-size:13px;pointer-events:none;opacity:.7}body.theme-picking .stat-card:hover{outline:2.5px dashed var(--pick-outline, #5B6CF6);outline-offset:3px;box-shadow:0 0 0 5px #5b6cf61a;z-index:1}.form-section{background:#F4F6FB;border:1.5px solid #E8ECF4;border-radius:14px;padding:1.25rem;margin-bottom:1.25rem}.form-section-title{font-size:.9rem;font-weight:700;color:#1e2a3b;margin-bottom:1rem}.form-field{display:flex;flex-direction:column;gap:.35rem}.form-field label{font-size:.78rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.4px}.field-input{padding:.6rem .875rem;border:1.5px solid #E8ECF4;border-radius:8px;font-size:.875rem;font-family:Inter,Segoe UI,sans-serif;color:#1e2a3b;background:#FFFFFF;outline:none;transition:border-color .15s,box-shadow .15s;width:100%}.field-input:focus{border-color:#5b6cf6;box-shadow:0 0 0 3px #5b6cf61a}.field-input::placeholder{color:#a0adbf}.data-table-wrap{background:#FFFFFF;border-radius:14px;border:1.5px solid #E8ECF4;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;margin-bottom:1.25rem}.data-table{width:100%;border-collapse:collapse;font-size:.875rem}.data-table th{background:#F4F6FB;color:#64748b;padding:.75rem 1rem;text-align:left;font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.4px;border-bottom:1.5px solid #E8ECF4;white-space:nowrap}.data-table td{padding:.8rem 1rem;border-bottom:1px solid #F4F6FB;color:#1e2a3b;vertical-align:middle}.data-table tr:last-child td{border-bottom:none}.data-table tr:hover td{background:#FAFBFD}.data-table.compact{font-size:.78rem}.data-table.compact th{padding:.5rem .55rem;font-size:.66rem;letter-spacing:.2px}.data-table.compact td{padding:.45rem .55rem}.badge-modern{display:inline-flex;align-items:center;padding:.22rem .65rem;border-radius:20px;font-size:.72rem;font-weight:700;line-height:1}.badge-modern.green{background:#DCFCE7;color:#15803d}.badge-modern.red{background:#FEE2E2;color:#991b1b}.badge-modern.yellow{background:#FEF3C7;color:#92400e}.badge-modern.blue{background:#DBEAFE;color:#1d4ed8}.badge-modern.purple{background:#EDE9FE;color:#6d28d9}.badge-modern.gray{background:#F4F6FB;color:#64748b}.chart-box{background:#FFFFFF;border:1.5px solid #E8ECF4;border-top:3px solid #5B6CF6;border-radius:14px;padding:1.25rem;margin-bottom:1.25rem}.chart-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.875rem;flex-wrap:wrap}.chart-title{font-weight:700;color:#1e2a3b;font-size:.9rem}.chart-nav-btn{background:#F4F6FB;border:1.5px solid #E8ECF4;border-radius:6px;padding:.2rem .6rem;cursor:pointer;color:#64748b;font-weight:700;font-size:.9rem;line-height:1;transition:all .15s}.chart-nav-btn:hover{background:#5B6CF6;color:#fff;border-color:#5b6cf6}.chart-period{font-weight:700;color:#1e2a3b;min-width:140px;text-align:center;font-size:.9rem}.chart-legend{margin-left:auto;display:flex;gap:1rem;align-items:center}.chart-legend-item{display:flex;align-items:center;gap:.35rem;font-size:.78rem;color:#64748b;font-weight:500}.chart-legend-dot{width:10px;height:10px;border-radius:2px;flex-shrink:0}.account-tabs{display:flex;gap:.35rem;flex-wrap:wrap;align-items:center;margin-bottom:1rem}.account-tab{padding:.35rem .875rem;border-radius:20px;border:1.5px solid #E8ECF4;cursor:pointer;font-weight:600;font-size:.8rem;background:#FFFFFF;color:#64748b;transition:all .15s;font-family:Inter,Segoe UI,sans-serif}.account-tab:hover{border-color:#5b6cf6;color:#5b6cf6}.account-tab.active{background:#5B6CF6;color:#fff;border-color:#5b6cf6}.account-tab-add{padding:.35rem .75rem;border-radius:20px;border:1.5px dashed #E8ECF4;cursor:pointer;font-weight:700;font-size:.85rem;background:transparent;color:#a0adbf;font-family:Inter,Segoe UI,sans-serif;transition:all .15s}.account-tab-add:hover{border-color:#5b6cf6;color:#5b6cf6}.info-banner{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:#EEF0FF;border:1.5px solid rgba(91,108,246,.2);border-radius:10px;margin-bottom:1rem;font-size:.85rem;color:#5b6cf6;font-weight:500}.info-banner.success{background:#F0FDF4;border-color:#22c55e33;color:#15803d}.info-banner.warning{background:#FFFBEB;border-color:#f59e0b33;color:#92400e}.info-banner.danger{background:#FFF5F5;border-color:#ef444433;color:#991b1b}.img-upload-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.25rem;background:#F4F6FB;border:1.5px dashed #C4CADC;border-radius:10px;cursor:pointer;font-size:.875rem;font-weight:600;color:#64748b;transition:all .15s;font-family:Inter,Segoe UI,sans-serif}.img-upload-btn:hover{border-color:#5b6cf6;color:#5b6cf6;background:#EEF0FF}.img-upload-btn.has-image{border-style:solid;border-color:#22c55e;color:#15803d;background:#F0FDF4}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:9000;padding:1rem;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-box{background:#FFFFFF;border-radius:16px;box-shadow:0 20px 60px #1e2a3b40;max-width:500px;width:100%;border:1px solid #E8ECF4;overflow:hidden}.modal-header{padding:1.25rem 1.5rem;border-bottom:1px solid #E8ECF4;font-weight:700;font-size:1rem;color:#1e2a3b;display:flex;justify-content:space-between;align-items:center}.modal-body{padding:1.25rem 1.5rem}.modal-footer{padding:1rem 1.5rem;border-top:1px solid #E8ECF4;display:flex;gap:.75rem;justify-content:flex-end}.modal-close{background:none;border:none;cursor:pointer;color:#a0adbf;font-size:1.2rem;padding:.1rem;line-height:1}.modal-close:hover{color:#1e2a3b}.load-more-wrap{text-align:center;padding:1rem 0 .25rem}.empty-state{text-align:center;padding:3rem 2rem;color:#a0adbf}.empty-state-icon{font-size:2.5rem;margin-bottom:.75rem}.empty-state-text{font-size:.9rem;font-weight:500}@media (max-width: 640px){.data-table-wrap{overflow-x:unset;overflow-y:visible;background:transparent;border:none;border-radius:0;padding:0}.data-table{display:block}.data-table thead{display:none}.data-table tbody{display:block}.data-table tr{display:block;background:#FFFFFF;border-radius:12px;border:1.5px solid #E8ECF4;margin-bottom:.75rem;overflow:hidden;box-shadow:0 1px 3px #0000000f}.data-table td{display:flex;align-items:center;padding:.45rem .85rem;border-bottom:1px solid #F4F6FB;font-size:.82rem;gap:.5rem;min-height:36px;flex-wrap:wrap}.data-table td[data-label]:before{content:attr(data-label) " ";font-weight:600;color:#64748b;font-size:.68rem;min-width:80px;flex-shrink:0;text-transform:uppercase;letter-spacing:.3px}.data-table td:last-child{border-bottom:none}.data-table tr[style*="background: rgb(238, 242, 255)"],.data-table tr[style*="background:#eef2ff"]{border-color:#a5b4fc}}.tab-scroll-bar{display:flex;gap:0;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;cursor:grab;-webkit-user-select:none;user-select:none;border-bottom:2px solid #E8ECF4;margin-bottom:1.25rem}.tab-scroll-bar::-webkit-scrollbar{display:none}.tab-scroll-bar:active{cursor:grabbing}.tab-scroll-bar>button{flex-shrink:0}.app-header{background:var(--glass-header, rgba(255,255,255,.22))!important;backdrop-filter:blur(var(--glass-blur, 20px)) saturate(180%)!important;-webkit-backdrop-filter:blur(var(--glass-blur, 20px)) saturate(180%)!important;border:1px solid rgba(255,255,255,.3)!important}.sidebar{background:var(--glass-sidebar, rgba(240,242,255,.2))!important;backdrop-filter:blur(var(--glass-blur, 16px)) saturate(160%)!important;-webkit-backdrop-filter:blur(var(--glass-blur, 16px)) saturate(160%)!important;border-right:1px solid rgba(255,255,255,.22)!important}.menu-item{color:var(--menu-text-color, rgba(210,225,255,.88))!important}.menu-item:hover{color:#fff!important;background:rgba(255,255,255,.14)!important}.menu-item.active{color:#fff!important;background:rgba(255,255,255,.22)!important;border-bottom-color:#fffc!important}.menu-item .menu-icon,.menu-item .menu-label{color:inherit!important}.app-header,.app-header h1{color:var(--header-text, rgba(240,248,255,.92))!important}.user-info span{color:var(--header-text, rgba(220,235,255,.85))!important}.data-table-wrap{background:var(--glass-card, rgba(255,255,255,.42))!important;backdrop-filter:blur(var(--glass-blur, 20px)) saturate(160%)!important;-webkit-backdrop-filter:blur(var(--glass-blur, 20px)) saturate(160%)!important;border:1px solid rgba(255,255,255,.55)!important;box-shadow:0 8px 32px #00000024,inset 0 1.5px #fffc!important}.filter-box{background:var(--glass-surface, rgba(255,255,255,.32))!important;backdrop-filter:blur(var(--glass-blur, 16px)) saturate(150%)!important;-webkit-backdrop-filter:blur(var(--glass-blur, 16px)) saturate(150%)!important;border:1px solid rgba(255,255,255,.45)!important;box-shadow:0 4px 16px #0000001a,inset 0 1px #ffffffb3!important}.form-section{background:var(--glass-surface, rgba(255,255,255,.35))!important;backdrop-filter:blur(var(--glass-blur, 16px)) saturate(150%)!important;-webkit-backdrop-filter:blur(var(--glass-blur, 16px)) saturate(150%)!important;border:1px solid rgba(255,255,255,.45)!important;box-shadow:0 4px 16px #0000001a,inset 0 1px #ffffffb3!important}.data-table th{background:rgba(255,255,255,.3)!important;border-bottom:1px solid rgba(255,255,255,.4)!important}.data-table tr:hover td{background:rgba(255,255,255,.2)!important}.data-table td{border-bottom:1px solid rgba(255,255,255,.2)!important}.stock-table{background:rgba(255,255,255,.42)!important;border:1px solid rgba(255,255,255,.5)!important}.stock-table th{background:rgba(255,255,255,.28)!important;border-bottom:1px solid rgba(255,255,255,.4)!important}.field-input,.filter-input,.filter-select,.filter-grid input,.filter-grid select{background:rgba(255,255,255,.55)!important;border:1.5px solid rgba(255,255,255,.55)!important}.field-input:focus,.filter-input:focus,.filter-select:focus,.filter-grid input:focus,.filter-grid select:focus{background:rgba(255,255,255,.75)!important;border-color:#5b6cf699!important;box-shadow:0 0 0 3px #5b6cf626!important}.stat-card{background:rgba(10,20,50,.38)!important;backdrop-filter:blur(24px) saturate(160%)!important;-webkit-backdrop-filter:blur(24px) saturate(160%)!important;border:1px solid rgba(255,255,255,.22)!important;box-shadow:0 4px 24px #00000038,inset 0 1.5px #ffffff47!important;border-radius:16px!important}.stat-card .stat-value,.stat-card .stat-card-value{color:var(--stat-value, rgba(255,255,255,.92))!important}.stat-card .stat-label,.stat-card .stat-card-label{color:var(--stat-label, rgba(180,210,255,.75))!important}.stat-card .stat-card-period,.stat-card .stat-period{color:var(--stat-sub, rgba(180,210,255,.55))!important}.stat-card.income,.stat-card.profit-pos{background:rgba(5,60,35,.42)!important;border-color:#4ade8052!important}.stat-card.income .stat-value,.stat-card.income .stat-card-value,.stat-card.profit-pos .stat-value,.stat-card.profit-pos .stat-card-value{color:var(--stat-income-value, #4ade80)!important}.stat-card.income .stat-label,.stat-card.income .stat-card-label,.stat-card.profit-pos .stat-label,.stat-card.profit-pos .stat-card-label{color:var(--stat-income-label, rgba(134,239,172,.82))!important}.stat-card.expense,.stat-card.profit-neg{background:rgba(60,5,5,.42)!important;border-color:#f8717152!important}.stat-card.expense .stat-value,.stat-card.expense .stat-card-value,.stat-card.profit-neg .stat-value,.stat-card.profit-neg .stat-card-value{color:var(--stat-expense-value, #f87171)!important}.stat-card.expense .stat-label,.stat-card.expense .stat-card-label,.stat-card.profit-neg .stat-label,.stat-card.profit-neg .stat-card-label{color:var(--stat-expense-label, rgba(252,165,165,.82))!important}.stat-card.warning{background:rgba(60,35,0,.42)!important;border-color:#fbbf2452!important}.stat-card.warning .stat-value,.stat-card.warning .stat-card-value{color:var(--stat-warning-value, #fbbf24)!important}.stat-card.warning .stat-label,.stat-card.warning .stat-card-label{color:var(--stat-warning-label, rgba(253,230,138,.82))!important}.stat-card.primary{background:rgba(20,15,80,.42)!important;border-color:#818cf85c!important}.stat-card.primary .stat-value,.stat-card.primary .stat-card-value{color:var(--stat-primary-color, #818cf8)!important}.stat-card.primary .stat-label,.stat-card.primary .stat-card-label{color:var(--stat-primary-color, rgba(165,180,252,.82))!important}.theme-btns>button{color:#dce8ffe6!important;border-color:#ffffff47!important}.theme-btns>button:hover{background:rgba(255,255,255,.14)!important;color:#fff!important}.app-header>.user-info>button,.app-header>button{color:#dce8ffe6!important}.app-header>.user-info>button:hover,.app-header>button:hover{background:rgba(255,255,255,.14)!important;color:#fff!important}.ts-panel{color:#1e2a3b}.ts-panel span{color:inherit!important}.ts-panel button,.ts-panel div,.ts-panel label,.ts-panel p,.ts-panel a,.ts-panel input[type=range]{color:inherit}main.content td{color:var(--text-primary, #1E2A3B)!important}main.content th{color:var(--text-secondary, #64748B)!important}main.content h2,main.content h3,main.content h4,main.content h5{color:var(--text-primary, #1E2A3B)!important}main.content p{color:var(--text-primary, #1E2A3B)!important}main.content label{color:var(--text-secondary, #64748B)!important}main.content span:not([class*=badge]):not([class*=btn]):not([class*=icon]):not([class*=emoji]),main.content strong,main.content b,main.content small,main.content em,main.content li{color:var(--text-primary, #1E2A3B)!important}main.content .badge-modern.green{color:#15803d!important}main.content .badge-modern.red{color:#991b1b!important}main.content .badge-modern.yellow{color:#92400e!important}main.content .badge-modern.blue{color:#1d4ed8!important}main.content .badge-modern.purple{color:#6d28d9!important}main.content .badge-modern.gray{color:#64748b!important}main.content .stat-card .stat-value,main.content .stat-card .stat-card-value{color:var(--stat-value, rgba(255,255,255,.92))!important}main.content .stat-card .stat-label,main.content .stat-card .stat-card-label{color:var(--stat-label, rgba(180,210,255,.75))!important}main.content .stat-card .stat-card-sub,main.content .stat-card .stat-sub{color:var(--stat-sub, rgba(180,210,255,.55))!important}main.content .stat-card.income .stat-card-value,main.content .stat-card.income .stat-value{color:var(--stat-income-value, #4ade80)!important}main.content .stat-card.expense .stat-card-value,main.content .stat-card.expense .stat-value{color:var(--stat-expense-value, #f87171)!important}main.content .btn-primary{color:var(--btn-text, #FFFFFF)!important}main.content .btn-success{color:#fff!important}main.content .btn-danger{color:#fff!important}main.content .btn-secondary{color:var(--text-secondary, #64748B)!important}main.content input,main.content select,main.content textarea{color:var(--input-text, #1E2A3B)!important}.section-header h2,.section-header h3,.section-title,.page-title,.content>h2,.content>h3{color:#fffffff2!important;text-shadow:0 1px 6px rgba(0,0,0,.35)}.data-table-wrap .section-header h2,.data-table-wrap .section-header h3,.data-table-wrap .section-title,.filter-box .section-header h2,.form-section .section-header h2,.form-section .section-title{color:#1e2a3b!important;text-shadow:none!important}.btn-secondary:not(.in-glass){background:rgba(255,255,255,.18)!important;color:#dce8ffeb!important;border-color:#ffffff59!important}.btn-secondary:not(.in-glass):hover{background:rgba(255,255,255,.28)!important;color:#fff!important}.data-table-wrap .btn-secondary,.filter-box .btn-secondary,.form-section .btn-secondary{background:#f4f6fb!important;color:#64748b!important;border-color:#e8ecf4!important}.data-table-wrap .btn-secondary:hover,.filter-box .btn-secondary:hover,.form-section .btn-secondary:hover{background:#e8ecf4!important;color:#1e2a3b!important}.mobile-app{background-image:var(--bg-image, none),var(--bg-gradient, radial-gradient(ellipse 65% 55% at 10% 18%, rgba(130,175,255,.4) 0%, transparent 100%), radial-gradient(ellipse 55% 65% at 90% 12%, rgba(140,100,255,.3) 0%, transparent 100%), radial-gradient(ellipse 60% 55% at 70% 88%, rgba(80,130,240,.35) 0%, transparent 100%), radial-gradient(ellipse 40% 45% at 30% 82%, rgba(60,160,220,.25) 0%, transparent 100%), linear-gradient(155deg, #2d4575 0%, #334d8a 45%, #263c70 100%) )!important;background-size:cover!important;background-repeat:no-repeat!important;background-attachment:scroll!important;background-color:#2d4575!important;min-height:100vh!important}.mobile-header{background:var(--glass-header, rgba(255,255,255,.22))!important;backdrop-filter:blur(var(--glass-blur, 20px)) saturate(180%)!important;-webkit-backdrop-filter:blur(var(--glass-blur, 20px)) saturate(180%)!important;border-bottom:1px solid rgba(255,255,255,.3)!important;box-shadow:0 1px 12px #00000024!important;color:#f0f8ffeb!important}.mobile-header h1{color:#f0f8fff2!important;text-shadow:0 1px 4px rgba(0,0,0,.25)!important}.mobile-logout-btn{background:rgba(255,255,255,.2)!important;color:#f0f8ffeb!important;border:1px solid rgba(255,255,255,.35)!important}.mobile-logout-btn:active{background:rgba(255,255,255,.36)!important;color:#fff!important}.mobile-nav{background:var(--glass-header, rgba(255,255,255,.22))!important;backdrop-filter:blur(var(--glass-blur, 20px)) saturate(180%)!important;-webkit-backdrop-filter:blur(var(--glass-blur, 20px)) saturate(180%)!important;border-top:1px solid rgba(255,255,255,.28)!important;box-shadow:0 -2px 16px #00000026!important}.nav-btn{color:var(--menu-text-color, rgba(200,220,255,.75))!important}.nav-btn.active{color:#fff!important}.nav-label{color:inherit!important}.mobile-card{background:var(--glass-card, rgba(255,255,255,.42))!important;backdrop-filter:blur(var(--glass-blur, 20px)) saturate(160%)!important;-webkit-backdrop-filter:blur(var(--glass-blur, 20px)) saturate(160%)!important;border:1px solid rgba(255,255,255,.55)!important;box-shadow:0 4px 24px #0000001f,inset 0 1.5px #fffc!important}.time-tracking-overlay,.time-tracking-modal,.mobile-modal{background:var(--glass-card, rgba(255,255,255,.55))!important;backdrop-filter:blur(28px) saturate(180%)!important;-webkit-backdrop-filter:blur(28px) saturate(180%)!important;border:1px solid rgba(255,255,255,.65)!important;box-shadow:0 8px 40px #00000038,inset 0 1.5px #ffffffe6!important}.card,.content-card{background:rgba(255,255,255,.48)!important;backdrop-filter:blur(20px) saturate(180%)!important;-webkit-backdrop-filter:blur(20px) saturate(180%)!important;border:1px solid rgba(255,255,255,.6)!important;box-shadow:0 8px 32px #0000002e,inset 0 1.5px #ffffffd9!important;border-radius:16px!important}*{box-sizing:border-box;margin:0;padding:0}.login-container{min-height:100vh;display:flex;justify-content:center;align-items:center;background:radial-gradient(ellipse 65% 55% at 10% 18%,rgba(100,150,255,.45) 0%,transparent 100%),radial-gradient(ellipse 55% 65% at 90% 12%,rgba(120,80,240,.35) 0%,transparent 100%),radial-gradient(ellipse 60% 55% at 70% 88%,rgba(60,100,220,.4) 0%,transparent 100%),radial-gradient(ellipse 40% 45% at 30% 82%,rgba(40,130,200,.28) 0%,transparent 100%),linear-gradient(155deg,#1e2d4a 0%,#253352 45%,#1a2844 100%);background-attachment:fixed;position:relative;overflow:hidden}.login-container:before{content:"";position:absolute;width:640px;height:640px;background:radial-gradient(circle,rgba(100,140,255,.12) 0%,transparent 65%);top:-180px;right:-120px;border-radius:50%;pointer-events:none}.login-container:after{content:"";position:absolute;width:500px;height:500px;background:radial-gradient(circle,rgba(80,60,200,.12) 0%,transparent 65%);bottom:-120px;left:-120px;border-radius:50%;pointer-events:none}.login-box{background:rgba(255,255,255,.13);backdrop-filter:blur(36px) saturate(180%);-webkit-backdrop-filter:blur(36px) saturate(180%);padding:2.75rem 2.5rem;border-radius:28px;width:100%;max-width:400px;position:relative;z-index:1;border:1px solid rgba(255,255,255,.32);box-shadow:0 48px 90px #00000073,0 12px 28px #00000047,inset 0 2px #ffffff8c,inset 1px 0 #ffffff40,inset -1px 0 #ffffff1a}.login-box h1{text-align:center;color:#fffffff2;margin-bottom:.5rem;font-size:1.6rem;font-weight:800;letter-spacing:-.5px;text-shadow:0 1px 12px rgba(0,0,0,.3)}.login-box .login-subtitle{text-align:center;color:#c8dcffb8;font-size:.875rem;margin-bottom:1.75rem}.form-group{margin-bottom:1.1rem}.form-group label{display:block;margin-bottom:.4rem;color:#c8dcffbf;font-weight:600;font-size:.8rem;text-transform:uppercase;letter-spacing:.5px}.form-group input{width:100%;padding:.75rem 1rem;border:1px solid rgba(255,255,255,.22);border-radius:14px;font-size:.9rem;font-family:inherit;color:#ffffffeb;background:rgba(255,255,255,.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:inset 0 1px #ffffff2e,0 2px 8px #0000002e;transition:border-color .15s,box-shadow .15s,background .15s;outline:none}.form-group input:focus{border-color:#ffffff73;box-shadow:inset 0 1px #ffffff40,0 0 0 3px #96aaff33;background:rgba(255,255,255,.16)}.form-group input::placeholder{color:#b4c8ff73}.remember-me{display:flex;align-items:center;gap:.5rem;margin-bottom:1.25rem}.remember-me input[type=checkbox]{width:16px;height:16px;cursor:pointer;accent-color:rgba(160,180,255,.9)}.remember-me label{margin:0;cursor:pointer;color:#c8dcffad;font-size:.85rem;font-weight:500}.error-message{background:rgba(239,68,68,.18);color:#ffb4b4f2;padding:.7rem 1rem;border-radius:10px;margin-bottom:1rem;text-align:center;font-size:.85rem;font-weight:500;border:1px solid rgba(255,100,100,.25);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.login-btn{width:100%;padding:.85rem;background:rgba(255,255,255,.18);color:#fffffff5;border:1px solid rgba(255,255,255,.35);border-radius:14px;font-size:.95rem;font-weight:700;cursor:pointer;font-family:inherit;transition:background .15s,box-shadow .15s,transform .1s;letter-spacing:.2px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:inset 0 1.5px #ffffff73,0 4px 20px #00000040}.login-btn:hover:not(:disabled){background:rgba(255,255,255,.26);box-shadow:inset 0 1.5px #ffffff8c,0 8px 28px #0000004d;transform:translateY(-1px)}.login-btn:active:not(:disabled){transform:translateY(0)}.login-btn:disabled{opacity:.55;cursor:not-allowed}:root{--primary: #5B6CF6;--primary-light: #EEF0FF;--primary-dark: #4556E0;--bg: #F4F6FB;--surface: #FFFFFF;--border: #E8ECF4;--text-primary: #1E2A3B;--text-secondary: #64748B;--text-muted: #A0ADBF}*{box-sizing:border-box}body{font-family:Inter,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased}.mobile-app{display:flex;flex-direction:column;min-height:100vh;background:transparent}.mobile-header{background:var(--surface);color:var(--text-primary);padding:0 1rem;height:56px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 1px 3px #1e2a3b0f;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:50}.mobile-header h1{margin:0;font-size:1rem;font-weight:700;color:var(--primary);letter-spacing:-.3px}.mobile-logout-btn{background:var(--primary-light);border:none;color:var(--primary);padding:.4rem .875rem;border-radius:8px;cursor:pointer;font-weight:600;font-size:.8rem;font-family:inherit;transition:background .15s}.mobile-logout-btn:active{background:var(--primary);color:#fff}.mobile-content{flex:1;padding:1rem;overflow-y:auto;padding-bottom:96px}.mobile-section{margin-bottom:1rem}.mobile-section h2{margin:0 0 .875rem;color:var(--text-primary);font-size:1.15rem;font-weight:700;letter-spacing:-.3px}.mobile-card{background:var(--surface);border-radius:14px;padding:1rem;box-shadow:0 2px 8px #1e2a3b0f;margin-bottom:.75rem;border:1px solid var(--border)}.mobile-card p{margin:.4rem 0;font-size:.875rem;color:var(--text-primary)}.mobile-card p strong{color:var(--primary);display:inline-block;min-width:100px;font-weight:600}.mobile-image-preview{margin-top:.5rem;text-align:center}.mobile-image-preview img{max-width:100%;max-height:200px;border-radius:10px;cursor:pointer;box-shadow:0 2px 8px #0000001a}.mobile-nav{position:fixed;bottom:0;left:0;right:0;background:var(--surface);display:flex;justify-content:space-around;gap:.15rem;padding:.5rem .25rem;box-shadow:0 -1px 0 var(--border),0 -4px 20px #1e2a3b14;z-index:100}.nav-btn{background:transparent;border:none;border-radius:12px;padding:.5rem .35rem;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:.25rem;color:var(--text-muted);transition:all .15s ease;min-width:48px;position:relative}.nav-btn:active{transform:scale(.93)}.nav-btn.active{color:var(--primary)}.nav-btn.active:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:32px;height:3px;background:var(--primary);border-radius:0 0 4px 4px}.nav-icon{width:22px;height:22px;display:flex;align-items:center;justify-content:center;transition:transform .15s;line-height:1;flex-shrink:0}.nav-btn.active .nav-icon{transform:scale(1.1)}.nav-label{font-size:.62rem;font-weight:600;text-align:center;line-height:1.2;font-family:Inter,sans-serif}.mobile-table{width:100%;border-collapse:collapse;font-size:.82rem}.mobile-table th{background:var(--bg);padding:.65rem .5rem;text-align:left;font-weight:600;color:var(--text-secondary);border-bottom:1px solid var(--border);font-size:.75rem;text-transform:uppercase;letter-spacing:.3px}.mobile-table td{padding:.65rem .5rem;border-bottom:1px solid var(--border);color:var(--text-primary)}.mobile-table tr:last-child td{border-bottom:none}.mobile-status-badge{display:inline-flex;align-items:center;padding:.2rem .6rem;border-radius:20px;font-size:.72rem;font-weight:600;line-height:1}.mobile-status-badge.waiting,.mobile-status-badge.รอดำเนินการ{background:#FEF3C7;color:#92400e}.mobile-status-badge.paid,.mobile-status-badge.จ่ายแล้ว,.mobile-status-badge.สำเร็จ{background:#DCFCE7;color:#15803d}.mobile-status-badge.กำลังดำเนินการ{background:#DBEAFE;color:#1d4ed8}.mobile-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 2rem}.spinner{border:3px solid rgba(91,108,246,.15);border-top:3px solid var(--primary);border-radius:50%;width:36px;height:36px;animation:spin .8s linear infinite;margin-bottom:.75rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.mobile-image-preview img{width:80px;height:80px;object-fit:cover;border-radius:10px;cursor:pointer;border:1.5px solid var(--border)}.mobile-image-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.88);display:flex;align-items:center;justify-content:center;z-index:9999;padding:1rem;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.mobile-image-modal img{max-width:90%;max-height:90vh;border-radius:12px;box-shadow:0 20px 60px #00000080}.mobile-close-btn{position:absolute;top:1rem;right:1rem;background:rgba(255,255,255,.15);color:#fff;border:none;border-radius:50%;width:40px;height:40px;font-size:1.3rem;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:background .15s}.mobile-close-btn:hover{background:rgba(255,255,255,.25)}.chat-container{display:flex;flex-direction:column;height:500px;background:var(--surface);border-radius:14px;overflow:hidden;border:1px solid var(--border)}.chat-messages{flex:1;padding:1rem;overflow-y:auto;display:flex;flex-direction:column;gap:.75rem;scroll-behavior:smooth}.chat-messages::-webkit-scrollbar{width:3px}.chat-messages::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.message{display:flex;margin-bottom:.25rem}.message.sender{justify-content:flex-end}.message.receiver{justify-content:flex-start}.message-content{max-width:72%;padding:.65rem .9rem;border-radius:14px;word-wrap:break-word;font-size:.875rem;line-height:1.45}.message.sender .message-content{background:var(--primary);color:#fff;border-bottom-right-radius:4px}.message.receiver .message-content{background:var(--bg);color:var(--text-primary);border-bottom-left-radius:4px}.message-content p{margin:0 0 .25rem;font-size:.875rem}.message-time{font-size:.68rem;opacity:.65;display:block;margin-top:.25rem}.chat-input{display:flex;gap:.5rem;padding:.75rem;background:var(--bg);border-top:1px solid var(--border)}.chat-input input{flex:1;padding:.65rem 1rem;border:1.5px solid var(--border);border-radius:22px;font-size:.875rem;font-family:inherit;background:var(--surface);outline:none;transition:border-color .15s}.chat-input input:focus{border-color:var(--primary)}.chat-input button{padding:.65rem 1.25rem;background:var(--primary);color:#fff;border:none;border-radius:22px;font-weight:600;cursor:pointer;font-size:.875rem;font-family:inherit;transition:background .15s}.chat-input button:active{background:var(--primary-dark)}@keyframes slideInDown{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slideOutUp{0%{transform:translateY(0);opacity:1}to{transform:translateY(-100%);opacity:0}}.mobile-notification-popup{position:fixed;top:1rem;left:1rem;right:1rem;z-index:99999;background:var(--surface);border-radius:14px;box-shadow:0 8px 32px #1e2a3b2e;padding:.875rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:.75rem;animation:slideInDown .25s ease-out;border:1px solid var(--border)}.mobile-notification-popup.closing{animation:slideOutUp .25s ease-out}.mobile-notification-popup.success{border-left:4px solid #22C55E;background:#F0FDF4}.mobile-notification-popup.error{border-left:4px solid #EF4444;background:#FFF5F5}.mobile-notification-popup.info{border-left:4px solid #3B82F6;background:#EFF6FF}.mobile-notification-popup.warning{border-left:4px solid #F59E0B;background:#FFFBEB}.mobile-notification-content{display:flex;align-items:center;gap:.75rem;flex:1}.mobile-notification-icon{font-size:1.3rem;flex-shrink:0}.mobile-notification-message{font-size:.875rem;font-weight:500;color:var(--text-primary);line-height:1.4}.mobile-notification-close{background:rgba(0,0,0,.06);border:none;border-radius:50%;width:26px;height:26px;font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s;flex-shrink:0;color:var(--text-secondary)}.mobile-notification-close:hover{background:rgba(0,0,0,.12)}:root{--tc-primary: #5B6CF6;--tc-primary-light: #EEF0FF;--tc-success: #22C55E;--tc-success-light: #DCFCE7;--tc-danger: #EF4444;--tc-danger-light: #FEE2E2;--tc-warning: #F59E0B;--tc-warning-light: #FEF3C7;--tc-info: #3B82F6;--tc-info-light: #DBEAFE;--tc-bg: #F4F6FB;--tc-surface: #FFFFFF;--tc-border: #E8ECF4;--tc-text: #1E2A3B;--tc-text-2: #64748B;--tc-text-3: #A0ADBF}.time-tracking-container{max-width:820px;margin:0 auto;padding:1.25rem;font-family:Inter,Segoe UI,sans-serif}.time-tracking-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1.25rem}.back-btn{padding:.5rem 1rem;background:var(--tc-bg);color:var(--tc-text-2);border:1.5px solid var(--tc-border);border-radius:8px;cursor:pointer;font-size:.875rem;font-weight:500;font-family:inherit;transition:all .15s}.back-btn:hover{background:var(--tc-border);color:var(--tc-text)}.current-time{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.25rem;padding:1.25rem 1.5rem;background:var(--tc-surface);border-radius:16px;border:1.5px solid var(--tc-border);box-shadow:0 2px 8px #1e2a3b0f;gap:1rem}.user-info-inline{display:flex;align-items:flex-start;justify-content:flex-start;flex:1}.user-details-inline{text-align:left}.user-name{font-size:1rem;font-weight:700;color:var(--tc-text);margin-bottom:.15rem}.user-full-name-inline{font-size:.8rem;color:var(--tc-text-2);margin-bottom:.35rem}.user-position-badge-inline{display:inline-block;padding:.2rem .65rem;background:var(--tc-primary-light);color:var(--tc-primary);border-radius:20px;font-size:.72rem;font-weight:600}.time-date-section{text-align:right;flex:1}.time-display{font-size:2rem;font-weight:800;color:var(--tc-primary);margin-bottom:.2rem;letter-spacing:-1px;font-feature-settings:"tnum"}.date-display{font-size:.82rem;color:var(--tc-text-2)}.error-message{background:var(--tc-danger-light);color:#991b1b;padding:.875rem 1rem;border-radius:10px;margin-bottom:1rem;text-align:center;font-size:.875rem;font-weight:500;border:1px solid rgba(239,68,68,.2)}.location-info{background:var(--tc-surface);padding:1.25rem;border-radius:14px;margin-bottom:1rem;border:1.5px solid var(--tc-border);box-shadow:0 1px 4px #1e2a3b0d}.location-info h3{margin-top:0;color:var(--tc-text);font-size:1rem;font-weight:700;margin-bottom:1rem}.location-status{margin:.875rem 0}.status-badge{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 1.1rem;border-radius:25px;font-weight:700;font-size:.875rem;margin-bottom:.875rem}.status-inside{background:var(--tc-success-light);color:#15803d;border:1.5px solid rgba(34,197,94,.3)}.status-outside{background:var(--tc-danger-light);color:#991b1b;border:1.5px solid rgba(239,68,68,.3)}.distance-text{font-size:.875rem;color:var(--tc-text);margin:.5rem 0;font-weight:500}.area-text{font-size:.82rem;color:var(--tc-text-2);margin:.3rem 0}.coordinates{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--tc-border)}.coordinates small{color:var(--tc-text-3);font-size:.78rem}.inside-area{color:#15803d;font-weight:700}.outside-area{color:#991b1b;font-weight:700}.map-container{background:var(--tc-surface);padding:1.25rem;border-radius:14px;margin-bottom:1rem;border:1.5px solid var(--tc-border);box-shadow:0 1px 4px #1e2a3b0d;overflow:hidden}.map-container h3{margin-top:0;color:var(--tc-text);font-size:1rem;font-weight:700;margin-bottom:1rem}.map-container iframe{width:100%;border-radius:10px}.clock-btn{width:100%;padding:1.25rem;font-size:1.2rem;font-weight:700;border:none;border-radius:14px;cursor:pointer;transition:transform .1s,box-shadow .15s;margin-bottom:.875rem;font-family:Inter,sans-serif;letter-spacing:.3px}.clock-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #00000026}.clock-btn:active:not(:disabled){transform:translateY(0)}.clock-btn:disabled{opacity:.55;cursor:not-allowed}.clock-in-btn{background:#22C55E;color:#fff;box-shadow:0 4px 12px #22c55e40}.clock-in-btn:hover:not(:disabled){background:#16A34A}.clock-out-btn{background:#EF4444;color:#fff;box-shadow:0 4px 12px #ef444440}.clock-out-btn:hover:not(:disabled){background:#DC2626}.active-session-info{background:var(--tc-success-light);border:1.5px solid rgba(34,197,94,.3);padding:1rem 1.25rem;border-radius:12px;margin-bottom:1rem;text-align:center}.work-hours-live{font-weight:700;color:#15803d;margin-top:.4rem;font-size:1rem}.note-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.note-modal-content{background:var(--tc-surface);padding:1.75rem;border-radius:16px;max-width:500px;width:100%;box-shadow:0 20px 60px #1e2a3b33;border:1px solid var(--tc-border)}.note-modal-content h3{margin:0 0 1rem;color:var(--tc-primary);font-size:1.1rem;font-weight:700}.warning{color:#dc2626;font-weight:600;margin:.5rem 0;font-size:.875rem}.ot-input-group{margin-bottom:1rem}.ot-label{display:block;font-weight:600;margin-bottom:.4rem;color:var(--tc-text-2);font-size:.8rem;text-transform:uppercase;letter-spacing:.4px}.ot-input{width:100%;padding:.65rem .875rem;border:1.5px solid var(--tc-border);border-radius:10px;font-size:.9rem;font-family:inherit;background:var(--tc-surface);color:var(--tc-text);outline:none;transition:border-color .15s,box-shadow .15s}.ot-input:focus{border-color:var(--tc-primary);box-shadow:0 0 0 3px #5b6cf61a}.note-textarea{width:100%;padding:.65rem .875rem;border:1.5px solid var(--tc-border);border-radius:10px;font-size:.9rem;font-family:inherit;resize:vertical;margin-bottom:1rem;background:var(--tc-surface);color:var(--tc-text);outline:none;transition:border-color .15s,box-shadow .15s}.note-textarea:focus{border-color:var(--tc-primary);box-shadow:0 0 0 3px #5b6cf61a}.note-modal-actions{display:flex;gap:.75rem;justify-content:flex-end}.cancel-btn{padding:.6rem 1.25rem;background:var(--tc-bg);color:var(--tc-text-2);border:1.5px solid var(--tc-border);border-radius:8px;cursor:pointer;font-size:.875rem;font-family:inherit;font-weight:500;transition:all .15s}.cancel-btn:hover{background:var(--tc-border)}.submit-btn{padding:.6rem 1.5rem;background:var(--tc-primary);color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:.875rem;font-family:inherit;font-weight:600;transition:background .15s}.submit-btn:hover:not(:disabled){background:#4556E0}.submit-btn:disabled{opacity:.5;cursor:not-allowed}.success-card-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;z-index:1001;animation:fadeIn .25s ease-out;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.success-card-new{background:var(--tc-surface);border-radius:20px;box-shadow:0 20px 60px #1e2a3b40;max-width:500px;width:90%;max-height:90vh;overflow-y:auto;animation:slideUp .3s ease-out;border:2px solid var(--tc-success)}.success-card-new.clock-out-card{border-color:var(--tc-danger)}@keyframes slideUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.success-icon{background:var(--tc-success-light);padding:2rem 1rem 1rem;border-radius:18px 18px 0 0;display:flex;justify-content:center}.success-icon.clock-out-success{background:var(--tc-danger-light)}.checkmark-circle{width:60px;height:60px}.checkmark{width:60px;height:60px;border-radius:50%;display:block;stroke-width:3;stroke:var(--tc-success);stroke-miterlimit:10;animation:fillCheckmark .4s ease-in-out .4s forwards,scaleCheckmark .3s ease-in-out .9s both}.checkmark.clock-out-checkmark{stroke:var(--tc-danger);animation:fillCheckmarkRed .4s ease-in-out .4s forwards,scaleCheckmark .3s ease-in-out .9s both}.checkmark-circle-path{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:3;stroke-miterlimit:10;stroke:var(--tc-success);fill:#fff;animation:strokeCheckmark .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark-circle-path.clock-out-path{stroke:var(--tc-danger)}.checkmark-check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:strokeCheck .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes strokeCheckmark{to{stroke-dashoffset:0}}@keyframes strokeCheck{to{stroke-dashoffset:0}}@keyframes fillCheckmark{to{box-shadow:inset 0 0 0 30px var(--tc-success)}}@keyframes fillCheckmarkRed{to{box-shadow:inset 0 0 0 30px var(--tc-danger)}}@keyframes scaleCheckmark{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}.success-title{margin:.875rem 1rem .25rem;font-size:1rem;font-weight:700;color:#15803d;text-align:center}.success-title.clock-out-title{color:#dc2626}.success-subtitle{margin:0 1rem .5rem;font-size:.78rem;color:var(--tc-text-2);text-align:center}.screenshot-warning{margin:.4rem 1rem .75rem;padding:.5rem .75rem;background:var(--tc-danger-light);border:1.5px solid rgba(239,68,68,.3);border-radius:8px;color:#dc2626;font-size:.75rem;font-weight:600;text-align:center}.success-details{padding:0 .875rem .875rem;background:var(--tc-bg)}.success-detail-item{display:flex;align-items:flex-start;gap:.4rem;padding:.35rem 0;border-bottom:1px solid var(--tc-border)}.success-detail-item:last-of-type{border-bottom:none}.detail-icon{font-size:.85rem;color:var(--tc-success);flex-shrink:0}.detail-text{font-size:.72rem;color:var(--tc-text);line-height:1.3}.success-warning-item{display:flex;align-items:flex-start;gap:.4rem;padding:.4rem .5rem;background:var(--tc-warning-light);border-left:3px solid var(--tc-warning);border-radius:6px;margin-bottom:.4rem}.success-warning-item .warning-text{flex:1;font-size:.72rem;line-height:1.3}.success-warning-item .warning-text>div{margin-bottom:.2rem}.success-warning-item .warning-text>div:last-child{margin-bottom:0}.success-warning-item .warning-icon{font-size:.85rem;flex-shrink:0}.success-map-container{margin-top:.5rem;padding:.5rem;background:var(--tc-surface);border-radius:8px;border:1px solid var(--tc-border)}.close-success-new{display:block;width:calc(100% - 2rem);margin:1rem;padding:.7rem 1.5rem;background:var(--tc-primary);color:#fff;border:none;border-radius:10px;font-size:.9rem;font-weight:700;cursor:pointer;font-family:Inter,sans-serif;transition:background .15s,box-shadow .15s}.close-success-new:hover{background:#4556E0;box-shadow:0 4px 12px #5b6cf64d}.close-success-new.clock-out-close{background:var(--tc-danger)}.close-success-new.clock-out-close:hover{background:#DC2626;box-shadow:0 4px 12px #ef44444d}.success-message{margin:0;white-space:pre-wrap;font-family:inherit;font-size:.95rem;line-height:1.6;color:var(--tc-text)}.records-section{margin-top:1.5rem;background:var(--tc-surface);border-radius:16px;padding:1.25rem;border:1.5px solid var(--tc-border);box-shadow:0 2px 8px #1e2a3b0f}.records-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.25rem;padding-bottom:.875rem;border-bottom:1.5px solid var(--tc-border)}.records-header h3{margin:0;color:var(--tc-text);font-size:1.05rem;font-weight:700}.records-count{background:var(--tc-info-light);color:#1d4ed8;padding:.3rem .875rem;border-radius:20px;font-size:.8rem;font-weight:700}.no-records{text-align:center;color:var(--tc-text-3);padding:3rem;font-size:.9rem}.records-table-container{overflow-x:auto;margin:0 -1.25rem;padding:0 1.25rem}.records-table{width:100%;border-collapse:separate;border-spacing:0;font-size:.875rem;table-layout:auto;min-width:1100px}.records-table thead{background:var(--tc-bg)}.records-table th{padding:.75rem .875rem;text-align:left;font-weight:600;white-space:nowrap;font-size:.78rem;color:#64748b;text-transform:uppercase;letter-spacing:.4px;border-bottom:1.5px solid var(--tc-border)}.records-table th:first-child{padding-left:1.25rem}.records-table th:last-child{padding-right:1.25rem}.records-table tbody tr{background:var(--tc-surface);transition:background .1s;border-bottom:1px solid var(--tc-border)}.records-table tbody tr:hover{background:var(--tc-bg)}.records-table tbody tr.in-progress{background:linear-gradient(90deg,#F0FDF4 0%,var(--tc-surface) 100%)}.records-table tbody tr:last-child{border-bottom:none}.records-table td{padding:.875rem;vertical-align:middle;white-space:nowrap;color:var(--tc-text)}.records-table td:first-child{padding-left:1.25rem}.records-table td:last-child{padding-right:1.25rem}.date-cell{min-width:150px}.date-cell .date-text{font-weight:600;color:var(--tc-text);font-size:.875rem}.time-cell{font-weight:500;color:var(--tc-text-2);min-width:80px}.time-with-badge{display:flex;align-items:center;gap:.5rem}.hours-cell{font-weight:700;color:#1d4ed8;min-width:100px}.hours-text{background:var(--tc-info-light);padding:.25rem .75rem;border-radius:12px;display:inline-block;white-space:nowrap;color:#1d4ed8;font-size:.85rem}.ot-cell{text-align:center;min-width:80px}.ot-badge{background:var(--tc-warning-light);color:#92400e;padding:.25rem .75rem;border-radius:12px;display:inline-block;font-weight:600;font-size:.82rem}.note-cell{min-width:150px;max-width:280px}.note-text{display:block;font-size:.82rem;color:var(--tc-text-2);white-space:normal;word-wrap:break-word;line-height:1.4}.note-text.warning{color:#92400e;font-weight:500;background:var(--tc-warning-light);padding:.25rem .5rem;border-radius:6px;display:inline-block}.text-muted{color:var(--tc-text-3);font-style:italic}.status-cell{text-align:center;min-width:120px}.status-indicator{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .875rem;border-radius:20px;background:var(--tc-bg);white-space:nowrap;font-size:.8rem;font-weight:600}.status-dot{width:8px;height:8px;border-radius:50%;display:inline-block;position:relative}.status-dot.completed{background:var(--tc-success)}.status-dot.working{background:var(--tc-warning);animation:pulse 2s infinite}.status-dot.approved{background:var(--tc-info)}.status-dot.rejected{background:var(--tc-danger)}@keyframes pulse{0%,to{box-shadow:0 0 #f59e0b80}50%{box-shadow:0 0 0 6px #f59e0b00}}.status-text{font-size:.82rem;font-weight:600;color:var(--tc-success)}.badge{padding:.22rem .65rem;border-radius:12px;font-size:.78rem;font-weight:600}.late-badge{background:var(--tc-warning-light);color:#92400e}.outside-badge{background:var(--tc-danger-light);color:#991b1b}@media (max-width: 768px){.time-display{font-size:1.6rem}.date-display{font-size:.8rem}.clock-btn{font-size:1.1rem;padding:1.1rem}.current-time{flex-direction:column;text-align:center}.time-date-section{text-align:center}}