*, *::before, *::after { box-sizing: border-box; }
html { color-scheme: light; scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; min-height: 100vh; background: var(--color-canvas); color: var(--color-ink); font-family: var(--font-body); line-height: 1.5; text-rendering: optimizeLegibility; }
body.is-locked { overflow: hidden; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: var(--color-ink); font-family: var(--font-display); line-height: 1.12; }
h1 { letter-spacing: -.035em; }
p { color: var(--color-muted); }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--color-gold-400); outline-offset: 3px; }
::selection { background: var(--color-gold-200); color: var(--color-ink); }
.skip-link { position: fixed; z-index: 1000; top: .75rem; left: .75rem; padding: .75rem 1rem; border-radius: .75rem; background: var(--color-ink); color: #fff; transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.page-shell { width: min(100% - 2rem, 1440px); margin-inline: auto; }
.app-loading { position: fixed; z-index: 2000; inset: 0; display: grid; place-content: center; justify-items: center; gap: 1rem; background: radial-gradient(circle at 50% 35%, #fff, #e1f5ee 70%); color: var(--color-teal-900); font-weight: 700; }
.loading-paw { display: grid; width: 4.5rem; height: 4.5rem; place-items: center; border-radius: 50%; background: #fff; box-shadow: var(--shadow-md); font-size: 2rem; animation: loading-hop 1.2s ease-in-out infinite; }
.noscript-message { position: fixed; z-index: 3000; inset: auto 1rem 1rem; padding: 1rem; border-radius: 1rem; background: var(--color-danger); color: white; text-align: center; }
@keyframes loading-hop { 0%, 100% { transform: translateY(0) rotate(-5deg); } 50% { transform: translateY(-12px) rotate(5deg); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }
.reduce-motion *, .reduce-motion *::before, .reduce-motion *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
.check-field.is-invalid { border-radius: .7rem; outline: 2px solid var(--color-danger); outline-offset: 4px; }
