:root{--slate-50: #f8fafc;--slate-100: #f1f5f9;--slate-200: #e2e8f0;--slate-300: #cbd5e1;--slate-700: #334155;--slate-800: #1f2937;--blue-600: #2563eb;--red-500: #ef4444;--indigo-600: #4f46e5;--info: #0284c7;--success: #10b981;--warning: #f59e0b;--danger: var(--red-500);--accent: var(--indigo-600);--text-1: var(--slate-800);--text-2: #475569;--text-inverse: #ffffff;--surface-1: #ffffff;--surface-2: var(--slate-100);--surface-3: var(--slate-200);--overlay: rgba(15, 23, 42, .5);--backdrop: rgba(0, 0, 0, .3);--border-color: var(--slate-300);--border-subtle: var(--slate-200);--border-strong: var(--slate-700);--disabled-bg: var(--slate-100);--disabled-fg: #94a3b8;--disabled-border: var(--slate-200);--disabled-opacity: .5;--color-surface: var(--surface-1);--color-surface-alt: var(--surface-2);--color-text: var(--text-1);--color-text-inverse: var(--text-inverse);--color-subtext: var(--text-2);--color-primary: var(--blue-600);--color-success: var(--success);--color-warn: var(--warning);--color-danger: var(--danger);--color-border: var(--border-color);--primary: var(--color-primary);--primary-dark: #1e40af;--shadow-1: 0 1px 2px rgba(0,0,0,.06);--shadow-2: 0 2px 10px rgba(0,0,0,.06);--shadow-3: 0 6px 20px rgba(0,0,0,.1);--shadow-4: 0 12px 32px rgba(0,0,0,.16);--shadow-card: var(--shadow-2);--radius-0: 0;--radius-1: 4px;--radius-2: 8px;--radius-3: 12px;--radius-4: 16px;--radius-pill: 9999px;--radius-round: 50%;--radius-xxl: var(--radius-4);--space-0: 0;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--font-family-base: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;--font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;--font-size-base: 14px;--font-size-lg: 16px;--font-size-heading-sm: 18px;--font-size-heading-md: 20px;--font-size-heading-lg: 22px;--line-height-base: 1.5;--line-height-heading: 1.3;--focus-ring-color: rgba(37,99,235,.35);--focus-ring-width: 3px;--focus-ring: 0 0 0 var(--focus-ring-width) var(--focus-ring-color);--card-padding: var(--space-6);--card-radius: var(--radius-4);--card-shadow: var(--shadow-card);--card-border: 1px solid var(--border-color);--input-height: 36px;--input-radius: 6px;--input-border: 1px solid var(--border-color);--input-padding: 0 var(--space-3);--input-focus-ring: var(--focus-ring);--button-radius: 6px;--button-padding: 0 var(--space-4);--button-height: 36px;--success-bg: #d1fae5;--success-border: #a7f3d0;--success-text: #065f46;--warning-bg: #fff3cd;--warning-border: #ffeeba;--warning-text: #856404;--danger-bg: #f8d7da;--danger-border: #f5c6cb;--danger-text: #721c24;--info-bg: #cff4fc;--info-border: #b6effb;--info-text: #055160}:root[data-theme=dark]{--text-1: #e5e7eb;--text-2: #cbd5e1;--text-inverse: #0b1221;--surface-1: #0f172a;--surface-2: #111827;--surface-3: #1f2937;--overlay: rgba(2,6,23,.6);--backdrop: rgba(0,0,0,.6);--border-color: #475569;--border-subtle: #334155;--border-strong: #94a3b8;--disabled-bg: #0b1221;--disabled-fg: #64748b;--disabled-border: #334155;--shadow-1: 0 1px 2px rgba(0,0,0,.5);--shadow-2: 0 2px 10px rgba(0,0,0,.55);--shadow-3: 0 6px 20px rgba(0,0,0,.6);--shadow-4: 0 12px 32px rgba(0,0,0,.65)}body{font-family:var(--font-family-base);font-size:var(--font-size-base);line-height:var(--line-height-base);color:var(--text-1);background-color:var(--surface-2);margin:0;padding:0}h1,h2,h3,h4,h5,h6{line-height:var(--line-height-heading);margin:0}.card{background:var(--surface-1);border-radius:var(--card-radius);box-shadow:var(--card-shadow);padding:var(--card-padding);border:var(--card-border)}input[type=text],input[type=email],input[type=password],input[type=number],input[type=time],select{height:var(--input-height);border-radius:var(--input-radius);border:var(--input-border);padding:var(--input-padding);font-family:var(--font-family-base);font-size:var(--font-size-base);outline:none;transition:border-color .2s,box-shadow .2s}input:focus,select:focus{border-color:var(--color-primary);box-shadow:var(--input-focus-ring)}input[type=number],.numeric{font-family:var(--font-family-mono);text-align:right}button{height:var(--button-height);padding:var(--button-padding);border-radius:var(--button-radius);border:var(--input-border);background:var(--surface-1);color:var(--text-1);font-size:var(--font-size-base);cursor:pointer;transition:background .2s,opacity .2s,color .2s,border-color .2s}button:hover{background:var(--surface-2)}button:disabled{opacity:var(--disabled-opacity);cursor:not-allowed}button.primary{background:var(--primary);color:var(--text-inverse);border:none}button.primary:hover{opacity:.9}button.secondary{background:var(--color-surface);border:var(--input-border);color:var(--color-text)}button.success{background:var(--success);color:var(--text-inverse);border:none}button.danger{background:var(--danger);color:var(--text-inverse);border:none}button.warn{background:var(--warning);color:var(--text-inverse);border:none}.status-active{color:var(--color-status-active)}.status-alert{color:var(--color-status-alert)}.status-done{color:var(--color-status-done)}.mb-2{margin-bottom:var(--space-2)}.mb-3{margin-bottom:var(--space-3)}.mb-4{margin-bottom:var(--space-4)}.mb-6{margin-bottom:var(--space-6)}.mt-2{margin-top:var(--space-2)}.mt-3{margin-top:var(--space-3)}.mt-4{margin-top:var(--space-4)}.mt-6{margin-top:var(--space-6)}table{width:100%;border-collapse:collapse}th,td{padding:var(--space-3);border:var(--input-border)}th{background:var(--surface-2);font-weight:400;color:var(--text-2);text-align:left}dialog{border:var(--card-border);border-radius:var(--card-radius);padding:var(--card-padding);box-shadow:var(--card-shadow)}dialog::backdrop{background:var(--backdrop)}.btn{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 16px;border-radius:12px;border:1px solid var(--slate-300);font-weight:600;background:var(--slate-100)!important;color:var(--slate-800)!important;transition:filter .15s ease,background .15s ease;font-size:1rem}.btn:hover{background:var(--slate-200)!important}.btn:focus-visible{outline:2px solid rgba(37,99,235,.35);outline-offset:2px}button.btn.btn-primary{background:var(--blue-600)!important;color:var(--color-text-inverse)!important;border-color:transparent!important}button.btn.btn-primary:hover{filter:brightness(.96)}button.btn.btn-danger{background:var(--red-500)!important;color:var(--color-text-inverse)!important;border-color:transparent!important}button.btn.btn-danger:hover{filter:brightness(.96)}button.btn.btn-accent{background:var(--indigo-600)!important;color:var(--color-text-inverse)!important;border-color:transparent!important}button.btn.btn-accent:hover{filter:brightness(.96)}.action-btn{background:var(--slate-100)!important;color:var(--slate-800)!important;border-color:var(--slate-300)!important;height:44px;padding:0 16px;border-radius:12px;font-weight:600;font-size:1rem}.home-page .clockbar .clock-btn{height:50px;padding:0 20px;border-radius:14px}.home-page .clockbar .btn.btn-primary#btnClockIn{background:var(--blue-600)!important;color:var(--color-text-inverse)!important;border-color:transparent!important}.home-page .clockbar .btn.btn-danger#btnClockOut{background:var(--red-500)!important;color:var(--color-text-inverse)!important;border-color:transparent!important}.btn svg,.btn i{color:currentColor;fill:currentColor}.pending-value{color:#2563eb!important;font-weight:600}.btn{--_bg: var(--surface-2);--_fg: var(--text-1);--_bd: var(--border-color);background:var(--_bg)!important;color:var(--_fg)!important;border-color:var(--_bd)!important;transition:filter .15s ease,background .15s ease,box-shadow .15s ease}.btn:hover{background:var(--surface-3)!important}.btn:focus-visible{outline:none;box-shadow:var(--focus-ring)}button.btn.btn-primary{background:var(--primary)!important;color:var(--text-inverse)!important;border-color:transparent!important}button.btn.btn-danger{background:var(--danger)!important;color:var(--text-inverse)!important;border-color:transparent!important}button.btn.btn-accent{background:var(--accent)!important;color:var(--text-inverse)!important;border-color:transparent!important}button.btn.btn-success{background:var(--success)!important;color:var(--text-inverse)!important;border-color:transparent!important}button.btn.btn-warning{background:var(--warning)!important;color:var(--text-inverse)!important;border-color:transparent!important}.action-btn{background:var(--surface-2)!important;color:var(--text-1)!important;border-color:var(--border-color)!important}.text-center{text-align:center}.toast{position:fixed;top:20px;right:20px;z-index:10000;padding:12px 16px;border-radius:8px;border:1px solid var(--border-color);box-shadow:var(--shadow-2);background:var(--surface-1);color:var(--text-1)}.toast--success{background:var(--success-bg);border-color:var(--success-border);color:var(--success-text)}.toast--error{background:var(--danger-bg);border-color:var(--danger-border);color:var(--danger-text)}.toast--info{background:var(--info-bg);border-color:var(--info-border);color:var(--info-text)}.toast--warning{background:var(--warning-bg);border-color:var(--warning-border);color:var(--warning-text)}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:var(--space-3);border:1px solid var(--border-color)}.table thead th{position:sticky;top:0;background:var(--surface-2);z-index:1}.table.is-loading{opacity:.6;pointer-events:none}.table.is-empty .table__body{display:none}.table.has-error{outline:2px solid var(--danger)}.table .is-editing{background:#fffbeb}.btn:focus-visible{box-shadow:var(--input-focus-ring)!important}.toast{top:var(--space-6)!important;right:auto!important;left:50%!important;transform:translate(-50%)!important;min-width:240px;max-width:480px;z-index:1100!important;text-align:center}.modal-card{position:relative;z-index:1300}.table.is-empty:after{content:"データがありません";display:block;padding:var(--space-6);color:var(--text-2)}.table.has-error:after{content:"読み込みに失敗しました";display:block;padding:var(--space-6);color:var(--danger)}@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}.modal-backdrop{position:fixed;inset:0;background:#0f172a80;align-items:center;justify-content:center;z-index:1000;display:none}.modal-backdrop[hidden]{display:none!important}.modal-backdrop:not([hidden]){display:flex!important}.modal-card{width:min(720px,calc(100vw - 32px));background:#fff;border-radius:16px;border:1px solid var(--slate-200);box-shadow:0 10px 30px #00000026;display:flex;flex-direction:column;max-height:80vh;overflow:hidden}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--slate-200)}.modal-body{padding:16px 20px;overflow:auto}.modal-footer{padding:12px 20px;border-top:1px solid var(--slate-200);display:flex;justify-content:space-between;align-items:center}.icon-btn{background:transparent;border:none;font-size:20px;line-height:1;cursor:pointer;color:var(--slate-700)}.diff-table{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.diff-row{display:grid;grid-template-columns:28px 120px 1fr 24px 1fr;gap:8px;align-items:center;padding:8px;border:1px solid var(--slate-200);border-radius:10px}.field-badge{background:#eef2ff;color:#4f46e5;font-weight:600;padding:2px 10px;border-radius:999px;justify-self:start}.value-old{color:#64748b}.value-new{color:#111827;font-weight:600}.arrow{color:#94a3b8;text-align:center}.empty{padding:16px;color:#64748b}.note-block label{font-weight:600;display:block;margin-bottom:6px}.note-block textarea{width:100%;border:1px solid var(--slate-300);border-radius:10px;padding:8px 10px;resize:vertical;min-height:72px}.note-block .help{color:#64748b;font-size:12px;margin-top:4px}#sel-count{color:#374151;font-weight:600}.req{color:var(--red-500);margin-left:2px}.btn-secondary,.btn-secondary *{color:var(--slate-800)!important}.request-btn{background:#2563eb;color:#fff;border:1px solid #2563EB;border-radius:6px;padding:4px 16px;font-weight:600;font-size:1rem;transition:background .2s,color .2s}.request-btn:disabled{background:#e5e7eb;color:#9ca3af;border-color:#e5e7eb;cursor:not-allowed}.request-btn:hover:not(:disabled){background:#1e40af;color:#fff}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:32px;margin-bottom:32px}.dashboard-card{background:#fff;border-radius:16px;box-shadow:0 2px 10px #0000000f;padding:24px;border:1px solid #E5E7EB;min-height:180px;outline:none;transition:box-shadow .2s}.dashboard-card:focus{box-shadow:0 0 0 3px #3b82f6}.attendance-status .status-label{font-weight:600;color:#374151;margin-right:8px}.attendance-status .status-value{font-size:1.1rem;font-weight:600;padding:2px 12px;border-radius:8px}.attendance-status .not-started{background:#f3f4f6;color:#6b7280}.attendance-status .working{background:#d1fae5;color:#10b981}.attendance-status .left{background:#fee2e2;color:#ef4444}.work-hours-content{display:flex;flex-direction:column;gap:12px}.metric-value{font-size:1.2rem;font-weight:700;color:#2563eb}.work-hours-graph{margin-top:8px;background:#f3f4f6;border-radius:8px;padding:8px;display:flex;justify-content:center}.attendance-log{display:flex;flex-direction:column;gap:12px}.switch-label{display:flex;align-items:center;gap:8px;font-size:1rem;margin-bottom:8px}.switch-text{color:#374151}.log-list{display:flex;flex-direction:column;gap:8px}.log-item{background:#f3f4f6;border-radius:8px;padding:8px 16px;font-size:1rem;color:#374151;display:flex;align-items:center;gap:16px}.log-item.alert{background:#fef3c7;color:#f59e0b}.alert-icon.overtime{color:#f59e0b}.alert-icon.missing{color:#ef4444}.alert-icon.irregular{color:#3b82f6}.log-date,.alert-date{font-weight:600;min-width:90px}.clock-in{color:#10b981}.clock-out{color:#ef4444}.timesheet-summary-section{margin-bottom:24px}.summary-card{background:#fff;border-radius:16px;box-shadow:0 2px 10px #0000000f;padding:24px;border:1px solid #E5E7EB;margin-bottom:8px}.summary-items{display:flex;gap:32px;font-size:1.1rem;color:#374151}.date-color-出勤{color:#222}.date-color-所定休{color:#2563eb}.date-color-法定休{color:#ef4444}.status-pill .pill{display:inline-block;padding:4px 16px;border-radius:99px;font-size:.95rem;font-weight:600;margin:0 2px}.pill-進行中{background:#d1fae5;color:#10b981}.pill-差戻し{background:#fee2e2;color:#ef4444}.pill-完了{background:#f3f4f6;color:#6b7280}.modified-time{color:#2563eb!important}.locked{background:#f3f4f6;pointer-events:none}.clockbar{width:100%;background:#fff;border-radius:16px;box-shadow:0 2px 10px #0000000f;padding:32px 24px 24px;margin-bottom:32px;display:flex;flex-direction:column;gap:24px;border:1px solid #E5E7EB}.clockbar-btns{display:flex;gap:32px;justify-content:space-between;margin-bottom:16px}.clock-btn{min-width:160px;height:56px;font-size:1.25rem;font-weight:600;border-radius:16px;box-shadow:0 2px 10px #0000000f;border:2px solid #E5E7EB;background:var(--color-surface, #fff);color:var(--color-text, #374151);display:flex;align-items:center;justify-content:center;gap:12px;transition:background .2s,box-shadow .2s;outline:none}.clock-btn:focus{box-shadow:0 0 0 3px #2563eb}.clock-btn[disabled],.clock-btn.ghost{background:#e5e7eb;color:#9ca3af;border-color:#e5e7eb;cursor:not-allowed}.clock-btn-in{background:var(--color-primary);color:var(--color-text-inverse)}.clock-btn-out{background:var(--color-danger);color:var(--color-text-inverse)}.clock-btn-break{background:var(--color-warn);color:var(--color-text-inverse)}.clock-btn-back{background:var(--color-success);color:var(--color-text-inverse)}.clock-btn-in:focus{box-shadow:0 0 0 3px var(--color-primary)}.clock-btn-out:focus{box-shadow:0 0 0 3px var(--color-danger)}.clock-btn-break:focus{box-shadow:0 0 0 3px var(--color-warn)}.clock-btn-back:focus{box-shadow:0 0 0 3px var(--color-success)}.clockbar-memo{margin-top:8px;display:flex;flex-direction:column;gap:4px}.clockbar-memo label{font-size:1rem;color:#374151;margin-bottom:2px}#memoHelp{font-size:.875rem;color:#6b7280}#memoInput{width:100%;font-size:1rem;border-radius:8px;border:1px solid #E5E7EB;padding:8px;resize:none;transition:box-shadow .2s}#memoInput:focus{box-shadow:0 0 0 2px #3b82f6}.clockbar-status{font-size:1rem;color:#374151;margin-top:8px}.clockbar-toast{position:fixed;top:24px;left:50%;transform:translate(-50%);min-width:240px;max-width:400px;padding:16px 24px;border-radius:12px;font-size:1.1rem;font-weight:600;color:#fff;z-index:1000;box-shadow:0 2px 10px #0000001f;background:#10b981;text-align:center;opacity:.98}.app-container{max-width:1200px;margin:0 auto;padding:var(--space-6)}.app-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-6)}.app-title{font-size:var(--font-size-heading-lg);color:var(--color-text)}.auth-section{display:flex;align-items:center;gap:var(--space-4)}.main-content{display:grid;gap:var(--space-4)}.action-bar{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4)}.action-bar .spacer{flex:1}.status-card{background:var(--color-surface);border-radius:var(--card-radius);box-shadow:var(--card-shadow);padding:var(--card-padding);margin-bottom:var(--space-4)}.status-card-title{font-size:var(--font-size-heading-sm);color:var(--color-subtext);margin-bottom:var(--space-3)}.status-card-content{display:flex;align-items:center;gap:var(--space-4)}.data-grid{background:var(--color-surface);border-radius:var(--card-radius);box-shadow:var(--card-shadow);overflow:hidden}.data-grid table{margin:0}.data-grid th{background:var(--color-surface-alt);color:var(--color-subtext);font-weight:400;text-align:left;padding:var(--space-3) var(--space-4)}.data-grid td{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border)}.data-grid tr:last-child td{border-bottom:none}.form-dialog{max-width:480px;width:100%}.form-dialog h2{font-size:var(--font-size-heading-sm);margin-bottom:var(--space-4)}.form-group{margin-bottom:var(--space-4)}.form-group label{display:block;margin-bottom:var(--space-2);color:var(--color-subtext)}.form-actions{display:flex;justify-content:flex-end;gap:var(--space-3);margin-top:var(--space-6)}.badge{display:inline-flex;align-items:center;padding:var(--space-2) var(--space-3);border-radius:99px;font-size:12px;font-weight:500}.badge-success{background:#10b9811a;color:var(--color-success)}.badge-warning{background:#f59e0b1a;color:var(--color-warn)}.badge-danger{background:#ef44441a;color:var(--color-danger)}.menu-bar{display:flex;gap:var(--space-2);align-items:center;background:var(--color-surface);padding:var(--space-2);border-radius:var(--button-radius);border:var(--input-border)}.menu-bar button{height:32px;padding:0 var(--space-3);border-radius:var(--button-radius);background:none;color:var(--color-text)}.menu-bar button:hover{background:var(--color-surface-alt)}.menu-bar button.active{background:var(--color-primary);color:var(--color-text-inverse)}.auth-section button:last-child,.auth-section .logout{border:2px solid var(--color-danger);color:var(--color-danger);background:transparent;font-weight:600}.auth-section button:last-child:hover,.auth-section .logout:hover{background:var(--color-danger);color:var(--color-text-inverse)}.login-form{display:grid;gap:var(--space-4);max-width:400px;margin:var(--space-6) auto;padding:var(--card-padding);background:var(--color-surface);border-radius:var(--card-radius);box-shadow:var(--card-shadow)}.login-form h2{font-size:var(--font-size-heading-md);margin-bottom:var(--space-4)}.page-container{max-width:1120px;margin:0 auto;padding:16px}.home-page .card{width:100%;border-radius:16px;background:#fff;box-shadow:0 2px 10px #0000000f}.home-page .card+.card{margin-top:16px}.clockbar-card{padding:16px}.home-page .clockbar,.home-page .clock-actions,.home-page .memo-row,.home-page .clockbar-btns,.home-page .clockbar-memo{background:transparent!important;border:none!important;box-shadow:none!important}.home-page .clock-actions,.home-page .clockbar-btns{display:flex;justify-content:center;align-items:center;gap:24px;padding:4px 0 8px}.home-page .clock-btn{flex:0 0 220px;width:220px;height:50px}.home-page .memo-row{margin-top:12px;display:grid;gap:8px}.home-page .clock-memo,.home-page .clockbar-memo textarea{width:100%;height:36px;padding:8px 12px;border:1px solid var(--border, #E5E7EB);border-radius:10px;background:#fff;box-sizing:border-box}@media (max-width: 640px){.home-page .clock-actions,.home-page .clockbar-btns{flex-direction:column;align-items:stretch}.home-page .clock-btn{width:100%;flex:1 0 auto}}:root{--auth-card-width: 380px;--auth-gap: 12px;--auth-input-h: 44px}.auth-container{min-height:100dvh;display:grid;place-items:center;padding:24px}.auth-card{width:min(var(--auth-card-width),92vw);background:#fff;border-radius:12px;box-shadow:0 6px 24px #00000014;padding:24px 24px 28px}.auth-title{font-size:20px;font-weight:700;margin:4px 0 16px;text-align:center}.auth-alert{margin:0 0 12px;padding:10px 12px;border-radius:8px;background:#fee2e2;color:#991b1b;font-size:13px}.auth-alert #loginAlert{display:none}.auth-form{display:grid;gap:var(--auth-gap)}.form-group label{display:block;font-size:12px;color:#374151;margin-bottom:6px}.input-wrap{position:relative}.input{width:100%;height:var(--auth-input-h);padding:0 12px;box-sizing:border-box;border:1px solid #d1d5db;border-radius:8px;outline:none;font-size:14px;line-height:1;background:#fff}.input:focus{border-color:#93c5fd;box-shadow:0 0 0 3px #3b82f633}.input--with-icon{padding-right:42px}.toggle-visibility{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:28px;height:28px;border:none;background:transparent;border-radius:6px;display:grid;place-items:center;cursor:pointer}.toggle-visibility:hover{background:#f3f4f6}.toggle-visibility svg{width:20px;height:20px}.caps-warning{display:none;font-size:12px;color:#b45309;margin-top:6px}.caps-warning[aria-hidden=false]{display:inline-flex;align-items:center;gap:6px}.auth-actions{margin-top:4px}.auth-submit{width:100%;height:46px;border:none;border-radius:10px;background:#86a8ff;color:#fff;font-weight:700;cursor:pointer}.auth-submit:disabled{opacity:.6;cursor:not-allowed}.users-page{padding:1rem}.users-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.users-header h1{margin:0}.controls{display:flex;gap:.5rem}.users-content{background-color:#fff;border-radius:4px;box-shadow:0 1px 3px #0000001a;padding:1rem}.message-container{margin-bottom:1rem}.info-message{background-color:#e3f2fd;border:1px solid #bbdefb;border-radius:4px;padding:.5rem 1rem;color:#1976d2}.success-message{background-color:#e8f5e9;border:1px solid #c8e6c9;border-radius:4px;padding:.5rem 1rem;color:#2e7d32}.error-message{background-color:#ffebee;border:1px solid #ffcdd2;border-radius:4px;padding:.5rem 1rem;color:#d32f2f}.users-table{width:100%;border-collapse:collapse}.users-table th,.users-table td{padding:.75rem;text-align:left;border-bottom:1px solid #eee}.users-table th{background-color:#f5f5f5;font-weight:600;white-space:nowrap}.users-table tr:hover{background-color:#f9f9f9}.users-table tr.retired-user{background-color:#f9f9f9;color:#666}.detail-btn,.toggle-retired-btn,.user-csv-btn,.export-btn,.refresh-btn,.alert-save-btn{padding:.4rem .8rem;border-radius:4px;border:none;cursor:pointer;font-size:.9rem;transition:background-color .2s;margin-right:.25rem}.detail-btn{background-color:#2196f3;color:#fff}.toggle-retired-btn{background-color:#ff9800;color:#fff}.user-csv-btn,.export-btn{background-color:#4caf50;color:#fff}.refresh-btn{background-color:#2196f3;color:#fff}.alert-save-btn{background-color:#9e9e9e;color:#fff;margin-left:.5rem}.detail-btn:hover{background-color:#1976d2}.toggle-retired-btn:hover{background-color:#f57c00}.user-csv-btn:hover,.export-btn:hover{background-color:#388e3c}.refresh-btn:hover{background-color:#1976d2}.alert-save-btn:hover{background-color:#757575}button:disabled{opacity:.6;cursor:not-allowed}.alert-min-input{width:60px;padding:.4rem;border:1px solid #ddd;border-radius:4px}.user-name-link{color:#2196f3;text-decoration:none;font-weight:500}.user-name-link:hover{text-decoration:underline}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background-color:#fff;border-radius:4px;width:400px;max-width:90%;padding:1.5rem;box-shadow:0 4px 8px #0003}.modal h3{margin-top:0;color:#333}.form-group{margin-bottom:1rem}.form-group label{display:block;margin-bottom:.3rem;font-weight:500}.form-group input,.form-group select{width:100%;padding:.5rem;border:1px solid #ddd;border-radius:4px;font-size:1rem}.form-description{font-size:.9rem;color:#666;margin-bottom:1rem}.modal-actions{display:flex;justify-content:flex-end;margin-top:1.5rem;gap:.5rem}.cancel-btn,.confirm-btn{padding:.5rem 1rem;border-radius:4px;border:none;cursor:pointer;font-size:1rem}.cancel-btn{background-color:#e0e0e0;color:#333}.confirm-btn{background-color:#4caf50;color:#fff}.cancel-btn:hover{background-color:#d5d5d5}.confirm-btn:hover{background-color:#388e3c}.approvals-page{padding:20px}.filter-bar{display:flex;flex-wrap:wrap;align-items:center;gap:15px;margin-bottom:20px;padding:15px;background-color:#f5f8fa;border-radius:5px}.filter-group{display:flex;align-items:center}.filter-group label{margin-right:8px;font-weight:500}.status-filter{display:flex;gap:8px}.status-filter button{padding:6px 12px;border-radius:4px;border:1px solid #ddd;background-color:#fff;cursor:pointer;font-size:.9rem}.status-filter button.active{background-color:#4a6cf7;color:#fff;border-color:#3a5ce5}.search-box{display:flex;position:relative;flex-grow:1;max-width:300px}.search-box input{width:100%;padding:8px 35px 8px 12px;border:1px solid #ddd;border-radius:4px}.search-box .search-icon{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:#888}.bulk-actions{margin-left:auto;display:flex;gap:8px}.bulk-actions button{padding:6px 12px;border-radius:4px;border:1px solid #ddd;background-color:#fff;cursor:pointer;font-size:.9rem}.bulk-actions button:disabled{opacity:.5;cursor:not-allowed}.bulk-actions .approve-btn{background-color:#28a745;color:#fff;border-color:#28a745}.bulk-actions .reject-btn{background-color:#dc3545;color:#fff;border-color:#dc3545}.approvals-table{width:100%;border-collapse:collapse;margin-bottom:20px}.approvals-table th,.approvals-table td{padding:12px 15px;border-bottom:1px solid #e5e5e5;text-align:left}.approvals-table th{background-color:#f8f9fa;font-weight:600;color:#495057;position:sticky;top:0;z-index:10;box-shadow:0 1px #e5e5e5}.approvals-table tbody tr:hover{background-color:#f8f9fa}.approvals-table .checkbox-cell{width:30px;text-align:center}.badge{display:inline-block;padding:3px 8px;border-radius:12px;font-size:.75rem;font-weight:500}.badge.days{background-color:#f8d7da;color:#721c24}.badge.days.urgent{background-color:#dc3545;color:#fff}.status-badge{display:inline-block;padding:3px 8px;border-radius:12px;font-size:.75rem;font-weight:500}.status-badge.status-pending{background-color:#fff3cd;color:#856404}.status-badge.status-approved{background-color:#d4edda;color:#155724}.status-badge.status-rejected{background-color:#f8d7da;color:#721c24}.status-badge.status-canceled{background-color:#e2e3e5;color:#383d41}.action-cell{width:100px}.action-btn{padding:3px 8px;border-radius:4px;border:1px solid #ddd;background-color:#fff;cursor:pointer;font-size:.8rem;margin-right:4px}.action-btn.approve{border-color:#28a745;background-color:#d4edda;color:#155724}.action-btn.reject{border-color:#dc3545;background-color:#f8d7da;color:#721c24}.action-btn.details{border-color:#17a2b8;background-color:#d1ecf1;color:#0c5460}.action-btn:disabled{opacity:.5;cursor:not-allowed}.approval-drawer{position:fixed;inset:0;z-index:1000}.approval-drawer .drawer-container{position:absolute;right:0;top:0;height:100%;width:480px;background:#fff;box-shadow:-8px 0 24px #0003;transform:translate(100%);transition:transform .25s ease}.approval-drawer.open .drawer-container{transform:translate(0)}.drawer-container{flex:1;display:flex;flex-direction:column;height:100%}.drawer-header{padding:15px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e5e5e5}.drawer-header h3{margin:0}.drawer-header .close-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;color:#888}.drawer-content{padding:15px;overflow-y:auto;flex:1}.detail-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:15px}.user-date h4{margin:0 0 5px;font-size:1.2rem}.user-date .date{font-size:.9rem;color:#666}.detail-content .label{font-weight:500;color:#666;width:100px;display:inline-block}.detail-content .value{font-weight:400}.changes-section,.note-section,.attachments-section{margin-top:20px;padding-top:15px;border-top:1px solid #e5e5e5}.changes-section h5,.note-section h5,.attachments-section h5{margin:0 0 10px;font-size:1rem}.diff-container{background-color:#f8f9fa;padding:10px;border-radius:5px;margin-bottom:10px}.diff-row{margin-bottom:5px}.note{background-color:#f8f9fa;padding:10px;border-radius:5px;white-space:pre-wrap}.bulk-action-modal .modal-container{width:500px;max-width:90%}.bulk-action-modal .form-group{margin-bottom:15px}.bulk-action-modal .form-group label{display:block;margin-bottom:5px;font-weight:500}.bulk-action-modal .form-group .required{color:#dc3545}.bulk-action-modal .form-control{width:100%;padding:8px;border:1px solid #ddd;border-radius:4px}.bulk-action-modal .form-hint{font-size:.8rem;color:#666;margin-top:3px}.bulk-action-modal .selected-items{margin-top:15px;max-height:200px;overflow-y:auto}.bulk-action-modal .selected-items h4{margin:0 0 5px;font-size:1rem}.bulk-action-modal .item-list{list-style:none;padding:0;margin:0}.bulk-action-modal .item-list li{padding:5px 0;border-bottom:1px dashed #e5e5e5}.bulk-action-modal .result-message{text-align:center;padding:20px}.bulk-action-modal .result-message .icon{font-size:2rem;margin-bottom:10px}.bulk-action-modal .result-message.success .icon{color:#28a745}.bulk-action-modal .result-message.error .icon,.bulk-action-modal .result-message.partial-error .icon{color:#dc3545}.bulk-action-modal .error-details{margin-top:15px;text-align:left}.bulk-action-modal .error-details h5{margin:0 0 5px;font-size:1rem}.bulk-action-modal .error-details ul{padding-left:20px}.mb-2{margin-bottom:8px}.mb-3{margin-bottom:12px}.mb-4{margin-bottom:16px}.flex{display:flex}.gap-2{gap:8px}.items-baseline{align-items:baseline}.w-20{width:80px}.text-gray-500{color:#6c757d}.spinner{display:inline-block;width:12px;height:12px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spinner .75s linear infinite;margin-right:5px}@keyframes spinner{to{transform:rotate(360deg)}}#approval-backdrop{position:fixed;inset:0;background:#11182773;z-index:999}#approval-backdrop[hidden]{display:none!important}.timesheet-page{padding:1rem}.timesheet-header{margin-bottom:1rem}.btn-secondary.cancel-btn{margin-left:.5rem}.btn-secondary.return-btn{margin-right:.5rem}.pending-row .pending-value{color:#2563eb!important;font-weight:600}.pill-warning{background:#f59e0b22;color:#92400e;border:1px solid #F59E0B55}.pending-row select,.pending-row input,.pending-row textarea{pointer-events:none}.pending-row .request-btn,.pending-row .cancel-btn,.pending-row .return-btn{pointer-events:auto!important;opacity:1!important;cursor:pointer}.locked .request-btn,.locked .cancel-btn,.locked .return-btn{pointer-events:auto!important}.pending-row .cancel-btn[disabled]{opacity:1}.timesheet-controls{display:flex;justify-content:space-between;align-items:center;margin:1rem 0}.period-selector{display:flex;gap:.5rem;align-items:center}.period-btn{padding:.5rem 1rem;border:1px solid var(--border-color);border-radius:4px;background:var(--button-bg);color:var(--button-text)}.period-btn:hover{background:var(--button-hover-bg)}.custom-period{padding:.5rem;border:1px solid var(--border-color);border-radius:4px}.action-buttons{display:flex;gap:.5rem}.timesheet-table{width:100%;margin-top:1rem}.timesheet-table table{width:100%;border-collapse:collapse;table-layout:fixed}.timesheet-table th,.timesheet-table td{border:1px solid #eee;padding:.5rem}.timesheet-table th{background:#f5f5f5;color:var(--slate-800);font-weight:600;text-align:center}.timesheet-table table{background:var(--color-surface);border:1px solid #eee}.timesheet-table tbody tr{background:var(--color-surface)}.timesheet-table tbody tr.is-sun td{background:#fff5f5}.timesheet-table tbody tr.is-sat td{background:#f5f7ff}.timesheet-table tbody tr.is-holiday td{background:#fff7e6}.timesheet-table tbody tr.is-weekend.is-holiday td{background:#ffefe0}.holiday-badge{display:inline-block;margin-left:4px;padding:0 6px;font-size:12px;line-height:18px;border-radius:9px;background:#fde68a;color:#7c2d12;border:1px solid #fbbf24}.timesheet-table td.numeric{text-align:right}.timesheet-table td:last-child{white-space:nowrap}.timesheet-table td:last-child .btn.btn-secondary[style*=margin-left]{display:none!important}.timesheet-table td:last-child .btn.cancel-btn{display:inline-block!important}.timesheet-table td:last-child .cancel-btn{margin-left:8px}.timesheet-table td:last-child .btn.btn-danger{display:none!important}.timesheet-table td:last-child .btn.btn-warning{display:none!important}.date-cell{cursor:pointer;font-weight:500}.continuation-row td:first-child{border-left:3px solid var(--border-color)}td[data-modified=true]{color:var(--text-modified)}tr.locked{background:var(--bg-disabled)}tr.locked input,tr.locked select{pointer-events:none;opacity:.7}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:var(--bg-primary);border-radius:8px;padding:1.5rem;width:80%;max-width:800px;max-height:90vh;overflow-y:auto}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.modal-close{background:none;border:none;font-size:1.5rem;cursor:pointer;padding:.5rem}.history-table{width:100%;border-collapse:collapse}.history-table th,.history-table td{border:1px solid var(--border-color);padding:.5rem}.history-table th{background:var(--header-bg);color:var(--header-text)}.status-cell{font-weight:600}.status-cell.wm-ok{color:#059669}.status-cell.wm-late{color:#d97706}.status-cell.wm-early{color:#fb923c}.status-cell.wm-late-early{color:#b45309}.status-cell.wm-absent{color:#dc2626}.status-cell.wm-na{color:#6b7280;font-weight:400}.dashboard-page{padding:1rem}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1rem;margin:0 auto;max-width:1200px}.dashboard-card{background:var(--card-bg, #fff);border-radius:8px;box-shadow:0 2px 4px #0000001a;padding:1rem;min-height:200px;outline:none;transition:box-shadow .2s ease}.dashboard-card:focus{box-shadow:0 0 0 2px var(--focus-ring-color, #007FFF)}.card-header{margin-bottom:1rem}.card-title{font-size:1.25rem;font-weight:600;margin:0;color:var(--text-primary)}.card-subtitle{font-size:.875rem;color:var(--text-secondary);margin:.25rem 0 0}.card-content{color:var(--text-primary)}.card-actions{margin-top:1rem;display:flex;gap:.5rem;justify-content:flex-end}.attendance-status{display:flex;flex-direction:column;gap:.75rem}.status-item{display:flex;justify-content:space-between;align-items:center}.status-label{color:var(--text-secondary);font-size:.875rem}.status-value{font-weight:500;padding:.25rem .75rem;border-radius:1rem}.status-value.not-started{background:var(--status-neutral-bg);color:var(--status-neutral-text)}.status-value.working{background:var(--status-active-bg);color:var(--status-active-text)}.status-value.left{background:var(--status-complete-bg);color:var(--status-complete-text)}.work-hours-content{display:flex;flex-direction:column;gap:1rem}.metric-value{font-size:1.5rem;font-weight:600;color:var(--text-primary)}.work-hours-graph{flex:1;min-height:80px;background:var(--graph-bg);border-radius:4px}.log-list{display:flex;flex-direction:column;gap:.5rem;max-height:300px;overflow-y:auto}.log-item{display:flex;padding:.5rem;border-radius:4px;background:var(--item-bg)}.log-item.alert{background:var(--alert-bg)}.alert-icon{width:24px;height:24px;margin-right:.5rem}.alert-content{flex:1}.alert-date{font-size:.75rem;color:var(--text-secondary)}.alert-message{color:var(--text-primary)}.log-date{font-size:.875rem;color:var(--text-secondary);width:100px}.log-times{flex:1;display:flex;gap:1rem}.switch-label{display:flex;align-items:center;gap:.5rem;cursor:pointer;-webkit-user-select:none;user-select:none}@media (max-width: 1024px){.dashboard-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.dashboard-grid{grid-template-columns:1fr}}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.75rem}.summary-grid .label{color:var(--text-secondary);font-size:.85rem}.summary-grid .value{font-weight:600;font-size:1.25rem;color:var(--text-primary)}#app-backdrop{position:fixed;inset:0;background:#0f172a73;z-index:999}#app-backdrop[hidden]{display:none!important}#app-backdrop:not([hidden]){display:flex!important;align-items:center;justify-content:center}.text-blue-600{color:#2563eb}.font-medium{font-weight:500}.btn-warning{background-color:#f59e0b;color:#111827}.btn-warning:hover{background-color:#d97706}#app-backdrop[hidden],.modal-backdrop[hidden]{display:none!important}#app-backdrop:not([hidden]),.modal-backdrop:not([hidden]){display:flex!important}#app-backdrop,.modal-backdrop{position:fixed;inset:0;align-items:center;justify-content:center;background:#0f172a80;z-index:1000}.approval-drawer.open{z-index:1001;display:block!important}.approval-drawer:not(.open),.modal:not(.open){display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important}body.modal-open{overflow:hidden}.registrants-page{padding:1rem}.registrants-header{display:flex;gap:12px;align-items:center;margin-bottom:.75rem}.registrants-page .btn{padding:.4rem .8rem;border:1px solid var(--border-color);border-radius:4px;background:var(--button-bg);color:var(--button-text)}.registrants-page .btn:hover{background:var(--button-hover-bg)}.registrants-page .btn.btn-primary{background:var(--brand-600, #2563eb);border-color:var(--brand-600, #2563eb);color:#fff}.registrants-page .btn.btn-outline-primary{border-color:var(--brand-600, #2563eb);color:var(--brand-700, #1d4ed8);background:transparent}.registrants-page .btn.btn-outline-primary:hover{background:var(--brand-50, #eff6ff)}.registrants-page .btn.btn-success{background:var(--success-600, #059669);border-color:var(--success-600, #059669);color:#fff}.registrants-page .timesheet-table table{width:100%;border-collapse:collapse;table-layout:fixed;background:var(--color-surface);border:1px solid #eee}.registrants-page .timesheet-table th,.registrants-page .timesheet-table td{border:1px solid #eee;padding:.5rem}.registrants-page .timesheet-table th{background:#f5f5f5;color:var(--slate-800);font-weight:600;text-align:left}.registrants-page .js-pto-badge{background:#eef5ff;color:#1558d6;border-radius:12px;padding:2px 8px;font-weight:600}
