/* Page chrome wears the app's Eclipse theme: its paper and ink, verbatim. */
:root {
    --bg: #15161a;
    --ink: #ececf0;
    --body: #c9c9cf;
    --muted: #8f8f96;
    --line: #26272c;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background: var(--bg);
    color: var(--ink);
    font-family: "TikTok Sans", -apple-system, "Helvetica Neue", sans-serif;
    -webkit-font-smoothing: antialiased;
    min-height: 100svh;
    display: flex;
    flex-direction: column;
}

a {
    color: var(--muted);
    text-decoration: none;
    border-bottom: 1px solid var(--line);
    transition: color 0.15s ease;
}

a:hover {
    color: var(--ink);
}

/* Landing */

.hero {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 48px 24px;
}

/* Displayed smaller than its internal 300px field: the shader keeps app-proportioned
   band constants and just renders supersampled. Transparent composite, so the empty
   field can overlap neighbors harmlessly. */
.blob-canvas {
    width: 180px;
    height: 180px;
    margin: -24px 0 -30px;
    pointer-events: none;
}

.hero h1 {
    font-size: 44px;
    font-weight: 800;
    letter-spacing: 0.06em;
}

.tagline {
    margin-top: 12px;
    font-size: 18px;
    color: var(--body);
}

.sub {
    margin-top: 6px;
    font-size: 14px;
    color: var(--muted);
}

footer {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
    align-items: center;
    justify-content: center;
    padding: 28px 24px;
    font-size: 13px;
    color: var(--muted);
}

/* Documents */

.doc {
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
    padding: 56px 24px 96px;
}

.back {
    display: inline-block;
    margin-bottom: 32px;
    font-size: 14px;
}

.doc h1 {
    font-size: 28px;
    font-weight: 800;
}

.updated {
    margin: 10px 0 28px;
    font-size: 13px;
    line-height: 1.6;
    color: var(--muted);
}

.doc h2 {
    margin: 34px 0 8px;
    font-size: 17px;
    font-weight: 500;
}

.doc p,
.doc li {
    font-size: 15px;
    line-height: 1.65;
    color: var(--body);
}

.doc p + p {
    margin-top: 12px;
}

.doc ul {
    padding-left: 20px;
    margin: 8px 0;
}

.doc li + li {
    margin-top: 6px;
}
