/* * Base / global styles — reset, document defaults, and app-shell-level rules. * * Applies globally (light DOM). Component-specific styles do NOT belong here; * shared component/primitive styles live in components.css. * * Depends on tokens.css (must be loaded first). */ * { margin: 0; padding: 0; box-sizing: border-box; } /* * Text size preference (PreferencesService sets `data-text-size` on ). * Font-size tokens are all rem, so scaling the root cascades to all token-sized * text. Percentages are relative to the browser default, so the user's OS font * scaling is still respected on top. 'md' is the unset default (100%). */ html[data-text-size='sm'] { font-size: 87.5%; } /* ~14px */ html[data-text-size='md'] { font-size: 100%; } /* ~16px */ html[data-text-size='lg'] { font-size: 118.75%; } /* ~19px */ body { font-family: var(--font-family); font-size: var(--font-size-base); color: var(--text-primary); background: var(--bg-primary); line-height: 1.6; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: hidden; } #main-router-content { min-height: 100vh; width: 100%; position: relative; } /* Smooth animations for page transitions */ @keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } /* Focus styles for accessibility */ *:focus { outline: 2px solid var(--accent-color); outline-offset: 2px; } /* Custom scrollbar for webkit browsers */ ::-webkit-scrollbar { width: 8px; height: 8px; } ::-webkit-scrollbar-track { background: var(--bg-secondary); border-radius: var(--radius-sm); } ::-webkit-scrollbar-thumb { background: var(--border-medium); border-radius: var(--radius-sm); } ::-webkit-scrollbar-thumb:hover { background: var(--border-dark); }