/* tokens.css — Savvy. Neocities / old-web kawaii: a narrow column on a tiled cloudy
   sky, over-decorated and cute. Pastel everything. Text stays dark-on-light for AA. */

:root {
    /* pastel candy-sky palette */
    --sky:    #cdeafe;
    --sky2:   #e9f6ff;
    --pink:   #ffc1e3;
    --hotpink:#ff8fce;
    --lav:    #ddd0ff;
    --purple: #8a6fd6;
    --mint:   #c3f3da;
    --butter: #fff1bf;
    --peach:  #ffd9c9;

    --ink:   #5b4a7e;   /* soft grape-grey: body text, reads on light */
    --inkb:  #3f3160;   /* headings */
    --paper: #fffdf9;   /* the site panel */
    --white: #ffffff;

    /* tiled sky-with-clouds (data URI; falls back to the sky color if unsupported) */
    --sky-clouds: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='170'><g fill='%23ffffff' opacity='0.9'><ellipse cx='50' cy='52' rx='32' ry='19'/><ellipse cx='76' cy='44' rx='24' ry='16'/><ellipse cx='26' cy='58' rx='19' ry='14'/><ellipse cx='165' cy='126' rx='30' ry='18'/><ellipse cx='187' cy='119' rx='21' ry='14'/><ellipse cx='145' cy='132' rx='17' ry='12'/></g><g fill='%23ffffff'><path d='M172 34l3 8 8 3-8 3-3 8-3-8-8-3 8-3z'/><path d='M44 128l2.4 6 6 2.4-6 2.4-2.4 6-2.4-6-6-2.4 6-2.4z'/></g></svg>");

    --grad-pink: linear-gradient(135deg, #ffc1e3, #ddd0ff);
    --grad-sky:  linear-gradient(135deg, #cdeafe, #c3f3da);

    --bg:        var(--sky);
    --fg:        var(--ink);
    --card-bg:   var(--white);
    --accent:    var(--hotpink);
    --accent-fg: #ffffff;

    /* cute rounded type (loaded in default.hbs) */
    --font-display: "Baloo 2", ui-rounded, system-ui, sans-serif;
    --font-body:    "Quicksand", ui-rounded, system-ui, sans-serif;
    --font-hand:    "Gloria Hallelujah", "Comic Sans MS", cursive;

    --s-1: 8px; --s-2: 16px; --s-3: 24px; --s-4: 32px; --s-5: 48px;

    --radius: 18px;
    --radius-pill: 999px;
    --shadow:  0 8px 22px rgba(138, 111, 214, .22);
    --shadow-sm: 0 4px 10px rgba(138, 111, 214, .18);
    --frame: 4px solid #ffffff;     /* sticker outline */

    --site-w: 760px;                /* the narrow column */
}