:root{--color-bg: #ffffff;--color-surface: #f9fafb;--color-surface-2: #f3f4f6;--color-surface-3: #e5e7eb;--color-border: #e5e7eb;--color-border-dark: #d1d5db;--color-primary: #2563eb;--color-primary-hover: #1d4ed8;--color-primary-light: #eff6ff;--color-primary-border: #bfdbfe;--color-accent: #059669;--color-accent-light: #ecfdf5;--color-accent-border: #a7f3d0;--color-warning: #d97706;--color-warning-light: #fffbeb;--color-danger: #dc2626;--color-danger-light: #fef2f2;--color-danger-border: #fecaca;--color-text: #111827;--color-text-secondary: #374151;--color-text-muted: #6b7280;--color-text-placeholder: #9ca3af;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .05);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .08), 0 1px 2px rgba(0, 0, 0, .04);--shadow-md: 0 4px 6px rgba(0, 0, 0, .07), 0 2px 4px rgba(0, 0, 0, .04);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .08), 0 4px 6px rgba(0, 0, 0, .04);--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;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px;--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-size-xs: 11px;--font-size-sm: 13px;--font-size-base: 15px;--font-size-lg: 17px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 30px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-base: 1.5;--transition-fast: .15s ease;--transition-base: .2s ease;--navbar-height: 60px;--page-max-width: 480px;--page-padding: var(--space-4);--header-height: 52px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{height:100%;-webkit-tap-highlight-color:transparent}body{height:100%;font-family:var(--font-family);font-size:var(--font-size-base);color:var(--color-text);background:var(--color-bg);line-height:var(--line-height-base);-webkit-font-smoothing:antialiased;overflow-x:hidden}#app{height:100dvh;display:flex;flex-direction:column;max-width:var(--page-max-width);margin:0 auto;background:var(--color-bg);overflow:hidden;border-left:1px solid var(--color-border);border-right:1px solid var(--color-border)}#page-container{flex:1;overflow-y:auto;overflow-x:hidden;padding-bottom:var(--navbar-height);background:var(--color-bg)}#page-container::-webkit-scrollbar{width:4px}#page-container::-webkit-scrollbar-track{background:transparent}#page-container::-webkit-scrollbar-thumb{background:var(--color-border-dark);border-radius:var(--radius-full)}.page{min-height:100%;animation:pageEnter .18s ease}@keyframes pageEnter{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.page-header{position:sticky;top:0;z-index:10;background:var(--color-bg);border-bottom:1px solid var(--color-border);padding:0 var(--page-padding);display:flex;align-items:center;justify-content:space-between;height:var(--header-height)}.page-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text)}.page-content{padding:var(--page-padding)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);border:1px solid transparent;border-radius:var(--radius-md);font-family:var(--font-family);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast);text-decoration:none;white-space:nowrap;user-select:none;-webkit-user-select:none;line-height:1}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.4;pointer-events:none}.btn-primary{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.btn-primary:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover)}.btn-accent{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.btn-accent:hover{opacity:.9}.btn-ghost{background:transparent;color:var(--color-text-secondary);border-color:var(--color-border-dark)}.btn-ghost:hover{background:var(--color-surface-2)}.btn-danger{background:var(--color-danger);color:#fff;border-color:var(--color-danger)}.btn-danger:hover{opacity:.9}.btn-warning{background:var(--color-warning);color:#fff;border-color:var(--color-warning)}.btn-sm{padding:6px 12px;font-size:var(--font-size-sm);border-radius:var(--radius-sm)}.btn-lg{padding:14px var(--space-6);font-size:var(--font-size-lg);border-radius:var(--radius-lg);font-weight:var(--font-weight-semibold)}.btn-full{width:100%}.btn-icon{padding:var(--space-2);border-radius:var(--radius-sm)}.quick-btns-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-2)}.quick-btn{padding:10px 4px;background:var(--color-surface);border:1px solid var(--color-border-dark);border-radius:var(--radius-md);color:var(--color-text-secondary);font-family:var(--font-family);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast);text-align:center;user-select:none;-webkit-user-select:none;line-height:1.2}.quick-btn:hover{background:var(--color-primary-light);border-color:var(--color-primary);color:var(--color-primary)}.quick-btn:active{transform:scale(.95)}.quick-btn.minus{color:var(--color-danger);border-color:var(--color-danger-border)}.quick-btn.minus:hover{background:var(--color-danger-light);border-color:var(--color-danger)}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4)}.card-white{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4);box-shadow:var(--shadow-xs)}.form-group{margin-bottom:var(--space-4)}.form-label{display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);margin-bottom:6px}.form-input,.form-select,.form-textarea{width:100%;padding:10px var(--space-3);background:var(--color-bg);border:1px solid var(--color-border-dark);border-radius:var(--radius-md);color:var(--color-text);font-family:var(--font-family);font-size:var(--font-size-base);transition:border-color var(--transition-fast),box-shadow var(--transition-fast);outline:none;-moz-appearance:none;appearance:none;-webkit-appearance:none;line-height:1.4}.form-input::placeholder,.form-textarea::placeholder{color:var(--color-text-placeholder)}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #2563eb1a}.form-select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:36px;cursor:pointer}.form-textarea{resize:vertical;min-height:72px}.form-hint{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-top:4px}.form-error{font-size:var(--font-size-xs);color:var(--color-danger);margin-top:4px}.home-job-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-2)}.home-job-card{min-height:52px;padding:10px 12px;border:1px solid var(--color-border-dark);border-radius:var(--radius-md);background:linear-gradient(180deg,var(--color-bg) 0%,var(--color-surface) 100%);text-align:left;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);transition:border-color var(--transition-fast),box-shadow var(--transition-fast),background var(--transition-fast);touch-action:manipulation}.home-job-card:hover{border-color:var(--color-primary-border)}.home-job-card.active{border-color:var(--color-primary);background:linear-gradient(180deg,#f7fbff 0%,var(--color-primary-light) 100%);box-shadow:var(--shadow-xs)}.home-job-main{min-width:0;flex:1}.home-job-title{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:var(--font-weight-semibold);color:var(--color-text)}.home-job-card.active .home-job-title{color:var(--color-primary-hover)}.home-job-dot{width:8px;height:8px;border-radius:var(--radius-full);flex-shrink:0}.home-job-meta{margin-top:2px;padding-left:14px;font-size:var(--font-size-xs);color:var(--color-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.home-job-card.active .home-job-meta{color:var(--color-primary)}.home-job-rate{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-accent);white-space:nowrap}.hour-display{font-size:42px;font-weight:var(--font-weight-bold);color:var(--color-text);text-align:center;line-height:1;padding:var(--space-4) 0;letter-spacing:-1px}.hour-unit{font-size:var(--font-size-xl);font-weight:var(--font-weight-normal);color:var(--color-text-muted);margin-left:4px}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);margin-bottom:var(--space-4)}.stat-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4)}.stat-label{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-bottom:4px;text-transform:uppercase;letter-spacing:.4px;font-weight:var(--font-weight-medium)}.stat-value{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text)}.stat-primary .stat-value{color:var(--color-primary)}.stat-accent .stat-value{color:var(--color-accent)}.stat-sub{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-top:2px}.badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.badge-primary{background:var(--color-primary-light);color:var(--color-primary);border:1px solid var(--color-primary-border)}.badge-accent{background:var(--color-accent-light);color:var(--color-accent);border:1px solid var(--color-accent-border)}.badge-warning{background:var(--color-warning-light);color:var(--color-warning);border:1px solid #fcd34d}.badge-danger{background:var(--color-danger-light);color:var(--color-danger);border:1px solid var(--color-danger-border)}.record-day-group{margin-bottom:var(--space-5)}.record-day-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-2) 0 var(--space-3);border-bottom:1px solid var(--color-border);margin-bottom:var(--space-2)}.record-day-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-secondary)}.record-day-total{font-size:var(--font-size-sm);color:var(--color-accent);font-weight:var(--font-weight-semibold)}.record-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-3);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);margin-bottom:var(--space-2);cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast)}.record-item:hover{background:var(--color-surface);border-color:var(--color-border-dark)}.record-item-info{flex:1;min-width:0}.record-item-job{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text);margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.record-item-time{font-size:var(--font-size-xs);color:var(--color-text-muted)}.record-item-hours{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-primary);white-space:nowrap}.record-item-wage{font-size:var(--font-size-xs);color:var(--color-accent);text-align:right}.record-item-actions{display:flex;gap:4px;opacity:0;transition:opacity var(--transition-fast)}.record-item:hover .record-item-actions{opacity:1}@keyframes recordHighlight{0%{background:var(--color-primary-light);border-color:var(--color-primary)}to{background:var(--color-bg);border-color:var(--color-border)}}.record-highlight{animation:recordHighlight .8s ease}.job-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);margin-bottom:var(--space-3);transition:background var(--transition-fast),box-shadow var(--transition-fast)}.job-item:hover{background:var(--color-surface);box-shadow:var(--shadow-sm)}.job-avatar{width:42px;height:42px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-base);font-weight:var(--font-weight-bold);color:#fff;flex-shrink:0}.job-info{flex:1;min-width:0}.job-name{font-weight:var(--font-weight-semibold);color:var(--color-text);margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.job-wage{font-size:var(--font-size-sm);color:var(--color-accent)}.job-deleted{opacity:.45}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-3)}.section-title{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.4px}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-12) var(--space-6);text-align:center;gap:var(--space-3)}.empty-icon{font-size:40px;opacity:.35}.empty-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-secondary)}.empty-desc{font-size:var(--font-size-sm);color:var(--color-text-muted);max-width:240px}.divider{height:1px;background:var(--color-border);margin:var(--space-4) 0}.status-bar{height:28px;display:flex;align-items:center;justify-content:center;gap:var(--space-2);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.status-bar.offline{background:#fffbeb;color:var(--color-warning);border-bottom:1px solid #fcd34d}.status-bar.online{display:none}.status-dot{width:6px;height:6px;border-radius:50%;background:currentColor}#modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;z-index:100;display:flex;align-items:flex-end;justify-content:center;opacity:0;pointer-events:none;transition:opacity var(--transition-base)}#modal-overlay.active{opacity:1;pointer-events:all}.modal{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-xl) var(--radius-xl) 0 0;padding:var(--space-6);width:100%;max-width:var(--page-max-width);max-height:85vh;overflow-y:auto;transform:translateY(16px);transition:transform var(--transition-base);box-shadow:var(--shadow-lg)}#modal-overlay.active .modal{transform:translateY(0)}.modal-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin-bottom:var(--space-2)}.modal-desc{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--space-5);line-height:1.6;white-space:pre-line}.modal-actions{display:flex;flex-direction:column;gap:var(--space-2);margin-top:var(--space-2)}#toast-container{position:fixed;top:var(--space-4);left:50%;transform:translate(-50%);z-index:200;display:flex;flex-direction:column;gap:var(--space-2);pointer-events:none;max-width:calc(var(--page-max-width) - 32px);width:calc(100% - 32px)}.toast{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);box-shadow:var(--shadow-md);animation:toastIn .25s ease}@keyframes toastIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes toastOut{to{opacity:0;transform:translateY(-8px)}}.toast-out{animation:toastOut .2s ease forwards}.toast-success{background:#f0fdf4;color:#166534;border:1px solid #bbf7d0}.toast-warning{background:#fffbeb;color:#92400e;border:1px solid #fcd34d}.toast-error{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}.toast-info{background:#eff6ff;color:#1e40af;border:1px solid #bfdbfe}.toast-icon{font-size:var(--font-size-base)}#navbar{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:var(--page-max-width);height:var(--navbar-height);background:var(--color-bg);border-top:1px solid var(--color-border);display:flex;align-items:stretch;z-index:50}.nav-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;border:none;background:none;color:var(--color-text-muted);font-family:var(--font-family);text-decoration:none;transition:color var(--transition-fast);-webkit-tap-highlight-color:transparent}.nav-item.active{color:var(--color-primary)}.nav-icon{font-size:20px}.nav-label{font-size:10px;font-weight:var(--font-weight-medium)}.settings-list{display:flex;flex-direction:column;gap:var(--space-2)}.settings-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);cursor:pointer;transition:background var(--transition-fast)}.settings-item:hover{background:var(--color-surface)}.settings-item-icon{font-size:20px;width:38px;height:38px;border-radius:var(--radius-md);background:var(--color-surface-2);display:flex;align-items:center;justify-content:center;flex-shrink:0}.settings-item-info{flex:1}.settings-item-title{font-weight:var(--font-weight-medium);color:var(--color-text);margin-bottom:1px}.settings-item-desc{font-size:var(--font-size-sm);color:var(--color-text-muted)}.settings-item-arrow{color:var(--color-text-muted)}.import-table{width:100%;border-collapse:collapse;font-size:var(--font-size-sm)}.import-table th{padding:var(--space-2) var(--space-3);text-align:left;color:var(--color-text-muted);font-weight:var(--font-weight-medium);border-bottom:1px solid var(--color-border);font-size:var(--font-size-xs)}.import-table td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--color-border)}.import-table tr.new{background:var(--color-accent-light)}.import-table tr.conflict{background:var(--color-danger-light)}.chip-tabs{display:flex;gap:var(--space-2);margin-bottom:var(--space-4);overflow-x:auto;scrollbar-width:none;padding-bottom:2px}.chip-tabs::-webkit-scrollbar{display:none}.chip-tab{flex-shrink:0;padding:6px 14px;border-radius:var(--radius-full);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;border:1px solid var(--color-border-dark);background:var(--color-bg);color:var(--color-text-muted);font-family:var(--font-family)}.chip-tab.active{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.minute-display{font-size:48px;font-weight:var(--font-weight-bold);color:var(--color-primary);text-align:center;line-height:1;padding:var(--space-3) 0;letter-spacing:-1px}.minute-unit{font-size:var(--font-size-xl);font-weight:var(--font-weight-normal);color:var(--color-text-muted);margin-left:4px}.view-switcher{display:flex;gap:0;margin-bottom:var(--space-4);background:var(--color-surface-2);border-radius:var(--radius-lg);padding:3px}.view-switch-btn{flex:1;padding:8px 12px;border:none;border-radius:var(--radius-md);background:transparent;color:var(--color-text-muted);font-family:var(--font-family);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast);text-align:center}.view-switch-btn.active{background:var(--color-bg);color:var(--color-primary);box-shadow:var(--shadow-sm);font-weight:var(--font-weight-semibold)}.view-switch-btn:hover:not(.active){color:var(--color-text-secondary)}.hist-trend-card{margin-bottom:var(--space-3);padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-bg)}.hist-trend-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:var(--space-2);gap:var(--space-2)}.hist-trend-title{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text)}.hist-trend-sub{font-size:var(--font-size-xs);color:var(--color-text-muted)}.hist-trend-canvas{position:relative;height:168px;border-radius:var(--radius-md);background:linear-gradient(180deg,#fafbfd,#f3f6fb);border:1px solid var(--color-border);overflow:hidden;padding:8px 10px 2px}.hist-trend-canvas canvas{width:100%;height:100%}.hist-trend-empty{position:absolute;top:0;right:10px;bottom:2px;left:10px;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xs);color:var(--color-text-muted);background:linear-gradient(180deg,#ffffff94,#ffffffc7);pointer-events:none}.hist-trend-axis{display:flex;justify-content:space-between;margin-top:6px;font-size:11px;color:var(--color-text-muted)}.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:var(--space-2)}.cal-header-cell{text-align:center;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-text-muted);padding:6px 0;text-transform:uppercase;letter-spacing:.3px}.cal-cell{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);position:relative;min-height:44px;gap:1px}.cal-cell:hover{background:var(--color-surface-2)}.cal-cell.cal-empty{cursor:default}.cal-cell.cal-empty:hover{background:transparent}.cal-cell-day{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);line-height:1}.cal-cell-hours{font-size:9px;font-weight:var(--font-weight-semibold);color:var(--color-primary);line-height:1;white-space:nowrap}.cal-cell.cal-today{outline:2px solid var(--color-primary);outline-offset:-2px}.cal-cell.cal-today .cal-cell-day{color:var(--color-primary);font-weight:var(--font-weight-bold)}.cal-cell.cal-has-record{cursor:pointer}.cal-cell.cal-has-record:hover{transform:scale(1.05);box-shadow:var(--shadow-sm)}.cal-cell.cal-selected{outline:2px solid var(--color-primary);outline-offset:-2px;background:var(--color-primary-light)!important}.cal-cell.cal-selected .cal-cell-day{color:var(--color-primary);font-weight:var(--font-weight-bold)}.flatpickr-calendar{font-family:var(--font-family)!important;border:1px solid var(--color-border-dark)!important;border-radius:var(--radius-lg)!important;box-shadow:var(--shadow-lg)!important}.flatpickr-time input{color:var(--color-text)!important}.flatpickr-day.selected{background:var(--color-primary)!important;border-color:var(--color-primary)!important}.flatpickr-day:hover{background:var(--color-primary-light)!important}.flatpickr-months .flatpickr-prev-month:hover svg,.flatpickr-months .flatpickr-next-month:hover svg{fill:var(--color-primary)!important}.text-muted{color:var(--color-text-muted)}.text-secondary{color:var(--color-text-secondary)}.text-accent{color:var(--color-accent)}.text-primary{color:var(--color-primary)}.text-danger{color:var(--color-danger)}.text-sm{font-size:var(--font-size-sm)}.text-xs{font-size:var(--font-size-xs)}.text-bold{font-weight:var(--font-weight-bold)}.text-semibold{font-weight:var(--font-weight-semibold)}.text-center{text-align:center}.mt-1{margin-top:var(--space-1)}.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)}.mb-2{margin-bottom:var(--space-2)}.mb-3{margin-bottom:var(--space-3)}.mb-4{margin-bottom:var(--space-4)}.flex{display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}@supports (padding: env(safe-area-inset-bottom)){#navbar{padding-bottom:env(safe-area-inset-bottom);height:calc(var(--navbar-height) + env(safe-area-inset-bottom))}#page-container{padding-bottom:calc(var(--navbar-height) + env(safe-area-inset-bottom))}}