/* Base styles */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-family-base);font-size:var(--font-size-body);line-height:var(--line-height-body);color:var(--color-neutral-900);background:var(--color-neutral-100)}
.hidden{display:none!important}
.auth-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.auth-actions .btn{padding:.6rem 1rem;border-radius:10px;border:0;font-weight:600}
.auth-actions .auth-badge{font-size:.95rem;opacity:.9}
.auth-actions__hint{margin:0;margin-right:auto;font-size:.95rem;color:var(--color-neutral-700)}

@media (max-width:768px){
  .auth-actions{flex-direction:column;align-items:stretch}
  .auth-actions .btn{width:100%}
  .auth-actions .auth-badge{width:100%;text-align:center}
}

@media (min-width:769px){
  .auth-actions{justify-content:flex-end}
  header .auth-actions{margin-left:auto}
}

h1{font-size:var(--fs-h1);line-height:1.2;margin:var(--space-6) 0 var(--space-4)}
h2{font-size:var(--fs-h2);line-height:1.25;margin:var(--space-6) 0 var(--space-4)}
h3{font-size:var(--fs-h3);line-height:1.3;margin:var(--space-5) 0 var(--space-3)}
h4{font-size:var(--fs-h4)}
h5{font-size:var(--fs-h5)}
h6{font-size:var(--fs-h6)}
p{margin:0 0 var(--space-4)}
small,.caption{font-size:14px;color:var(--color-neutral-600)}

img,video,iframe{max-width:100%;height:auto;display:block}

a{color:var(--color-accent-600);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:3px solid var(--color-accent-600);outline-offset:2px;border-radius:6px}

/* Skip link for accessibility (keyboard navigation) */
.skip-link{position:absolute;top:-40px;left:0;z-index:10000;padding:0.75rem 1.5rem;background:var(--color-accent-600,#0ea5e9);color:white;font-weight:600;text-decoration:none;border-radius:0 0 4px 0;transition:top 0.2s ease-in-out;box-shadow:0 4px 6px rgba(0,0,0,0.2)}
.skip-link:focus{top:0;outline:3px solid #fff;outline-offset:2px}
.skip-link:hover{background:var(--color-accent-700,#0284c7);text-decoration:none}
