:root {
    --black: #000000;
    --ink: #111111;
    --graphite: #2b2b2b;
    --silver: #c0c0c0;
    --silver-light: #e7e7e7;
    --off-white: #f7f7f7;
    --white: #ffffff;
}

body {
    background: var(--off-white);
    color: var(--ink);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.navbar-geek {
    background: var(--black);
    border-bottom: 1px solid #2a2a2a;
}

.brand-mark {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--silver);
    color: var(--white);
    font-weight: 800;
    letter-spacing: -1px;
}

.hero {
    background: var(--white);
    border: 1px solid var(--silver-light);
    box-shadow: 0 12px 36px rgba(0, 0, 0, .05);
}

.eyebrow {
    font-size: .74rem;
    text-transform: uppercase;
    letter-spacing: .18em;
    color: #686868;
    font-weight: 700;
}

.endpoint-card,
.panel-card {
    background: var(--white);
    border: 1px solid var(--silver-light);
    box-shadow: 0 8px 24px rgba(0,0,0,.04);
}

.method {
    display: inline-flex;
    min-width: 54px;
    justify-content: center;
    align-items: center;
    padding: .34rem .55rem;
    border: 1px solid var(--black);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .08em;
}

.method-get {
    background: var(--white);
    color: var(--black);
}

.method-put {
    background: var(--black);
    color: var(--white);
}

.route {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    word-break: break-word;
}

.code-wrap {
    position: relative;
}

pre {
    background: #0d0d0d;
    color: #f5f5f5;
    border: 1px solid #2d2d2d;
    padding: 1rem;
    overflow-x: auto;
    font-size: .86rem;
    margin-bottom: 0;
}

code {
    color: inherit;
}

.inline-code {
    padding: .1rem .35rem;
    border: 1px solid #d5d5d5;
    background: #efefef;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.btn-black {
    background: var(--black);
    color: var(--white);
    border: 1px solid var(--black);
    border-radius: 0;
}

.btn-black:hover,
.btn-black:focus {
    background: #262626;
    color: var(--white);
    border-color: #262626;
}

.btn-silver {
    background: var(--white);
    color: var(--black);
    border: 1px solid var(--silver);
    border-radius: 0;
}

.btn-silver:hover,
.btn-silver:focus {
    background: var(--silver-light);
    color: var(--black);
}

.form-control,
.form-select {
    border-radius: 0;
    border-color: #cfcfcf;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--black);
    box-shadow: 0 0 0 .2rem rgba(0,0,0,.08);
}

.nav-pills .nav-link {
    border-radius: 0;
    color: #444;
}

.nav-pills .nav-link.active {
    background: var(--black);
    color: var(--white);
}

.alert-neutral {
    background: #f0f0f0;
    border: 1px solid #c9c9c9;
    color: #111;
    border-radius: 0;
}

.table-clean > :not(caption) > * > * {
    border-color: #e1e1e1;
}

.sticky-doc-nav {
    position: sticky;
    top: 1rem;
}

footer {
    border-top: 1px solid #d7d7d7;
    color: #666;
}