/* =====================================================================
   base.css — element defaults. No classes here, only bare elements.
   ===================================================================== */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    font-family: var(--font);
    font-size: var(--fs-md);
    line-height: 1.5;
    color: var(--c-ink);
    background: var(--c-page);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -.012em;
    color: var(--c-ink);
}

p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }

a {
    color: var(--c-brand);
    text-decoration: none;
    transition: color var(--t-fast) var(--ease);
}
a:hover { color: var(--c-brand-dark); text-decoration: underline; }

strong, b { font-weight: 600; }

code, kbd, samp, pre { font-family: var(--mono); font-size: .875em; }

hr {
    border: 0;
    border-top: 1px solid var(--c-line);
    margin: 20px 0;
    opacity: 1;
}

img, svg { vertical-align: middle; max-width: 100%; }

button { font-family: inherit; }

::selection { background: var(--c-brand-tint); color: var(--c-brand-darker); }

/* Focus is visible for keyboard users and invisible for mouse users,
   which is the only way both groups get what they need. */
:focus { outline: none; }
:focus-visible {
    outline: 2px solid var(--c-brand);
    outline-offset: 2px;
    border-radius: var(--radius-sm);
}

/* -- Scrollbars ------------------------------------------------------
   Styled only where they sit inside our own panels. */
.scroll-y,
.nav-scroll,
.table-wrap { scrollbar-width: thin; scrollbar-color: var(--c-line-strong) transparent; }

.scroll-y::-webkit-scrollbar,
.nav-scroll::-webkit-scrollbar,
.table-wrap::-webkit-scrollbar { width: 9px; height: 9px; }

.scroll-y::-webkit-scrollbar-track,
.nav-scroll::-webkit-scrollbar-track,
.table-wrap::-webkit-scrollbar-track { background: transparent; }

.scroll-y::-webkit-scrollbar-thumb,
.table-wrap::-webkit-scrollbar-thumb {
    background: var(--c-line-strong);
    border-radius: var(--radius-pill);
    border: 2px solid transparent;
    background-clip: content-box;
}

/* -- Shared motion --------------------------------------------------- */
@keyframes rise {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: none; }
}

@keyframes fade {
    from { opacity: 0; }
    to   { opacity: 1; }
}