:root{--color-primary: #0e7490;--color-primary-dark: #0c5b73;--color-primary-light: #ecfeff;--color-primary-contrast: #ffffff;--color-ink: #0f172a;--color-text: #1e293b;--color-text-muted: #64748b;--color-text-subtle: #94a3b8;--color-border: #e2e8f0;--color-border-strong: #cbd5e1;--color-surface: #ffffff;--color-surface-sunken: #f8fafc;--color-surface-hover: #f1f5f9;--color-info: #2563eb;--color-info-bg: #eff6ff;--color-warning: #b45309;--color-warning-bg: #fffbeb;--color-success: #15803d;--color-success-bg: #f0fdf4;--color-danger: #dc2626;--color-danger-bg: #fef2f2;--color-neutral: #475569;--color-neutral-bg: #f1f5f9;--color-accent: #6d28d9;--color-accent-bg: #f5f3ff;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 10px;--radius-pill: 999px;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, Roboto, Helvetica, Arial, sans-serif;--text-xs: 12px;--text-sm: 13px;--text-base: 14px;--text-md: 15px;--text-lg: 18px;--text-xl: 24px;--leading-tight: 1.25;--leading-normal: 1.5;--shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);--shadow-md: 0 4px 16px rgba(15, 23, 42, .12);--shell-sidebar-width: 240px;--shell-topbar-height: 56px;--shell-bottomnav-height: 60px;--z-sidebar: 30;--z-topbar: 40;--z-bottomnav: 40;--z-drawer: 50;--z-modal: 60}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--leading-normal);color:var(--color-text);background:var(--color-surface-sunken);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}h1,h2,h3,h4,p{margin:0}button,input,select,textarea{font-family:inherit}a{color:inherit}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--color-border-strong);border-radius:var(--radius-pill)}::-webkit-scrollbar-track{background:transparent}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (max-width: 767px){.desktop-only{display:none!important}}@media (min-width: 768px){.mobile-only{display:none!important}}.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-5);flex-wrap:wrap}.page-header__title{font-size:var(--text-xl);font-weight:700;color:var(--color-ink);line-height:var(--leading-tight)}.page-header__subtitle{margin-top:2px;font-size:var(--text-sm);color:var(--color-text-muted)}.page-header__actions{display:flex;gap:var(--space-2);flex-wrap:wrap}@media (max-width: 767px){.page-header__title{font-size:20px}}.section-heading{font-size:var(--text-lg);font-weight:600;color:var(--color-ink);margin:var(--space-6) 0 var(--space-3)}.section-heading:first-child{margin-top:0}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);margin-bottom:var(--space-3)}.card--flush{padding:0;overflow:hidden}.card--interactive{transition:border-color .12s ease,background .12s ease}.card--interactive:hover{border-color:var(--color-border-strong);background:var(--color-surface-hover)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);border:1px solid transparent;border-radius:var(--radius-md);padding:0 var(--space-4);height:40px;font-size:var(--text-base);font-weight:600;cursor:pointer;text-decoration:none;white-space:nowrap;transition:background .12s ease,border-color .12s ease,opacity .12s ease}.btn:disabled{cursor:not-allowed;opacity:.55}.btn--sm{height:34px;padding:0 var(--space-3);font-size:var(--text-sm)}.btn--full{width:100%}.btn--primary{background:var(--color-primary);color:var(--color-primary-contrast)}.btn--primary:hover:not(:disabled){background:var(--color-primary-dark)}.btn--secondary{background:var(--color-surface);color:var(--color-text);border-color:var(--color-border-strong)}.btn--secondary:hover:not(:disabled){background:var(--color-surface-hover)}.btn--danger{background:var(--color-danger);color:#fff}.btn--danger:hover:not(:disabled){background:#b91c1c}.btn--ghost{background:transparent;color:var(--color-primary);border-color:transparent}.btn--ghost:hover:not(:disabled){background:var(--color-primary-light)}.btn--outline{background:transparent;color:var(--color-text);border-color:var(--color-border-strong)}.btn--outline:hover:not(:disabled){background:var(--color-surface-hover)}@media (max-width: 767px){.btn{min-height:44px}}.field{margin-bottom:var(--space-4)}.field:last-child{margin-bottom:0}.field__label{display:block;font-size:var(--text-sm);font-weight:600;color:var(--color-text);margin-bottom:var(--space-2)}.field__hint{font-size:var(--text-xs);color:var(--color-text-subtle);margin-top:var(--space-1)}.field__error{font-size:var(--text-xs);color:var(--color-danger);margin-top:var(--space-1)}.input,.select,.textarea{width:100%;background:var(--color-surface);border:1px solid var(--color-border-strong);border-radius:var(--radius-md);padding:0 var(--space-3);height:44px;font-size:var(--text-base);color:var(--color-text)}.textarea{height:auto;min-height:88px;padding:var(--space-3);resize:vertical}.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.input::placeholder,.textarea::placeholder{color:var(--color-text-subtle)}.input--error,.select--error,.textarea--error{border-color:var(--color-danger)}.combobox,.combobox__input-wrap{position:relative}.combobox__icon{position:absolute;left:var(--space-3);top:50%;transform:translateY(-50%);color:var(--color-text-subtle);pointer-events:none}.combobox__input{padding-left:36px}.combobox__menu{position:absolute;z-index:var(--z-drawer);top:calc(100% + 4px);left:0;right:0;max-height:280px;overflow-y:auto;background:var(--color-surface);border:1px solid var(--color-border-strong);border-radius:var(--radius-md);box-shadow:var(--shadow-md);padding:var(--space-1)}.combobox__option{display:block;width:100%;text-align:left;background:none;border:none;border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);cursor:pointer;font-family:inherit}.combobox__option:hover,.combobox__option:focus{background:var(--color-surface-hover);outline:none}.combobox__option-label{font-size:var(--text-base);color:var(--color-text);font-weight:500}.combobox__option-sub{font-size:var(--text-xs);color:var(--color-text-muted);margin-top:2px}.combobox__empty,.combobox__hint{padding:var(--space-3);font-size:var(--text-sm);color:var(--color-text-subtle);text-align:center}.checkbox-row{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-base);color:var(--color-text)}.checkbox-row input{width:18px;height:18px}.form-section{border-top:1px solid var(--color-border);padding-top:var(--space-4);margin-top:var(--space-4)}.form-section:first-child{border-top:none;padding-top:0;margin-top:0}.form-section__title{font-size:var(--text-sm);font-weight:700;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.03em;margin-bottom:var(--space-3)}.badge{display:inline-flex;align-items:center;gap:6px;border-radius:var(--radius-pill);padding:4px 10px;font-size:var(--text-xs);font-weight:700;white-space:nowrap;line-height:1.4}.badge__dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}.badge--neutral{background:var(--color-neutral-bg);color:var(--color-neutral)}.badge--info{background:var(--color-info-bg);color:var(--color-info)}.badge--warning{background:var(--color-warning-bg);color:var(--color-warning)}.badge--success{background:var(--color-success-bg);color:var(--color-success)}.badge--danger{background:var(--color-danger-bg);color:var(--color-danger)}.badge--accent{background:var(--color-accent-bg);color:var(--color-accent)}.badge--primary{background:var(--color-primary-light);color:var(--color-primary-dark)}.empty-state{text-align:center;padding:var(--space-8) var(--space-4);color:var(--color-text-muted)}.empty-state__title{font-size:var(--text-md);font-weight:600;color:var(--color-text);margin-bottom:var(--space-1)}.empty-state__desc{font-size:var(--text-sm);color:var(--color-text-muted);max-width:340px;margin:0 auto}.empty-state__action{margin-top:var(--space-4)}.error-state{text-align:center;padding:var(--space-6) var(--space-4);background:var(--color-danger-bg);border:1px solid #fecaca;border-radius:var(--radius-lg);color:var(--color-danger)}.error-state__title{font-weight:600;margin-bottom:var(--space-1)}.error-state__desc{font-size:var(--text-sm);margin-bottom:var(--space-3)}.skeleton{background:linear-gradient(90deg,var(--color-border) 25%,var(--color-surface-hover) 37%,var(--color-border) 63%);background-size:400% 100%;animation:skeleton-shimmer 1.4s ease infinite;border-radius:var(--radius-md)}@keyframes skeleton-shimmer{0%{background-position:100% 50%}to{background-position:0 50%}}.data-table-wrap{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:auto;margin-bottom:var(--space-3)}.data-table{width:100%;border-collapse:collapse;font-size:var(--text-base)}.data-table th{text-align:left;font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--color-text-muted);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border);white-space:nowrap}.data-table td{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border);color:var(--color-text);vertical-align:middle}.data-table tbody tr:last-child td{border-bottom:none}.data-table tbody tr.is-clickable{cursor:pointer}.data-table tbody tr.is-clickable:hover{background:var(--color-surface-hover)}.record-list{display:flex;flex-direction:column;gap:var(--space-2)}.record-card{display:block;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);text-decoration:none;color:inherit}.record-card__top{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-3)}.record-card__title{font-weight:700;color:var(--color-ink);font-size:var(--text-md)}.record-card__meta{font-size:var(--text-sm);color:var(--color-text-muted);margin-top:2px}.record-card__sub{font-size:var(--text-xs);color:var(--color-text-subtle);margin-top:2px}.record-card__badges{display:flex;flex-direction:column;gap:4px;align-items:flex-end;flex:none}.filter-toolbar{display:flex;gap:var(--space-2);align-items:center;margin-bottom:var(--space-3);flex-wrap:wrap}.filter-toolbar__search{flex:1 1 220px;min-width:0}.filter-panel{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--space-3)}.filter-panel .field{margin-bottom:0}@media (max-width: 767px){.filter-panel{grid-template-columns:1fr 1fr}}.stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-3);margin-bottom:var(--space-3)}@media (min-width: 1024px){.stat-grid{grid-template-columns:repeat(4,1fr)}}.stat-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4)}.stat-card--alert{border-color:#fecaca;background:var(--color-danger-bg)}.stat-card__label{font-size:var(--text-xs);color:var(--color-text-muted);font-weight:600}.stat-card__value{font-size:22px;font-weight:700;color:var(--color-ink);margin-top:4px}.stat-card--alert .stat-card__value{color:var(--color-danger)}.alert-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-md);background:var(--color-warning-bg);color:var(--color-warning);font-size:var(--text-sm);text-decoration:none;margin-bottom:var(--space-2)}.alert-item:last-child{margin-bottom:0}.alert-item__icon{flex:none}.alert-item__text{flex:1;color:var(--color-text)}.alert-item__count{font-weight:700;color:inherit}.contact-actions{display:flex;gap:var(--space-2);margin-top:var(--space-3)}.contact-actions .btn{flex:1}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a73;display:flex;align-items:center;justify-content:center;padding:var(--space-4);z-index:var(--z-modal)}.modal{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);width:100%;max-width:420px;max-height:calc(100vh - var(--space-8));overflow-y:auto;padding:var(--space-5)}.modal__title{font-size:var(--text-lg);font-weight:700;color:var(--color-ink);margin-bottom:var(--space-2)}.modal__body{font-size:var(--text-base);color:var(--color-text-muted);margin-bottom:var(--space-5)}.modal__actions{display:flex;justify-content:flex-end;gap:var(--space-2)}@media (max-width: 480px){.modal__actions{flex-direction:column-reverse}.modal__actions .btn{width:100%}}.kpi-grid{display:grid;grid-template-columns:1fr;gap:var(--space-3)}@media (min-width: 768px){.kpi-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1280px){.kpi-grid{grid-template-columns:repeat(3,1fr)}}.kpi-card__rank{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:var(--radius-pill);background:var(--color-neutral-bg);color:var(--color-neutral);font-size:11px;font-weight:700;flex:none}.kpi-card__rank--top{background:#fef3c7;color:#92400e}.pagination{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap;padding:var(--space-3) 0;margin-top:var(--space-2);border-top:1px solid var(--color-border)}.pagination__info{font-size:var(--text-sm);color:var(--color-text-muted)}.pagination__controls{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap}.pagination__size{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--color-text-muted)}.pagination__nav{display:flex;align-items:center;gap:var(--space-2)}.pagination__page{font-size:var(--text-sm);color:var(--color-text);white-space:nowrap}@media (max-width: 480px){.pagination{flex-direction:column;align-items:stretch}.pagination__controls{justify-content:space-between}}.checkin-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-6) var(--space-4);text-align:center}.checkin-btn{position:relative;width:156px;height:156px;border-radius:50%;border:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:var(--color-primary);color:#fff;font-family:inherit;transition:background .15s ease,transform .1s ease;-webkit-tap-highlight-color:transparent}.checkin-btn:active:not(:disabled){transform:scale(.96)}.checkin-btn:disabled{cursor:default}.checkin-btn--done{background:var(--color-success)}.checkin-btn__label{font-size:15px;font-weight:700}.checkin-btn__time{font-size:12px;opacity:.85}.checkin-btn__pulse{position:absolute;top:-8px;right:-8px;bottom:-8px;left:-8px;border-radius:50%;border:2px solid var(--color-primary);opacity:0;animation:checkin-pulse 2.2s ease-out infinite}@keyframes checkin-pulse{0%{transform:scale(.92);opacity:.55}70%{transform:scale(1.18);opacity:0}to{opacity:0}}@media (prefers-reduced-motion: reduce){.checkin-btn__pulse{animation:none;display:none}}.checkin-meta{font-size:13px;color:var(--color-text-muted);margin-top:var(--space-4)}.sticky-action-bar{position:sticky;bottom:0;left:0;right:0;background:var(--color-surface);border-top:1px solid var(--color-border);padding:var(--space-3) var(--space-4);display:flex;gap:var(--space-2);margin:var(--space-4) calc(-1 * var(--space-4)) 0;box-shadow:0 -2px 8px #0f172a0d}.sticky-action-bar .btn{flex:1}.shell{min-height:100vh;min-height:100dvh;background:var(--color-surface-sunken);display:flex;flex-direction:column}.shell-topbar{position:sticky;top:0;flex-shrink:0;z-index:var(--z-topbar);height:var(--shell-topbar-height);display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:0 var(--space-4);background:var(--color-surface);border-bottom:1px solid var(--color-border)}.shell-topbar__left{display:flex;align-items:center;gap:var(--space-3);min-width:0}.shell-topbar__menu-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);cursor:pointer;flex:none}.shell-topbar__brand{display:flex;align-items:center;gap:var(--space-2);min-width:0}.shell-topbar__logo{width:36px;height:36px;display:flex;align-items:center;justify-content:center;flex:none}.shell-topbar__title{font-weight:700;font-size:var(--text-md);color:var(--color-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.shell-topbar__role{font-size:var(--text-xs);color:var(--color-text-muted);white-space:nowrap}.shell-topbar__user{display:flex;align-items:center;gap:var(--space-3);flex:none}.shell-topbar__user-name{font-size:var(--text-sm);font-weight:600;color:var(--color-text);text-align:right}.shell-topbar__user-role{font-size:var(--text-xs);color:var(--color-text-muted);text-align:right}.shell-topbar__logout{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--color-border-strong);background:var(--color-surface);color:var(--color-text);border-radius:var(--radius-md);padding:0 var(--space-3);height:36px;font-size:var(--text-sm);font-weight:600;cursor:pointer}.shell-topbar__logout:hover{background:var(--color-surface-hover)}.shell-body{display:flex;flex:1;min-height:0}.shell-sidebar{display:none}.shell-main{flex:1;min-width:0;padding:var(--space-6) var(--space-6) var(--space-10)}@media (min-width: 1024px){.shell-sidebar{display:flex;flex-direction:column;width:var(--shell-sidebar-width);flex:none;height:calc(100vh - var(--shell-topbar-height));position:sticky;top:var(--shell-topbar-height);border-right:1px solid var(--color-border);background:var(--color-surface);padding:var(--space-4) var(--space-3);overflow-y:auto}.shell-main{padding:var(--space-6) var(--space-8) var(--space-10);max-width:1200px}}.shell-nav-group{margin-bottom:var(--space-4)}.shell-nav-group__label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-subtle);padding:0 var(--space-3);margin-bottom:var(--space-2)}.shell-nav-item{display:flex;align-items:center;gap:var(--space-3);padding:9px var(--space-3);border-radius:var(--radius-md);color:var(--color-text);text-decoration:none;font-size:var(--text-base);font-weight:500;margin-bottom:2px}.shell-nav-item:hover{background:var(--color-surface-hover)}.shell-nav-item.is-active{background:var(--color-primary-light);color:var(--color-primary-dark);font-weight:700}.shell-nav-item svg{flex:none}.shell-drawer-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a73;z-index:var(--z-drawer)}.shell-drawer{position:fixed;top:0;left:0;bottom:0;width:84%;max-width:300px;background:var(--color-surface);z-index:var(--z-drawer);padding:var(--space-4) var(--space-3);overflow-y:auto;box-shadow:var(--shadow-md)}.shell-drawer__header{display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-3) var(--space-4)}.shell-drawer__close{width:36px;height:36px;border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-surface);display:flex;align-items:center;justify-content:center;cursor:pointer}@media (min-width: 1024px){.shell-drawer-overlay,.shell-drawer{display:none}}.shell-bottomnav{position:sticky;bottom:0;flex-shrink:0;z-index:var(--z-bottomnav);display:flex;background:var(--color-surface);border-top:1px solid var(--color-border);padding-bottom:env(safe-area-inset-bottom,0)}.shell-bottomnav__item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:8px 4px;min-height:var(--shell-bottomnav-height);color:var(--color-text-muted);text-decoration:none;font-size:11px;font-weight:600}.shell-bottomnav__item.is-active{color:var(--color-primary)}.shell-bottomnav__item--more{color:var(--color-text-muted);background:none;border:none;cursor:pointer;font-family:inherit}@media (min-width: 1024px){.shell-bottomnav{display:none}}@media (max-width: 1023px){.shell-main{padding:var(--space-4) var(--space-4) calc(var(--shell-bottomnav-height) + var(--space-6))}}@media print{.print-hide,header,nav{display:none!important}#invoice-print-area{padding:0!important;max-width:100%!important}body{background:#fff!important}}