// Design tokens — Direction A "Continuity".
// Single source for the web CSS; the Flutter ThemeData in post76-app is generated from the same set.

:root {
    color-scheme: light;

    --bg: #F0F3F7;
    --surface: #FFFFFF;
    --surface2: #EDF2F6;
    --border: #D8DFE8;
    --borderSoft: #E4EAF0;
    --divider: #E8EEF3;
    --hover: #F7FAFC;
    --canvas: #E6EBF0;

    --text: #16202B;
    --muted: #5C6B7A;
    --muted2: #8A99A7;
    --sep: #B7C3CD;

    --primary: #0084AB;
    --primaryStrong: #006B8C;
    --onPrimary: #FFFFFF;
    --accent: #83B735;
    --accentStrong: #5E8722;

    --success: #2E7D32;
    --okBg: #EAF4E5;
    --warning: #B26A00;
    --danger: #C62828;

    --navBg: #16202B;
    --navFg: #DCE5EC;
    --navHover: #243440;

    --avatar: #DCE6EE;
    --ringMember: #C3CDD6;
    --iconBg: #EDF6F9;
    --iconBg2: #F2F7E7;
    --adBg: #E7ECF1;
    --adFg: #7B8A98;
    --phBg: #F2F5F8;
    --phFg: #A9B6C1;

    --chip1Bg: #E1EFF5;
    --chip1Fg: #00607D;
    --chip2Bg: #EEF6E0;
    --chip2Fg: #46671A;
    --chip3Bg: #FBF0DE;
    --chip3Fg: #8A5200;
    --chip4Bg: #EAEFF4;
    --chip4Fg: #45535F;
    --chip5Bg: #FBE9E9;
    --chip5Fg: #B02020;

    --card: 0 1px 2px rgba(22, 32, 43, .04), 0 4px 14px rgba(22, 32, 43, .06);
    --cardHover: 0 4px 10px rgba(22, 32, 43, .08), 0 14px 30px rgba(22, 32, 43, .10);
}

[data-theme="dark"] {
    color-scheme: dark;

    --bg: #0E1519;
    --surface: #151E24;
    --surface2: #1C272F;
    --border: #27343D;
    --borderSoft: #222E37;
    --divider: #212D35;
    --hover: #1A252D;
    --canvas: #080D11;

    --text: #E6EDF3;
    --muted: #93A4B1;
    --muted2: #7E8F9C;
    --sep: #46545F;

    --primary: #2AA7CC;
    --primaryStrong: #5FC4E3;
    --onPrimary: #0E1519;
    --accent: #9BCB4E;
    --accentStrong: #9BCB4E;

    --success: #66BB6A;
    --okBg: #16301B;
    --warning: #E0A030;
    --danger: #EF5350;

    --navBg: #0A1116;
    --navFg: #DCE5EC;
    --navHover: #1B2932;

    --avatar: #22303A;
    --ringMember: #3C4B57;
    --iconBg: #132832;
    --iconBg2: #1C2A14;
    --adBg: #1B262E;
    --adFg: #8497A4;
    --phBg: #1A242B;
    --phFg: #4E606D;

    --chip1Bg: #0E323F;
    --chip1Fg: #7FD3EE;
    --chip2Bg: #1F3116;
    --chip2Fg: #AEDC6A;
    --chip3Bg: #3A2810;
    --chip3Fg: #E8B65C;
    --chip4Bg: #212D35;
    --chip4Fg: #AABAC6;
    --chip5Bg: #3A1A1A;
    --chip5Fg: #F19292;

    --card: 0 1px 2px rgba(0, 0, 0, .40), 0 4px 14px rgba(0, 0, 0, .34);
    --cardHover: 0 4px 10px rgba(0, 0, 0, .46), 0 14px 30px rgba(0, 0, 0, .5);
}