/* RingScript site — shared design tokens + navigation.
   Calm over power: one palette, readable type, light & dark. */

:root {
    --bg: #f6f7f9;
    --panel: #ffffff;
    --ink: #24292f;
    --muted: #6a737d;
    --accent: #1a7f5a;
    --accent-soft: #e7f4ee;
    --accent-ink: #ffffff;
    --error: #b42318;
    --border: #d8dee4;
    --gutter-bg: #eef0f3;
    --line-hl: rgba(26, 127, 90, 0.08);
    --sel: rgba(26, 127, 90, 0.22);
    --tok-kw: #9333c9;
    --tok-str: #0a7d4b;
    --tok-num: #b35c00;
    --tok-com: #8b949e;
    --tok-atom: #0b6bcb;
    --tok-fn: #7a4f01;
    --mono: "Cascadia Code", Consolas, "Courier New", monospace;
}
@media (prefers-color-scheme: dark) {
    :root {
        --bg: #14171a;
        --panel: #1c2126;
        --ink: #d9dee3;
        --muted: #8b949e;
        --accent: #3fb984;
        --accent-soft: #17251e;
        --accent-ink: #0c1210;
        --error: #ef6a5a;
        --border: #30363d;
        --gutter-bg: #181d21;
        --line-hl: rgba(63, 185, 132, 0.10);
        --sel: rgba(63, 185, 132, 0.30);
        --tok-kw: #c792ea;
        --tok-str: #7ee2a8;
        --tok-num: #f0a45d;
        --tok-com: #6a737d;
        --tok-atom: #6cb6ff;
        --tok-fn: #e2c08d;
    }
}

/* ------------------------------------------------------- code blocks */
/* Code is always on a dark panel, in both site themes, with one fixed
   syntax palette — readable, consistent, unmistakably "code". */
pre.code, .pane pre, .codedark {
    background: #0d1420 !important;
    color: #d6e2f0;
    border-color: #223047 !important;
}
pre.code .k, .pane pre .k, .codedark .k { color: #c792ea; font-weight: 600; }  /* keywords   */
pre.code .s, .pane pre .s, .codedark .s { color: #7ee2a8; }                    /* strings    */
pre.code .n, .pane pre .n, .codedark .n { color: #f0a45d; }                    /* numbers    */
pre.code .c, .pane pre .c, .codedark .c { color: #7d8b9d; font-style: italic; }/* comments   */
pre.code .a, .pane pre .a, .codedark .a { color: #6cb6ff; }                    /* :atoms     */
pre.code .f, .pane pre .f, .codedark .f { color: #e2c08d; }                    /* functions  */
pre.code .t, .pane pre .t, .codedark .t { color: #7aa2f7; }                    /* html tags  */

/* (single-page site: the Playground is the site — no nav needed) */