/* ============================================================
   ContentSERP V2 — BASE (reset + typography + focus)
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
}

body {
    font-family: var(--cs-font-family);
    font-size: var(--cs-font-size-md);
    line-height: var(--cs-line-height-normal);
    color: var(--cs-text);
    background: var(--cs-bg);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 { margin: 0 0 var(--cs-space-3); font-weight: 700; line-height: var(--cs-line-height-tight); }
h1 { font-size: var(--cs-font-size-2xl); }
h2 { font-size: var(--cs-font-size-xl); }
h3 { font-size: var(--cs-font-size-lg); }

p { margin: 0 0 var(--cs-space-3); }

a { color: var(--cs-primary); text-decoration: none; }
a:hover { text-decoration: underline; }

code, pre, kbd { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.92em; }
pre { white-space: pre-wrap; word-break: break-word; }

/* Visible keyboard focus — never removed, never color-only */
:focus { outline: none; }
:focus-visible {
    outline: 2px solid var(--cs-primary);
    outline-offset: 2px;
    border-radius: var(--cs-radius-sm);
}

/* Status is never conveyed by color alone — add icon/label in components */
[data-visually-hidden] {
    position: absolute; width: 1px; height: 1px;
    clip: rect(0 0 0 0); clip-path: inset(50%); overflow: hidden; white-space: nowrap;
}

/* Skip link for keyboard users */
.cs-skip-link {
    position: absolute; left: -9999px; top: 0; z-index: 2000;
    background: var(--cs-surface); color: var(--cs-primary);
    padding: var(--cs-space-2) var(--cs-space-4); border-radius: 0 0 var(--cs-radius-md) 0;
    font-weight: 600;
}
.cs-skip-link:focus { left: 0; }

/* Reasonable default scrollbars */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: var(--cs-border-strong); border-radius: 99px; border: 2px solid var(--cs-bg); }
::-webkit-scrollbar-track { background: transparent; }
