/*
 * ADVx color scales — Radix Colors shape (12 steps + alpha), one declaration
 * per token via light-dark(). Base scales are Radix "amber" and "sand"
 * (https://www.radix-ui.com/colors); steps marked (pinned) diverge from stock
 * to preserve the ADVx brand amber and the map-matched dark neutrals:
 *
 *   amber-9/10/11         brand #ffbf00 + the pre-migration hover/text ambers
 *   gray-1..5 dark        protomaps "earth" #1f1f1f family + "buffer" #34373d
 *                         (the navigator map background — the page/map seam
 *                         must stay invisible in dark mode)
 *   gray-11/12 dark       the muted #999 / #e4e4e4 text greys
 *
 * Step roles (Radix): 1-2 app/subtle background · 3-5 component states
 * · 6-8 borders/focus · 9-10 solid accent · 11-12 text.
 *
 * This file must be linked first: it declares the document layer order.
 */
@layer reset, tokens, base, components, pages;

@layer tokens {
    :root {
        /* ── Amber (accent) ── */
        --amber-1: light-dark(#fefdfb, #16120c);
        --amber-2: light-dark(#fefbe9, #1d180f);
        --amber-3: light-dark(#fff7c2, #302008);
        --amber-4: light-dark(#ffee9c, #3f2700);
        --amber-5: light-dark(#fbe577, #4d3000);
        --amber-6: light-dark(#f3d673, #5c3d05);
        --amber-7: light-dark(#e9c162, #714f19);
        --amber-8: light-dark(#e2a336, #8f6424);
        --amber-9: #ffbf00; /* (pinned) brand, both themes */
        --amber-10: light-dark(#e8ae01, #fecc63); /* (pinned) hover */
        --amber-11: light-dark(#876400, #c79400); /* (pinned) amber text */
        --amber-12: light-dark(#4f3422, #ffe7b3);

        --amber-a1: light-dark(#c0800004, #e63c0006);
        --amber-a2: light-dark(#f4d10016, #fd9b000d);
        --amber-a3: light-dark(#ffde003d, #fa820022);
        --amber-a4: light-dark(#ffd40063, #fc820032);
        --amber-a5: light-dark(#f8cf0088, #fd8b0041);
        --amber-a6: light-dark(#eab5008c, #fd9b0051);
        --amber-a7: light-dark(#dc9b009d, #ffab2567);
        --amber-a8: light-dark(#da8a00c9, #ffae3587);
        --amber-a9: light-dark(#ffb300c2, #ffbf00);
        --amber-a10: light-dark(#ffb300e7, #fecc63);
        --amber-a11: light-dark(#876400, #c79400);
        --amber-a12: light-dark(#341500dd, #ffe7b3);

        /* ── Gray (neutral, warm "sand") ── */
        --gray-1: light-dark(#fdfdfc, #1f1f1f); /* (pinned dark) map earth */
        --gray-2: light-dark(#f9f9f8, #262626); /* (pinned dark) card bg */
        --gray-3: light-dark(#f1f0ef, #2b2b2b); /* (pinned dark) sectioning */
        --gray-4: light-dark(#e9e8e6, #313131);
        --gray-5: light-dark(#e2e1de, #34373d); /* (pinned dark) map buffer */
        --gray-6: light-dark(#dad9d6, #3d3d3a);
        --gray-7: light-dark(#cfceca, #4a4a47);
        --gray-8: light-dark(#bcbbb5, #62605b);
        --gray-9: light-dark(#8d8d86, #6f6d66);
        --gray-10: light-dark(#82827c, #7c7b74);
        --gray-11: light-dark(#63635e, #999999); /* (pinned dark) muted text */
        --gray-12: light-dark(#21201c, #e4e4e4); /* (pinned dark) body text */

        --gray-a1: light-dark(#55550003, #00000000);
        --gray-a2: light-dark(#25250007, #f4f4f309);
        --gray-a3: light-dark(#20100010, #f6f6f513);
        --gray-a4: light-dark(#1f150019, #fefef31b);
        --gray-a5: light-dark(#1f180021, #fbfbeb23);
        --gray-a6: light-dark(#19130029, #fffaed2d);
        --gray-a7: light-dark(#19140035, #fffbed3c);
        --gray-a8: light-dark(#1915014a, #fff9eb57);
        --gray-a9: light-dark(#0f0f0079, #fffae965);
        --gray-a10: light-dark(#0c0c0083, #fffdee73);
        --gray-a11: light-dark(#080800a1, #fffcf4b0);
        --gray-a12: light-dark(#060500e3, #fffffded);
    }
}