/* http://color.soixam.org?hexcombination=complementary&theme=light */
:root{
    --theme-rgb:255,255,255;--theme-contrast-rgb:0,0,0;
    --bg_0-lv_1:#ffffff;
    --bg_0-lv_2:#f7f7f7;
    --bg_0-lv_3:#f0f0f0;
    --bg_0-lv_4:#e8e8e8;
    --bg_0-lv_5:#e0e0e0;
    --bg_0-lv_6:#d9d9d9;
    --bg_0-lv_7:#d1d1d1;
    --bg_0-lv_8:#c9c9c9;
    --bg_0-lv_9:#c2c2c2;
    --bg_0-lv_10:#bababa;
    --el_0-lv_1:#636363;
    --el_0-lv_2:#5e5e5e;
    --el_0-lv_3:#595959;
    --el_0-lv_4:#545454;
    --el_0-lv_5:#4f4f4f;
    --bd_0-lv_1:#4a4a4a;
    --bd_0-lv_2:#454545;
    --bd_0-lv_3:#404040;
    --bd_0-lv_4:#3b3b3b;
    --bd_0-lv_5:#363636;
    --nm_0-lv_1:#2b2b2b;
    --nm_0-lv_2:#242424;
    --nm_0-lv_3:#1c1c1c;
    --nm_0-lv_4:#141414;
    --nm_0-lv_5:#0d0d0d;
    --clr_0-lv_1:#2b2b2b;
    --clr_0-lv_1-nm-lv_1:#b8b8b8;
    --clr_0-lv_1-nm-lv_2:#cfcfcf;
    --clr_0-lv_1-nm-lv_3:#e6e6e6;
    --clr_0-lv_2:#292929;
    --clr_0-lv_2-nm-lv_1:#b5b5b5;
    --clr_0-lv_2-nm-lv_2:#cfcfcf;
    --clr_0-lv_2-nm-lv_3:#e8e8e8;
    --clr_0-lv_3:#262626;
    --clr_0-lv_3-nm-lv_1:#b3b3b3;
    --clr_0-lv_3-nm-lv_2:#cccccc;
    --clr_0-lv_3-nm-lv_3:#e6e6e6;
    --clr_0-lv_4:#242424;
    --clr_0-lv_4-nm-lv_1:#b0b0b0;
    --clr_0-lv_4-nm-lv_2:#c9c9c9;
    --clr_0-lv_4-nm-lv_3:#e3e3e3;
    --clr_0-lv_5:#212121;
    --clr_0-lv_5-nm-lv_1:#ababab;
    --clr_0-lv_5-nm-lv_2:#c7c7c7;
    --clr_0-lv_5-nm-lv_3:#e3e3e3;
    --clr_0-lv_6:#1f1f1f;
    --clr_0-lv_6-nm-lv_1:#ababab;
    --clr_0-lv_6-nm-lv_2:#c7c7c7;
    --clr_0-lv_6-nm-lv_3:#e3e3e3;
    --clr_0-lv_7:#1c1c1c;
    --clr_0-lv_7-nm-lv_1:#a6a6a6;
    --clr_0-lv_7-nm-lv_2:#c4c4c4;
    --clr_0-lv_7-nm-lv_3:#e3e3e3;
    --clr_0-lv_8:#1a1a1a;
    --clr_0-lv_8-nm-lv_1:#a6a6a6;
    --clr_0-lv_8-nm-lv_2:#c4c4c4;
    --clr_0-lv_8-nm-lv_3:#e3e3e3;
    --clr_0-lv_9:#171717;
    --clr_0-lv_9-nm-lv_1:#a3a3a3;
    --clr_0-lv_9-nm-lv_2:#c2c2c2;
    --clr_0-lv_9-nm-lv_3:#e0e0e0;
    --clr_0-lv_10:#141414;
    --clr_0-lv_10-nm-lv_1:#a1a1a1;
    --clr_0-lv_10-nm-lv_2:#bfbfbf;
    --clr_0-lv_10-nm-lv_3:#dedede;
    --red-lv_1:#99001a;
    --red-lv_1-nm-lv_1:#e6e6e6;
    --red-lv_1-nm-lv_2:#ededed;
    --red-lv_1-nm-lv_3:#f5f5f5;
    --red-lv_2:#7a0014;
    --red-lv_2-nm-lv_1:#cccccc;
    --red-lv_2-nm-lv_2:#dedede;
    --red-lv_2-nm-lv_3:#f0f0f0;
    --red-lv_3:#5c000f;
    --red-lv_3-nm-lv_1:#b5b5b5;
    --red-lv_3-nm-lv_2:#cfcfcf;
    --red-lv_3-nm-lv_3:#e8e8e8;
    --red-lv_4:#3d000a;
    --red-lv_4-nm-lv_1:#a6a6a6;
    --red-lv_4-nm-lv_2:#c4c4c4;
    --red-lv_4-nm-lv_3:#e3e3e3;
    --red-lv_5:#1f0005;
    --red-lv_5-nm-lv_1:#9c9c9c;
    --red-lv_5-nm-lv_2:#bdbdbd;
    --red-lv_5-nm-lv_3:#dedede;
    --green-lv_1:#105621;
    --green-lv_1-nm-lv_1:#e6e6e6;
    --green-lv_1-nm-lv_2:#ededed;
    --green-lv_1-nm-lv_3:#f5f5f5;
    --green-lv_2:#0d451a;
    --green-lv_2-nm-lv_1:#cfcfcf;
    --green-lv_2-nm-lv_2:#dedede;
    --green-lv_2-nm-lv_3:#ededed;
    --green-lv_3:#0a3314;
    --green-lv_3-nm-lv_1:#b8b8b8;
    --green-lv_3-nm-lv_2:#cfcfcf;
    --green-lv_3-nm-lv_3:#e6e6e6;
    --green-lv_4:#07220d;
    --green-lv_4-nm-lv_1:#a8a8a8;
    --green-lv_4-nm-lv_2:#c4c4c4;
    --green-lv_4-nm-lv_3:#e0e0e0;
    --green-lv_5:#031107;
    --green-lv_5-nm-lv_1:#9c9c9c;
    --green-lv_5-nm-lv_2:#bdbdbd;
    --green-lv_5-nm-lv_3:#dedede;
    --blue-lv_1:#004b85;
    --blue-lv_1-nm-lv_1:#e6e6e6;
    --blue-lv_1-nm-lv_2:#ededed;
    --blue-lv_1-nm-lv_3:#f5f5f5;
    --blue-lv_2:#003d6b;
    --blue-lv_2-nm-lv_1:#cfcfcf;
    --blue-lv_2-nm-lv_2:#dedede;
    --blue-lv_2-nm-lv_3:#ededed;
    --blue-lv_3:#002e52;
    --blue-lv_3-nm-lv_1:#bababa;
    --blue-lv_3-nm-lv_2:#d1d1d1;
    --blue-lv_3-nm-lv_3:#e8e8e8;
    --blue-lv_4:#002038;
    --blue-lv_4-nm-lv_1:#ababab;
    --blue-lv_4-nm-lv_2:#c7c7c7;
    --blue-lv_4-nm-lv_3:#e3e3e3;
    --blue-lv_5:#00111f;
    --blue-lv_5-nm-lv_1:#9e9e9e;
    --blue-lv_5-nm-lv_2:#bfbfbf;
    --blue-lv_5-nm-lv_3:#e0e0e0;
    --yellow-lv_1:#574700;
    --yellow-lv_1-nm-lv_1:#e3e3e3;
    --yellow-lv_1-nm-lv_2:#ededed;
    --yellow-lv_1-nm-lv_3:#f7f7f7;
    --yellow-lv_2:#473a00;
    --yellow-lv_2-nm-lv_1:#cfcfcf;
    --yellow-lv_2-nm-lv_2:#dedede;
    --yellow-lv_2-nm-lv_3:#ededed;
    --yellow-lv_3:#382e00;
    --yellow-lv_3-nm-lv_1:#bdbdbd;
    --yellow-lv_3-nm-lv_2:#d4d4d4;
    --yellow-lv_3-nm-lv_3:#ebebeb;
    --yellow-lv_4:#292100;
    --yellow-lv_4-nm-lv_1:#adadad;
    --yellow-lv_4-nm-lv_2:#c9c9c9;
    --yellow-lv_4-nm-lv_3:#e6e6e6;
    --yellow-lv_5:#1a1500;
    --yellow-lv_5-nm-lv_1:#a1a1a1;
    --yellow-lv_5-nm-lv_2:#bfbfbf;
    --yellow-lv_5-nm-lv_3:#dedede;
}
/* http://color.soixam.org?hexcombination=complementary&theme=dark */
html.dark-mode{
    --theme-rgb:0,0,0;--theme-contrast-rgb:255,255,255;
    --bg_0-lv_1:#0d0d0d;
    --bg_0-lv_2:#121212;
    --bg_0-lv_3:#171717;
    --bg_0-lv_4:#1c1c1c;
    --bg_0-lv_5:#212121;
    --bg_0-lv_6:#262626;
    --bg_0-lv_7:#2b2b2b;
    --bg_0-lv_8:#303030;
    --bg_0-lv_9:#363636;
    --bg_0-lv_10:#3b3b3b;
    --el_0-lv_1:#858585;
    --el_0-lv_2:#8a8a8a;
    --el_0-lv_3:#8f8f8f;
    --el_0-lv_4:#949494;
    --el_0-lv_5:#999999;
    --bd_0-lv_1:#a6a6a6;
    --bd_0-lv_2:#adadad;
    --bd_0-lv_3:#b5b5b5;
    --bd_0-lv_4:#bdbdbd;
    --bd_0-lv_5:#c4c4c4;
    --nm_0-lv_1:#cfcfcf;
    --nm_0-lv_2:#d9d9d9;
    --nm_0-lv_3:#e3e3e3;
    --nm_0-lv_4:#ededed;
    --nm_0-lv_5:#f7f7f7;
    --clr_0-lv_1:#cfcfcf;
    --clr_0-lv_1-nm-lv_1:#3b3b3b;
    --clr_0-lv_1-nm-lv_2:#262626;
    --clr_0-lv_1-nm-lv_3:#121212;
    --clr_0-lv_2:#d1d1d1;
    --clr_0-lv_2-nm-lv_1:#3d3d3d;
    --clr_0-lv_2-nm-lv_2:#292929;
    --clr_0-lv_2-nm-lv_3:#141414;
    --clr_0-lv_3:#d4d4d4;
    --clr_0-lv_3-nm-lv_1:#3d3d3d;
    --clr_0-lv_3-nm-lv_2:#292929;
    --clr_0-lv_3-nm-lv_3:#141414;
    --clr_0-lv_4:#d6d6d6;
    --clr_0-lv_4-nm-lv_1:#404040;
    --clr_0-lv_4-nm-lv_2:#2b2b2b;
    --clr_0-lv_4-nm-lv_3:#171717;
    --clr_0-lv_5:#d9d9d9;
    --clr_0-lv_5-nm-lv_1:#424242;
    --clr_0-lv_5-nm-lv_2:#2b2b2b;
    --clr_0-lv_5-nm-lv_3:#141414;
    --clr_0-lv_6:#dbdbdb;
    --clr_0-lv_6-nm-lv_1:#424242;
    --clr_0-lv_6-nm-lv_2:#2b2b2b;
    --clr_0-lv_6-nm-lv_3:#141414;
    --clr_0-lv_7:#dedede;
    --clr_0-lv_7-nm-lv_1:#454545;
    --clr_0-lv_7-nm-lv_2:#2e2e2e;
    --clr_0-lv_7-nm-lv_3:#171717;
    --clr_0-lv_8:#e0e0e0;
    --clr_0-lv_8-nm-lv_1:#474747;
    --clr_0-lv_8-nm-lv_2:#303030;
    --clr_0-lv_8-nm-lv_3:#1a1a1a;
    --clr_0-lv_9:#e3e3e3;
    --clr_0-lv_9-nm-lv_1:#474747;
    --clr_0-lv_9-nm-lv_2:#303030;
    --clr_0-lv_9-nm-lv_3:#1a1a1a;
    --clr_0-lv_10:#e6e6e6;
    --clr_0-lv_10-nm-lv_1:#4a4a4a;
    --clr_0-lv_10-nm-lv_2:#303030;
    --clr_0-lv_10-nm-lv_3:#171717;
    --red-lv_1:#ff7a91;
    --red-lv_1-nm-lv_1:#171717;
    --red-lv_1-nm-lv_2:#0f0f0f;
    --red-lv_1-nm-lv_3:#080808;
    --red-lv_2:#ff94a6;
    --red-lv_2-nm-lv_1:#262626;
    --red-lv_2-nm-lv_2:#1a1a1a;
    --red-lv_2-nm-lv_3:#0d0d0d;
    --red-lv_3:#ffadbb;
    --red-lv_3-nm-lv_1:#333333;
    --red-lv_3-nm-lv_2:#212121;
    --red-lv_3-nm-lv_3:#0f0f0f;
    --red-lv_4:#ffc7d0;
    --red-lv_4-nm-lv_1:#404040;
    --red-lv_4-nm-lv_2:#2b2b2b;
    --red-lv_4-nm-lv_3:#171717;
    --red-lv_5:#ffe0e6;
    --red-lv_5-nm-lv_1:#4a4a4a;
    --red-lv_5-nm-lv_2:#303030;
    --red-lv_5-nm-lv_3:#171717;
    --green-lv_1:#25c149;
    --green-lv_1-nm-lv_1:#1c1c1c;
    --green-lv_1-nm-lv_2:#121212;
    --green-lv_1-nm-lv_3:#080808;
    --green-lv_2:#43db66;
    --green-lv_2-nm-lv_1:#303030;
    --green-lv_2-nm-lv_2:#212121;
    --green-lv_2-nm-lv_3:#121212;
    --green-lv_3:#72e48c;
    --green-lv_3-nm-lv_1:#3b3b3b;
    --green-lv_3-nm-lv_2:#262626;
    --green-lv_3-nm-lv_3:#121212;
    --green-lv_4:#a1edb3;
    --green-lv_4-nm-lv_1:#424242;
    --green-lv_4-nm-lv_2:#2b2b2b;
    --green-lv_4-nm-lv_3:#141414;
    --green-lv_5:#d0f6d9;
    --green-lv_5-nm-lv_1:#4d4d4d;
    --green-lv_5-nm-lv_2:#333333;
    --green-lv_5-nm-lv_3:#1a1a1a;
    --blue-lv_1:#3dabff;
    --blue-lv_1-nm-lv_1:#1a1a1a;
    --blue-lv_1-nm-lv_2:#121212;
    --blue-lv_1-nm-lv_3:#0a0a0a;
    --blue-lv_2:#61baff;
    --blue-lv_2-nm-lv_1:#262626;
    --blue-lv_2-nm-lv_2:#1a1a1a;
    --blue-lv_2-nm-lv_3:#0d0d0d;
    --blue-lv_3:#85caff;
    --blue-lv_3-nm-lv_1:#333333;
    --blue-lv_3-nm-lv_2:#212121;
    --blue-lv_3-nm-lv_3:#0f0f0f;
    --blue-lv_4:#a8d9ff;
    --blue-lv_4-nm-lv_1:#3d3d3d;
    --blue-lv_4-nm-lv_2:#292929;
    --blue-lv_4-nm-lv_3:#141414;
    --blue-lv_5:#cce9ff;
    --blue-lv_5-nm-lv_1:#4a4a4a;
    --blue-lv_5-nm-lv_2:#303030;
    --blue-lv_5-nm-lv_3:#171717;
    --yellow-lv_1:#c7a200;
    --yellow-lv_1-nm-lv_1:#1a1a1a;
    --yellow-lv_1-nm-lv_2:#121212;
    --yellow-lv_1-nm-lv_3:#0a0a0a;
    --yellow-lv_2:#ffd105;
    --yellow-lv_2-nm-lv_1:#404040;
    --yellow-lv_2-nm-lv_2:#2b2b2b;
    --yellow-lv_2-nm-lv_3:#171717;
    --yellow-lv_3:#ffdc42;
    --yellow-lv_3-nm-lv_1:#454545;
    --yellow-lv_3-nm-lv_2:#2e2e2e;
    --yellow-lv_3-nm-lv_3:#171717;
    --yellow-lv_4:#ffe880;
    --yellow-lv_4-nm-lv_1:#4a4a4a;
    --yellow-lv_4-nm-lv_2:#303030;
    --yellow-lv_4-nm-lv_3:#171717;
    --yellow-lv_5:#fff3bd;
    --yellow-lv_5-nm-lv_1:#4f4f4f;
    --yellow-lv_5-nm-lv_2:#363636;
    --yellow-lv_5-nm-lv_3:#1c1c1c;
}

/* https://color.soixam.org/?combination=complementary&hex=%23c0392b&theme=light */
:root{
    --bg_1-lv_1:#ffffff;
    --bg_1-lv_2:#fdf7f7;
    --bg_1-lv_3:#fbf0ee;
    --bg_1-lv_4:#f9e8e6;
    --bg_1-lv_5:#f7e0de;
    --bg_1-lv_6:#f6d9d5;
    --bg_1-lv_7:#f4d1cd;
    --bg_1-lv_8:#f2c9c5;
    --bg_1-lv_9:#f0c2bc;
    --bg_1-lv_10:#eebab4;
    --bg_2-lv_1:#ffffff;
    --bg_2-lv_2:#eefafb;
    --bg_2-lv_3:#def5f7;
    --bg_2-lv_4:#cdf0f4;
    --bg_2-lv_5:#bcebf0;
    --bg_2-lv_6:#ace6ec;
    --bg_2-lv_7:#9be1e8;
    --bg_2-lv_8:#8bdce5;
    --bg_2-lv_9:#7ad7e1;
    --bg_2-lv_10:#69d1dd;
    --el_1-lv_1:#b33629;
    --el_1-lv_2:#aa3427;
    --el_1-lv_3:#a23125;
    --el_1-lv_4:#9a2f23;
    --el_1-lv_5:#912c21;
    --bd_1-lv_1:#85281e;
    --bd_1-lv_2:#7d261c;
    --bd_1-lv_3:#74231a;
    --bd_1-lv_4:#6c2119;
    --bd_1-lv_5:#641e17;
    --nm_1-lv_1:#531913;
    --nm_1-lv_2:#43140f;
    --nm_1-lv_3:#320f0b;
    --nm_1-lv_4:#210a08;
    --nm_1-lv_5:#110504;
    --el_2-lv_1:#1b6f79;
    --el_2-lv_2:#1a6b74;
    --el_2-lv_3:#196870;
    --el_2-lv_4:#19646c;
    --el_2-lv_5:#186068;
    --bd_2-lv_1:#145157;
    --bd_2-lv_2:#134d53;
    --bd_2-lv_3:#12494f;
    --bd_2-lv_4:#11454b;
    --bd_2-lv_5:#104147;
    --nm_2-lv_1:#0c3236;
    --nm_2-lv_2:#0a2a2e;
    --nm_2-lv_3:#082325;
    --nm_2-lv_4:#071b1d;
    --nm_2-lv_5:#051315;
    --clr_1-lv_1:#531913;
    --clr_1-lv_1-nm-lv_1:#bababa;
    --clr_1-lv_1-nm-lv_2:#d1d1d1;
    --clr_1-lv_1-nm-lv_3:#e8e8e8;
    --clr_1-lv_2:#4b1711;
    --clr_1-lv_2-nm-lv_1:#b3b3b3;
    --clr_1-lv_2-nm-lv_2:#cccccc;
    --clr_1-lv_2-nm-lv_3:#e6e6e6;
    --clr_1-lv_3:#43140f;
    --clr_1-lv_3-nm-lv_1:#b0b0b0;
    --clr_1-lv_3-nm-lv_2:#c9c9c9;
    --clr_1-lv_3-nm-lv_3:#e3e3e3;
    --clr_1-lv_4:#3a120d;
    --clr_1-lv_4-nm-lv_1:#ababab;
    --clr_1-lv_4-nm-lv_2:#c7c7c7;
    --clr_1-lv_4-nm-lv_3:#e3e3e3;
    --clr_1-lv_5:#320f0b;
    --clr_1-lv_5-nm-lv_1:#a6a6a6;
    --clr_1-lv_5-nm-lv_2:#c4c4c4;
    --clr_1-lv_5-nm-lv_3:#e3e3e3;
    --clr_1-lv_6:#2a0d09;
    --clr_1-lv_6-nm-lv_1:#a1a1a1;
    --clr_1-lv_6-nm-lv_2:#bfbfbf;
    --clr_1-lv_6-nm-lv_3:#dedede;
    --clr_1-lv_7:#210a08;
    --clr_1-lv_7-nm-lv_1:#9e9e9e;
    --clr_1-lv_7-nm-lv_2:#bfbfbf;
    --clr_1-lv_7-nm-lv_3:#e0e0e0;
    --clr_1-lv_8:#190806;
    --clr_1-lv_8-nm-lv_1:#9c9c9c;
    --clr_1-lv_8-nm-lv_2:#bdbdbd;
    --clr_1-lv_8-nm-lv_3:#dedede;
    --clr_1-lv_9:#110504;
    --clr_1-lv_9-nm-lv_1:#999999;
    --clr_1-lv_9-nm-lv_2:#bababa;
    --clr_1-lv_9-nm-lv_3:#dbdbdb;
    --clr_1-lv_10:#080302;
    --clr_1-lv_10-nm-lv_1:#999999;
    --clr_1-lv_10-nm-lv_2:#bababa;
    --clr_1-lv_10-nm-lv_3:#dbdbdb;
    --clr_2-lv_1:#0c3236;
    --clr_2-lv_1-nm-lv_1:#bababa;
    --clr_2-lv_1-nm-lv_2:#d1d1d1;
    --clr_2-lv_1-nm-lv_3:#e8e8e8;
    --clr_2-lv_2:#0b2e32;
    --clr_2-lv_2-nm-lv_1:#b5b5b5;
    --clr_2-lv_2-nm-lv_2:#cfcfcf;
    --clr_2-lv_2-nm-lv_3:#e8e8e8;
    --clr_2-lv_3:#0a2a2e;
    --clr_2-lv_3-nm-lv_1:#b3b3b3;
    --clr_2-lv_3-nm-lv_2:#cccccc;
    --clr_2-lv_3-nm-lv_3:#e6e6e6;
    --clr_2-lv_4:#09262a;
    --clr_2-lv_4-nm-lv_1:#adadad;
    --clr_2-lv_4-nm-lv_2:#c9c9c9;
    --clr_2-lv_4-nm-lv_3:#e6e6e6;
    --clr_2-lv_5:#082325;
    --clr_2-lv_5-nm-lv_1:#ababab;
    --clr_2-lv_5-nm-lv_2:#c7c7c7;
    --clr_2-lv_5-nm-lv_3:#e3e3e3;
    --clr_2-lv_6:#081f21;
    --clr_2-lv_6-nm-lv_1:#a6a6a6;
    --clr_2-lv_6-nm-lv_2:#c4c4c4;
    --clr_2-lv_6-nm-lv_3:#e3e3e3;
    --clr_2-lv_7:#071b1d;
    --clr_2-lv_7-nm-lv_1:#a3a3a3;
    --clr_2-lv_7-nm-lv_2:#c2c2c2;
    --clr_2-lv_7-nm-lv_3:#e0e0e0;
    --clr_2-lv_8:#061719;
    --clr_2-lv_8-nm-lv_1:#a1a1a1;
    --clr_2-lv_8-nm-lv_2:#bfbfbf;
    --clr_2-lv_8-nm-lv_3:#dedede;
    --clr_2-lv_9:#051315;
    --clr_2-lv_9-nm-lv_1:#9e9e9e;
    --clr_2-lv_9-nm-lv_2:#bfbfbf;
    --clr_2-lv_9-nm-lv_3:#e0e0e0;
    --clr_2-lv_10:#040f11;
    --clr_2-lv_10-nm-lv_1:#9c9c9c;
    --clr_2-lv_10-nm-lv_2:#bdbdbd;
    --clr_2-lv_10-nm-lv_3:#dedede;
}
/* https://color.soixam.org/?combination=complementary&hex=%23c0392b&theme=dark */
html.dark-mode{
--bg_1-lv_1:#150605;
--bg_1-lv_2:#1d0907;
--bg_1-lv_3:#250b08;
--bg_1-lv_4:#2e0e0a;
--bg_1-lv_5:#36100c;
--bg_1-lv_6:#3e130e;
--bg_1-lv_7:#471610;
--bg_1-lv_8:#4f1812;
--bg_1-lv_9:#571b14;
--bg_1-lv_10:#601d16;
--bg_2-lv_1:#051315;
--bg_2-lv_2:#061719;
--bg_2-lv_3:#071b1d;
--bg_2-lv_4:#081f21;
--bg_2-lv_5:#082325;
--bg_2-lv_6:#09262a;
--bg_2-lv_7:#0a2a2e;
--bg_2-lv_8:#0b2e32;
--bg_2-lv_9:#0c3236;
--bg_2-lv_10:#0d363a;
--el_1-lv_1:#d86255;
--el_1-lv_2:#da695d;
--el_1-lv_3:#dc7165;
--el_1-lv_4:#de796e;
--el_1-lv_5:#e08076;
--bd_1-lv_1:#e49086;
--bd_1-lv_2:#e6978f;
--bd_1-lv_3:#e79f97;
--bd_1-lv_4:#e9a79f;
--bd_1-lv_5:#ebaea8;
--nm_1-lv_1:#f0c2bc;
--nm_1-lv_2:#f3cdc9;
--nm_1-lv_3:#f6d9d5;
--nm_1-lv_4:#f8e4e2;
--nm_1-lv_5:#fbf0ee;
--el_2-lv_1:#24929e;
--el_2-lv_2:#2699a6;
--el_2-lv_3:#28a1af;
--el_2-lv_4:#2aa9b7;
--el_2-lv_5:#2bb0bf;
--bd_2-lv_1:#2db8c8;
--bd_2-lv_2:#37c2d2;
--bd_2-lv_3:#48c7d5;
--bd_2-lv_4:#59ccd9;
--bd_2-lv_5:#69d1dd;
--nm_2-lv_1:#86dae4;
--nm_2-lv_2:#9fe2e9;
--nm_2-lv_3:#b8e9ef;
--nm_2-lv_4:#d1f1f5;
--nm_2-lv_5:#eaf9fa;
--clr_1-lv_1:#f0c2bc;
--clr_1-lv_1-nm-lv_1:#3b3b3b;
--clr_1-lv_1-nm-lv_2:#262626;
--clr_1-lv_1-nm-lv_3:#121212;
--clr_1-lv_2:#f1c5c1;
--clr_1-lv_2-nm-lv_1:#3b3b3b;
--clr_1-lv_2-nm-lv_2:#262626;
--clr_1-lv_2-nm-lv_3:#121212;
--clr_1-lv_3:#f2c9c5;
--clr_1-lv_3-nm-lv_1:#3d3d3d;
--clr_1-lv_3-nm-lv_2:#292929;
--clr_1-lv_3-nm-lv_3:#141414;
--clr_1-lv_4:#f3cdc9;
--clr_1-lv_4-nm-lv_1:#404040;
--clr_1-lv_4-nm-lv_2:#2b2b2b;
--clr_1-lv_4-nm-lv_3:#171717;
--clr_1-lv_5:#f4d1cd;
--clr_1-lv_5-nm-lv_1:#424242;
--clr_1-lv_5-nm-lv_2:#2b2b2b;
--clr_1-lv_5-nm-lv_3:#141414;
--clr_1-lv_6:#f5d5d1;
--clr_1-lv_6-nm-lv_1:#424242;
--clr_1-lv_6-nm-lv_2:#2b2b2b;
--clr_1-lv_6-nm-lv_3:#141414;
--clr_1-lv_7:#f6d9d5;
--clr_1-lv_7-nm-lv_1:#454545;
--clr_1-lv_7-nm-lv_2:#2e2e2e;
--clr_1-lv_7-nm-lv_3:#171717;
--clr_1-lv_8:#f7dcda;
--clr_1-lv_8-nm-lv_1:#474747;
--clr_1-lv_8-nm-lv_2:#303030;
--clr_1-lv_8-nm-lv_3:#1a1a1a;
--clr_1-lv_9:#f7e0de;
--clr_1-lv_9-nm-lv_1:#4a4a4a;
--clr_1-lv_9-nm-lv_2:#303030;
--clr_1-lv_9-nm-lv_3:#171717;
--clr_1-lv_10:#f8e4e2;
--clr_1-lv_10-nm-lv_1:#4a4a4a;
--clr_1-lv_10-nm-lv_2:#303030;
--clr_1-lv_10-nm-lv_3:#171717;
--clr_2-lv_1:#86dae4;
--clr_2-lv_1-nm-lv_1:#3b3b3b;
--clr_2-lv_1-nm-lv_2:#262626;
--clr_2-lv_1-nm-lv_3:#121212;
--clr_2-lv_2:#8fdde6;
--clr_2-lv_2-nm-lv_1:#3d3d3d;
--clr_2-lv_2-nm-lv_2:#292929;
--clr_2-lv_2-nm-lv_3:#141414;
--clr_2-lv_3:#97dfe7;
--clr_2-lv_3-nm-lv_1:#3d3d3d;
--clr_2-lv_3-nm-lv_2:#292929;
--clr_2-lv_3-nm-lv_3:#141414;
--clr_2-lv_4:#9fe2e9;
--clr_2-lv_4-nm-lv_1:#404040;
--clr_2-lv_4-nm-lv_2:#2b2b2b;
--clr_2-lv_4-nm-lv_3:#171717;
--clr_2-lv_5:#a8e4eb;
--clr_2-lv_5-nm-lv_1:#424242;
--clr_2-lv_5-nm-lv_2:#2b2b2b;
--clr_2-lv_5-nm-lv_3:#141414;
--clr_2-lv_6:#b0e7ed;
--clr_2-lv_6-nm-lv_1:#454545;
--clr_2-lv_6-nm-lv_2:#2e2e2e;
--clr_2-lv_6-nm-lv_3:#171717;
--clr_2-lv_7:#b8e9ef;
--clr_2-lv_7-nm-lv_1:#474747;
--clr_2-lv_7-nm-lv_2:#303030;
--clr_2-lv_7-nm-lv_3:#1a1a1a;
--clr_2-lv_8:#c1ecf1;
--clr_2-lv_8-nm-lv_1:#474747;
--clr_2-lv_8-nm-lv_2:#303030;
--clr_2-lv_8-nm-lv_3:#1a1a1a;
--clr_2-lv_9:#c9eff3;
--clr_2-lv_9-nm-lv_1:#4a4a4a;
--clr_2-lv_9-nm-lv_2:#303030;
--clr_2-lv_9-nm-lv_3:#171717;
--clr_2-lv_10:#d1f1f5;
--clr_2-lv_10-nm-lv_1:#4d4d4d;
--clr_2-lv_10-nm-lv_2:#333333;
--clr_2-lv_10-nm-lv_3:#1a1a1a;
}

:root{

    --border-radius:5px;
    --form-control-fieldset-border-color:var(--bg_0-lv_10);

    --form-control-transition-time:0.2s;
    
    --form-control-font-size:max(16px,1rem);
    --form-control-padding:0.5em;
    --form-control-margin:0.2rem;
    --form-control-height:2.2em;

    --form-control-border-color:var(--bg_0-lv_6);
    
    --form-control-text-color:var(--nm_0-lv_4);

    --form-control-background-color:var(--bg_0-lv_3);
    --form-control-background-color-hover:var(--bg_0-lv_3);
    --form-control-background-color-focus:var(--bg_0-lv_4);
    
    --form-control-button-background-color:var(--bg_0-lv_6);
    --form-control-button-background-color-hover:var(--bg_0-lv_7);
    --form-control-button-background-color-focus:var(--bg_0-lv_8);
    --form-control-button-background-color-active:var(--bg_0-lv_9);

    
    --form-control-button-disabled-background-color:var(--bg_0-lv_7);
    --form-control-button-disabled-color:var(--bg_0-lv_3);
    --form-control-button-disabled-shadow-color:var(--bg_0-lv_10);
    
    --form-control-button-red-text-color:var(--red-lv_1-nm-lv_3);
    --form-control-button-red-background-color:var(--red-lv_1);
    --form-control-button-red-background-color-hover:var(--red-lv_2);
    --form-control-button-red-background-color-focus:var(--red-lv_3);
    --form-control-button-red-background-color-active:var(--red-lv_4);
    
    --form-control-button-green-text-color:var(--green-lv_1-nm-lv_3);
    --form-control-button-green-background-color:var(--green-lv_1);
    --form-control-button-green-background-color-hover:var(--green-lv_2);
    --form-control-button-green-background-color-focus:var(--green-lv_3);
    --form-control-button-green-background-color-active:var(--green-lv_4);
    
    --form-control-button-blue-text-color:var(--blue-lv_1-nm-lv_3);
    --form-control-button-blue-background-color:var(--blue-lv_1);
    --form-control-button-blue-background-color-hover:var(--blue-lv_2);
    --form-control-button-blue-background-color-focus:var(--blue-lv_3);
    --form-control-button-blue-background-color-active:var(--blue-lv_4);

    --form-control-checkbox-border-color:var(--form-control-border-color);
    --form-control-checkbox-checked-color:var(--bd_0-lv_1);
    
    --form-control-checkbox-red-border-color:var(--red-lv_1);
    --form-control-checkbox-red-checked-color:var(--red-lv_1);
    
    --form-control-checkbox-green-border-color:var(--green-lv_1);
    --form-control-checkbox-green-checked-color:var(--green-lv_1);
    
    --form-control-checkbox-blue-border-color:var(--blue-lv_1);
    --form-control-checkbox-blue-checked-color:var(--blue-lv_1);

    --column-base:calc(100% / 24);
    --column-width-1:calc(var(--column-base) * 1);
    --column-width-2:calc(var(--column-base) * 2);
    --column-width-3:calc(var(--column-base) * 3);
    --column-width-4:calc(var(--column-base) * 4);
    --column-width-5:calc(var(--column-base) * 5);
    --column-width-6:calc(var(--column-base) * 6);
    --column-width-7:calc(var(--column-base) * 7);
    --column-width-8:calc(var(--column-base) * 8);
    --column-width-9:calc(var(--column-base) * 9);
    --column-width-10:calc(var(--column-base) * 10);
    --column-width-11:calc(var(--column-base) * 11);
    --column-width-12:calc(var(--column-base) * 12);
    --column-width-13:calc(var(--column-base) * 13);
    --column-width-14:calc(var(--column-base) * 14);
    --column-width-15:calc(var(--column-base) * 15);
    --column-width-16:calc(var(--column-base) * 16);
    --column-width-17:calc(var(--column-base) * 17);
    --column-width-18:calc(var(--column-base) * 18);
    --column-width-19:calc(var(--column-base) * 19);
    --column-width-20:calc(var(--column-base) * 20);
    --column-width-21:calc(var(--column-base) * 21);
    --column-width-22:calc(var(--column-base) * 22);
    --column-width-23:calc(var(--column-base) * 23);
    --column-width-24:calc(var(--column-base) * 24);
}

.color-red{
    color:var(--red-lv_1);
}
.color-green{
    color:var(--green-lv_1);
}
.color-blue{
    color:var(--blue-lv_1);
}
.color-yellow{
    color:var(--yellow-lv_1);
}

.background-red{
    background:var(--red-lv_1);
}
.background-green{
    background:var(--green-lv_1);
}
.background-blue{
    background:var(--blue-lv_1);
}
.background-yellow{
    background:var(--yellow-lv_1);
}

.lowercase{
    text-transform:lowercase;
}
.uppercase{
    text-transform:uppercase;
}
.ellipsis{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

i.sx-spinner{
    display:block;
    width:1em;height:1em;

    background:url('data:image/svg+xml;charset=UTF-8,<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200"><path style="rgba(0,0,0,1)" d="M100-0.25c-10.458,0-18.966,8.508-18.966,18.966S89.542,37.682,100,37.682s18.966-8.508,18.966-18.966S110.458-0.25,100-0.25z M42.524,45.113c0.691,0,1.342-0.27,1.831-0.758c0.489-0.489,0.759-1.14,0.759-1.832c0-0.691-0.27-1.342-0.759-1.831c-0.489-0.489-1.139-0.759-1.831-0.759c-0.692,0-1.342,0.27-1.832,0.759c-1.009,1.009-1.009,2.652,0,3.662C41.182,44.843,41.832,45.113,42.524,45.113z M18.716,95.07c-2.718,0-4.929,2.211-4.929,4.93c0,2.718,2.211,4.929,4.929,4.929c2.718,0,4.93-2.211,4.93-4.929C23.646,97.282,21.434,95.07,18.716,95.07z M42.523,150.208c-1.941,0-3.767,0.756-5.14,2.129c-2.833,2.833-2.833,7.444,0,10.279c1.373,1.373,3.198,2.129,5.14,2.129s3.767-0.756,5.14-2.129s2.129-3.199,2.129-5.141s-0.756-3.767-2.129-5.139C46.29,150.964,44.465,150.208,42.523,150.208z M100,171.676c-5.297,0-9.607,4.31-9.607,9.607s4.31,9.607,9.607,9.607c5.298,0,9.608-4.31,9.608-9.607S105.298,171.676,100,171.676z M157.477,145.528c-3.191,0-6.191,1.243-8.448,3.5c-4.658,4.658-4.658,12.238,0,16.896c2.257,2.256,5.257,3.498,8.448,3.498s6.191-1.242,8.448-3.498c4.658-4.658,4.658-12.238,0-16.896C163.668,146.771,160.668,145.528,157.477,145.528z M181.284,85.713c-7.878,0-14.287,6.409-14.287,14.287s6.409,14.287,14.287,14.287s14.287-6.409,14.287-14.287S189.162,85.713,181.284,85.713z M157.477,59.149c4.441,0,8.616-1.729,11.757-4.869c6.482-6.483,6.482-17.031,0-23.514c-3.141-3.141-7.315-4.87-11.757-4.87s-8.616,1.729-11.757,4.87c-6.482,6.483-6.482,17.031,0,23.514C148.86,57.42,153.035,59.149,157.477,59.149z"/></svg>');
    
    animation:0.8s steps(8) infinite sx-spinner;
    -webkit-animation:0.8s steps(8) infinite sx-spinner;
}
html.dark-mode i.sx-spinner{
    filter:brightness(0) invert(1);
}
@keyframes sx-spinner{
    100%{
        transform:rotate(360deg);
    }
}
@-webkit-keyframes sx-spinner{
    100%{
        transform:rotate(360deg);
    }
}
.sx-visible{
    animation:0.2s linear 0s 1 forwards sx-visible;
    -webkit-animation:0.2s linear 0s 1 forwards sx-visible;
}
@keyframes sx-visible{
    0%{
        opacity:0;
    }
    100%{
        opacity:1;
    }
}
@-webkit-keyframes sx-visible{
    0%{
        opacity:0;
    }
    100%{
        opacity:1;
    }
}
.sx-invisible{
    animation:0.2s linear 0s 1 forwards sx-invisible;
    -webkit-animation:0.2s linear 0s 1 forwards sx-invisible;
}
@keyframes sx-invisible{
    0%{
        opacity:1;
    }
    100%{
        opacity:0;
    }
}
@-webkit-keyframes sx-invisible{
    0%{
        opacity:1;
    }
    100%{
        opacity:0;
    }
}

#noscript-warning::after{
    content:'This application requires JavaScript to function properly. Please enable JavaScript in your browser and reload the page to continue using it.';
    position:fixed;top:0;left:0;z-index:999999999;
    display:flex;align-items:center;justify-content:center;text-align:center;
    width:100vw;height:100vh;box-sizing:border-box;padding:1rem;top:0;left:0;
    background:rgba(0,0,0,0.8);
    color:rgba(255,255,255,1);
    backdrop-filter:blur(5px);
    -webkit-backdrop-filter:blur(5px);
}

html{
    margin:0;padding:0;
    font-family:sans-serif;
    font-size:14px;
    width:100vw;min-height:100vh;
    box-sizing:border-box;
    overflow-x:hidden;
}

body{
    box-sizing:border-box;
    position:relative;z-index:1;
    margin:0;padding:0;
    width:100vw;min-height:100vh;
    overflow-x:hidden;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    line-height:1.6;
    background:var(--bg_0-lv_1);
    color:var(--nm_0-lv_1);
}
body>.page-loader{
    display:none!important;
}

pre,textarea{
    line-height:1.6em;
}

button,input,select,textarea{
    appearance:none;
}

input[type='color'],
input[type='date'],
input[type='datetime'],
input[type='datetime-local'],
input[type='email'],
input[type='month'],
input[type='number'],
input[type='password'],
input[type='search'],
input[type='tel'],
input[type='text'],
input[type='time'],
input[type='url'],
input[type='week'],
select:focus,
textarea {
    color:var(--nm_0-lv_1);
    font-size: max(16px,1rem);
    font-family:inherit;
}

a{
    color:inherit;text-decoration:none;cursor:pointer;
}
.link{
    color:var(--blue-lv_1);cursor:pointer;
}
.link:hover{
    text-decoration:underline;
}

label,button,input[type=button],input[type=reset],input[type=submit]{
    cursor:pointer;
}

h1,h2,h3,h4,h5,h6,p{
    margin:0;padding:0;
}

a{
    color:var(--blue-lv_1);
}
a:hover{
    text-decoration:underline;
}

h1{font-size:1.90rem;}
h2{font-size:1.75rem;}
h3{font-size:1.60rem;}
h4{font-size:1.45rem;}
h5{font-size:1.30rem;}
h6{font-size:1.15rem;}

h1+h1,h2+h1,h3+h1,h4+h1,h5+h1,h6+h1,p+h1{
    padding-top:0.5em;
}

h1+h2,h2+h2,h3+h2,h4+h2,h5+h2,h6+h2,p+h2{
    padding-top:0.5em;
}

h1+h3,h2+h3,h3+h3,h4+h3,h5+h3,h6+h3,p+h3{
    padding-top:0.5em;
}

h1+h4,h2+h4,h3+h4,h4+h4,h5+h4,h6+h4,p+h4{
    padding-top:0.5em;
}

h1+h5,h2+h5,h3+h5,h4+h5,h5+h5,h6+h5,p+h5{
    padding-top:0.5em;
}

h1+h6,h2+h6,h3+h6,h4+h6,h5+h6,h6+h6,p+h6{
    padding-top:0.5em;
}

h1+p,h2+p,h3+p,h4+p,h5+p,h6+p,p+p{
    padding-top:0.5em;
}

form{
    display:block;
}

fieldset{
    margin:0;padding:1rem;
    border:1px solid var(--form-control-fieldset-border-color);
}
fieldset legend{
    color:var(--form-control-text-color);
    font-weight:bold;
}

.relative{
    position:relative;z-index:1;
}

.flex{
    display:flex;
    flex-direction:row;
}

.flex-row{
    display:flex;
    flex-direction:row;
}

.flex-row-reverse{
    display:flex;
    flex-direction:row-reverse;
}

.flex-column{
    display:flex;
    flex-direction:column;
}

.flex-column-reverse{
    display:flex;
    flex-direction:column-reverse;
}



.sx-note{
    padding:1rem;
    border-radius:var(--border-radius);
}
.sx-note:not(:last-child){
    margin-bottom:1rem;
}
.sx-note.red{
    background:var(--red-lv_1);
    color:var(--red-lv_1-nm-lv_3);
}
.sx-note.green{
    background:var(--green-lv_1);
    color:var(--green-lv_1-nm-lv_3);
}
.sx-note.blue{
    background:var(--blue-lv_1);
    color:var(--blue-lv_1-nm-lv_3);
}
.sx-note.yellow{
    background:var(--yellow-lv_1);
    color:var(--yellow-lv_1-nm-lv_3);
}



.sx-note-border{
    padding:1rem;
    border-radius:var(--border-radius);
}
.sx-note-border:not(:last-child){
    margin-bottom:1rem;
}
.sx-note-border.red{
    border:1px solid var(--red-lv_1);
    color:var(--red-lv_1);
}
.sx-note-border.green{
    border:1px solid var(--green-lv_1);
    color:var(--green-lv_1);
}
.sx-note-border.blue{
    border:1px solid var(--blue-lv_1);
    color:var(--blue-lv_1);
}
.sx-note-border.yellow{
    border:1px solid var(--yellow-lv_1);
    color:var(--yellow-lv_1);
}

.sx-layout{
    margin-left:auto;margin-right:auto;
    box-sizing:border-box;

    width:100vw;height:100%;
}

.sx-row{
    box-sizing:border-box;
    width:100%;margin:0 auto;
    display:flex;flex-wrap:wrap;
    align-items:stretch;

    gap:var(--gap-size,0px);
}

.sx-row>.sx-column{
    display:flex;box-sizing:border-box;
    min-width:0;
    
    background:rgba(0,0,0,0.1);
    
    --total-gap:calc(var(--total-columns,1) - 1);
    --total-gap-size:calc(var(--total-gap) * var(--gap-size,0px));

    --width:calc(var(--column-width,100%) - var(--total-gap-size) / var(--total-columns,1));
    
    flex:0 0 var(--width);
    max-width:var(--width);
}


.sx-row.columns-1 .sx-column{
    --total-columns:1;
}
.sx-row.columns-2 .sx-column{
    --total-columns:2;
}
.sx-row.columns-3 .sx-column{
    --total-columns:3;
}
.sx-row.columns-4 .sx-column{
    --total-columns:4;
}
.sx-row.columns-5 .sx-column{
    --total-columns:5;
}
.sx-row.columns-6 .sx-column{
    --total-columns:6;
}
.sx-row.columns-7 .sx-column{
    --total-columns:7;
}
.sx-row.columns-8 .sx-column{
    --total-columns:8;
}
.sx-row.columns-9 .sx-column{
    --total-columns:9;
}
.sx-row.columns-10 .sx-column{
    --total-columns:10;
}
.sx-row.columns-11 .sx-column{
    --total-columns:11;
}
.sx-row.columns-12 .sx-column{
    --total-columns:12;
}
.sx-row.columns-13 .sx-column{
    --total-columns:13;
}
.sx-row.columns-14 .sx-column{
    --total-columns:14;
}
.sx-row.columns-15 .sx-column{
    --total-columns:15;
}
.sx-row.columns-16 .sx-column{
    --total-columns:16;
}
.sx-row.columns-17 .sx-column{
    --total-columns:17;
}
.sx-row.columns-18 .sx-column{
    --total-columns:18;
}
.sx-row.columns-19 .sx-column{
    --total-columns:19;
}
.sx-row.columns-20 .sx-column{
    --total-columns:20;
}
.sx-row.columns-21 .sx-column{
    --total-columns:21;
}
.sx-row.columns-22 .sx-column{
    --total-columns:22;
}
.sx-row.columns-23 .sx-column{
    --total-columns:23;
}
.sx-row.columns-24 .sx-column{
    --total-columns:24;
}

.sx-row.gap-x-small{
    --gap-size:0.1rem;
}
.sx-row.gap-x-small .sx-column{
    --gap-size:0.1rem;
}

.sx-row.gap-small{
    --gap-size:0.2rem;
}
.sx-row.gap-small .sx-column{
    --gap-size:0.2rem;
}

.sx-row.gap-medium{
    --gap-size:0.4rem;
}
.sx-row.gap-medium .sx-column{
    --gap-size:0.4rem;
}

.sx-row.gap-large{
    --gap-size:0.8rem;
}
.sx-row.gap-large .sx-column{
    --gap-size:0.8rem;
}

.sx-row.gap-x-large{
    --gap-size:1rem;
}
.sx-row.gap-x-large .sx-column{
    --gap-size:1rem;
}

.sx-row.gap-x-small .sx-column:only-child,.sx-row.gap-small .sx-column:only-child,.sx-row.gap-medium .sx-column:only-child,.sx-row.gap-large .sx-column:only-child,.sx-row.gap-x-large .sx-column:only-child{
    --gap-size:0.0rem;
}

@media screen and (max-width:239px){
    body::before{
        content:'The screen resolution is below the minimum supported size. For the best experience, please access this content on a device with a higher resolution.';
        display:flex;align-items:center;justify-content:center;text-align:center;
        position:fixed;width:100vw;height:100vh;box-sizing:border-box;padding:1rem;top:0;left:0;
        background:rgba(0,0,0,0.8);
        color:rgba(255,255,255,1);
        z-index:9999999;
        backdrop-filter:blur(5px);
        -webkit-backdrop-filter:blur(5px);
    }
}


@media screen and (max-width:575px){
    .sx-row>.sx-column.x-small-1{
        --column-width:var(--column-width-1);
    }
    .sx-row>.sx-column.x-small-2{
        --column-width:var(--column-width-2);
    }
    .sx-row>.sx-column.x-small-3{
        --column-width:var(--column-width-3);
    }
    .sx-row>.sx-column.x-small-4{
        --column-width:var(--column-width-4);
    }
    .sx-row>.sx-column.x-small-5{
        --column-width:var(--column-width-5);
    }
    .sx-row>.sx-column.x-small-6{
        --column-width:var(--column-width-6);
    }
    .sx-row>.sx-column.x-small-7{
        --column-width:var(--column-width-7);
    }
    .sx-row>.sx-column.x-small-8{
        --column-width:var(--column-width-8);
    }
    .sx-row>.sx-column.x-small-9{
        --column-width:var(--column-width-9);
    }
    .sx-row>.sx-column.x-small-10{
        --column-width:var(--column-width-10);
    }
    .sx-row>.sx-column.x-small-11{
        --column-width:var(--column-width-11);
    }
    .sx-row>.sx-column.x-small-12{
        --column-width:var(--column-width-12);
    }
    .sx-row>.sx-column.x-small-13{
        --column-width:var(--column-width-13);
    }
    .sx-row>.sx-column.x-small-14{
        --column-width:var(--column-width-14);
    }
    .sx-row>.sx-column.x-small-15{
        --column-width:var(--column-width-15);
    }
    .sx-row>.sx-column.x-small-16{
        --column-width:var(--column-width-16);
    }
    .sx-row>.sx-column.x-small-17{
        --column-width:var(--column-width-17);
    }
    .sx-row>.sx-column.x-small-18{
        --column-width:var(--column-width-18);
    }
    .sx-row>.sx-column.x-small-19{
        --column-width:var(--column-width-19);
    }
    .sx-row>.sx-column.x-small-20{
        --column-width:var(--column-width-20);
    }
    .sx-row>.sx-column.x-small-21{
        --column-width:var(--column-width-21);
    }
    .sx-row>.sx-column.x-small-22{
        --column-width:var(--column-width-22);
    }
    .sx-row>.sx-column.x-small-23{
        --column-width:var(--column-width-23);
    }
    .sx-row>.sx-column.x-small-24{
        --column-width:var(--column-width-24);
    }
    .sx-row>.sx-column.x-small-full{
        --column-width:100%;
    }
}

@media screen and (min-width:576px){
    .sx-row>.sx-column.small-1{
        --column-width:var(--column-width-1);
    }
    .sx-row>.sx-column.small-2{
        --column-width:var(--column-width-2);
    }
    .sx-row>.sx-column.small-3{
        --column-width:var(--column-width-3);
    }
    .sx-row>.sx-column.small-4{
        --column-width:var(--column-width-4);
    }
    .sx-row>.sx-column.small-5{
        --column-width:var(--column-width-5);
    }
    .sx-row>.sx-column.small-6{
        --column-width:var(--column-width-6);
    }
    .sx-row>.sx-column.small-7{
        --column-width:var(--column-width-7);
    }
    .sx-row>.sx-column.small-8{
        --column-width:var(--column-width-8);
    }
    .sx-row>.sx-column.small-9{
        --column-width:var(--column-width-9);
    }
    .sx-row>.sx-column.small-10{
        --column-width:var(--column-width-10);
    }
    .sx-row>.sx-column.small-11{
        --column-width:var(--column-width-11);
    }
    .sx-row>.sx-column.small-12{
        --column-width:var(--column-width-12);
    }
    .sx-row>.sx-column.small-13{
        --column-width:var(--column-width-13);
    }
    .sx-row>.sx-column.small-14{
        --column-width:var(--column-width-14);
    }
    .sx-row>.sx-column.small-15{
        --column-width:var(--column-width-15);
    }
    .sx-row>.sx-column.small-16{
        --column-width:var(--column-width-16);
    }
    .sx-row>.sx-column.small-17{
        --column-width:var(--column-width-17);
    }
    .sx-row>.sx-column.small-18{
        --column-width:var(--column-width-18);
    }
    .sx-row>.sx-column.small-19{
        --column-width:var(--column-width-19);
    }
    .sx-row>.sx-column.small-20{
        --column-width:var(--column-width-20);
    }
    .sx-row>.sx-column.small-21{
        --column-width:var(--column-width-21);
    }
    .sx-row>.sx-column.small-22{
        --column-width:var(--column-width-22);
    }
    .sx-row>.sx-column.small-23{
        --column-width:var(--column-width-23);
    }
    .sx-row>.sx-column.small-24{
        --column-width:var(--column-width-24);
    }
    .sx-row>.sx-column.small-full{
        --column-width:100%;
    }
}

@media screen and (min-width:768px){
    .sx-row>.sx-column.medium-1{
        --column-width:var(--column-width-1);
    }
    .sx-row>.sx-column.medium-2{
        --column-width:var(--column-width-2);
    }
    .sx-row>.sx-column.medium-3{
        --column-width:var(--column-width-3);
    }
    .sx-row>.sx-column.medium-4{
        --column-width:var(--column-width-4);
    }
    .sx-row>.sx-column.medium-5{
        --column-width:var(--column-width-5);
    }
    .sx-row>.sx-column.medium-6{
        --column-width:var(--column-width-6);
    }
    .sx-row>.sx-column.medium-7{
        --column-width:var(--column-width-7);
    }
    .sx-row>.sx-column.medium-8{
        --column-width:var(--column-width-8);
    }
    .sx-row>.sx-column.medium-9{
        --column-width:var(--column-width-9);
    }
    .sx-row>.sx-column.medium-10{
        --column-width:var(--column-width-10);
    }
    .sx-row>.sx-column.medium-11{
        --column-width:var(--column-width-11);
    }
    .sx-row>.sx-column.medium-12{
        --column-width:var(--column-width-12);
    }
    .sx-row>.sx-column.medium-13{
        --column-width:var(--column-width-13);
    }
    .sx-row>.sx-column.medium-14{
        --column-width:var(--column-width-14);
    }
    .sx-row>.sx-column.medium-15{
        --column-width:var(--column-width-15);
    }
    .sx-row>.sx-column.medium-16{
        --column-width:var(--column-width-16);
    }
    .sx-row>.sx-column.medium-17{
        --column-width:var(--column-width-17);
    }
    .sx-row>.sx-column.medium-18{
        --column-width:var(--column-width-18);
    }
    .sx-row>.sx-column.medium-19{
        --column-width:var(--column-width-19);
    }
    .sx-row>.sx-column.medium-20{
        --column-width:var(--column-width-20);
    }
    .sx-row>.sx-column.medium-21{
        --column-width:var(--column-width-21);
    }
    .sx-row>.sx-column.medium-22{
        --column-width:var(--column-width-22);
    }
    .sx-row>.sx-column.medium-23{
        --column-width:var(--column-width-23);
    }
    .sx-row>.sx-column.medium-24{
        --column-width:var(--column-width-24);
    }
    .sx-row>.sx-column.medium-full{
        --column-width:100%;
    }
}

@media screen and (min-width:992px){
    .sx-row>.sx-column.large-1{
        --column-width:var(--column-width-1);
    }
    .sx-row>.sx-column.large-2{
        --column-width:var(--column-width-2);
    }
    .sx-row>.sx-column.large-3{
        --column-width:var(--column-width-3);
    }
    .sx-row>.sx-column.large-4{
        --column-width:var(--column-width-4);
    }
    .sx-row>.sx-column.large-5{
        --column-width:var(--column-width-5);
    }
    .sx-row>.sx-column.large-6{
        --column-width:var(--column-width-6);
    }
    .sx-row>.sx-column.large-7{
        --column-width:var(--column-width-7);
    }
    .sx-row>.sx-column.large-8{
        --column-width:var(--column-width-8);
    }
    .sx-row>.sx-column.large-9{
        --column-width:var(--column-width-9);
    }
    .sx-row>.sx-column.large-10{
        --column-width:var(--column-width-10);
    }
    .sx-row>.sx-column.large-11{
        --column-width:var(--column-width-11);
    }
    .sx-row>.sx-column.large-12{
        --column-width:var(--column-width-12);
    }
    .sx-row>.sx-column.large-13{
        --column-width:var(--column-width-13);
    }
    .sx-row>.sx-column.large-14{
        --column-width:var(--column-width-14);
    }
    .sx-row>.sx-column.large-15{
        --column-width:var(--column-width-15);
    }
    .sx-row>.sx-column.large-16{
        --column-width:var(--column-width-16);
    }
    .sx-row>.sx-column.large-17{
        --column-width:var(--column-width-17);
    }
    .sx-row>.sx-column.large-18{
        --column-width:var(--column-width-18);
    }
    .sx-row>.sx-column.large-19{
        --column-width:var(--column-width-19);
    }
    .sx-row>.sx-column.large-20{
        --column-width:var(--column-width-20);
    }
    .sx-row>.sx-column.large-21{
        --column-width:var(--column-width-21);
    }
    .sx-row>.sx-column.large-22{
        --column-width:var(--column-width-22);
    }
    .sx-row>.sx-column.large-23{
        --column-width:var(--column-width-23);
    }
    .sx-row>.sx-column.large-24{
        --column-width:var(--column-width-24);
    }
    .sx-row>.sx-column.large-full{
        --column-width:100%;
    }
}

@media screen and (min-width:1200px){
    .sx-layout{
        width:min(1200px,max(90vw,1140px));
    }
    .sx-row>.sx-column.x-large-1{
        --column-width:var(--column-width-1);
    }
    .sx-row>.sx-column.x-large-2{
        --column-width:var(--column-width-2);
    }
    .sx-row>.sx-column.x-large-3{
        --column-width:var(--column-width-3);
    }
    .sx-row>.sx-column.x-large-4{
        --column-width:var(--column-width-4);
    }
    .sx-row>.sx-column.x-large-5{
        --column-width:var(--column-width-5);
    }
    .sx-row>.sx-column.x-large-6{
        --column-width:var(--column-width-6);
    }
    .sx-row>.sx-column.x-large-7{
        --column-width:var(--column-width-7);
    }
    .sx-row>.sx-column.x-large-8{
        --column-width:var(--column-width-8);
    }
    .sx-row>.sx-column.x-large-9{
        --column-width:var(--column-width-9);
    }
    .sx-row>.sx-column.x-large-10{
        --column-width:var(--column-width-10);
    }
    .sx-row>.sx-column.x-large-11{
        --column-width:var(--column-width-11);
    }
    .sx-row>.sx-column.x-large-12{
        --column-width:var(--column-width-12);
    }
    .sx-row>.sx-column.x-large-13{
        --column-width:var(--column-width-13);
    }
    .sx-row>.sx-column.x-large-14{
        --column-width:var(--column-width-14);
    }
    .sx-row>.sx-column.x-large-15{
        --column-width:var(--column-width-15);
    }
    .sx-row>.sx-column.x-large-16{
        --column-width:var(--column-width-16);
    }
    .sx-row>.sx-column.x-large-17{
        --column-width:var(--column-width-17);
    }
    .sx-row>.sx-column.x-large-18{
        --column-width:var(--column-width-18);
    }
    .sx-row>.sx-column.x-large-19{
        --column-width:var(--column-width-19);
    }
    .sx-row>.sx-column.x-large-20{
        --column-width:var(--column-width-20);
    }
    .sx-row>.sx-column.x-large-21{
        --column-width:var(--column-width-21);
    }
    .sx-row>.sx-column.x-large-22{
        --column-width:var(--column-width-22);
    }
    .sx-row>.sx-column.x-large-23{
        --column-width:var(--column-width-23);
    }
    .sx-row>.sx-column.x-large-24{
        --column-width:var(--column-width-24);
    }
    .sx-row>.sx-column.x-large-full{
        --column-width:100%;
    }
}

.align-left{
    text-align:left;
}
.align-center{
    text-align:center;
}
.align-right{
    text-align:right;
}

.sx-form-control{
    display:flex;max-width:100%;box-sizing:border-box;overflow:hidden;
    min-height:var(--form-control-height);
    align-items:stretch;
    position:relative;z-index:1;
}
.sx-form-control{
    margin-top:var(--form-control-margin);
}
.sx-form-control.inline{
    display:inline-flex;
}

.sx-form-control.inline + .sx-form-control.inline{
    margin-top:var(--form-control-margin);margin-left:var(--form-control-margin);
}

.sx-form-control>span.captcha{
    box-sizing:border-box;width:100%;display:flex;justify-content:center;align-items:center;flex-direction:column;
    outline:none;flex-grow:1;
    border:1px solid var(--form-control-border-color);
    border-radius:var(--border-radius);
    background:var(--form-control-background-color);
    padding:0.5rem;
    user-select:none;
}
.sx-form-control>span.captcha>span.title{
    font-weight:bold;
}
html.dark-mode .sx-form-control>span.captcha>span.container{
    filter:invert(1);
}
.sx-form-control>span.captcha>span.container{
    display:block;width:180px;height:50px;position:relative;z-index:1;
    padding:0.5rem;
    border:1px solid var(--form-control-border-color);
    border-radius:var(--border-radius);
    background:var(--bg_0-lv_2) no-repeat center center;
}
.sx-form-control>span.captcha>span.container i.sx-spinner{
    font-size:2rem;
    position:absolute;z-index:1;top:50%;left:50%;
    margin-top:-1rem;margin-left:-1rem;
}
html.dark-mode .sx-form-control>span.captcha>span.container i.sx-spinner{
    filter:brightness(0);
}
.sx-form-control>span.captcha>span.container>span.image{
    display:block;width:180px;height:50px;
    position:absolute;z-index:2;
    top:0.5rem;left:0.5rem;
    outline:none;
    border-radius:var(--border-radius);
    pointer-events:none;
}

.sx-form-control input[type=text],
.sx-form-control input[type=password],
.sx-form-control input[type=email],
.sx-form-control input[type=number],
.sx-form-control input[type=tel],
.sx-form-control input[type=url],
.sx-form-control input[type=search],
.sx-form-control input[type=date],
.sx-form-control input[type=datetime-local]
{
    box-sizing:border-box;width:100%;
    outline:none;flex-grow:1;
    border:1px solid var(--form-control-border-color);
    font-size:var(--form-control-font-size);
    padding:0 var(--form-control-padding);
    background:var(--form-control-background-color);
    color:var(--form-control-text-color);
    transition:background-color var(--form-control-transition-time);
    border-radius:var(--border-radius);
    margin:0;
}

.sx-form-control input[type=text]::placeholder,
.sx-form-control input[type=password]::placeholder,
.sx-form-control input[type=email]::placeholder,
.sx-form-control input[type=number]::placeholder,
.sx-form-control input[type=tel]::placeholder,
.sx-form-control input[type=url]::placeholder,
.sx-form-control input[type=search]::placeholder,
.sx-form-control input[type=date]::placeholder,
.sx-form-control input[type=datetime-local]::placeholder
{
    text-transform:none;
}


.sx-form-control input[type=text]:hover,
.sx-form-control input[type=password]:hover,
.sx-form-control input[type=email]:hover,
.sx-form-control input[type=number]:hover,
.sx-form-control input[type=tel]:hover,
.sx-form-control input[type=url]:hover,
.sx-form-control input[type=search]:hover,
.sx-form-control input[type=date]:focus,
.sx-form-control input[type=datetime-local]:focus
{
    background:var(--form-control-background-color-hover);
}
.sx-form-control input[type=text]:focus,
.sx-form-control input[type=password]:focus,
.sx-form-control input[type=email]:focus,
.sx-form-control input[type=number]:focus,
.sx-form-control input[type=tel]:focus,
.sx-form-control input[type=url]:focus,
.sx-form-control input[type=search]:focus,
.sx-form-control input[type=date]:focus,
.sx-form-control input[type=datetime-local]:focus
{
    background:var(--form-control-background-color-focus);
}
.sx-form-control input[type=color]{
    margin:0;
    width:var(--form-control-height);
    height:var(--form-control-height);
    outline:none;flex-grow:1;
    border:1px solid var(--form-control-border-color);
    padding:calc(var(--form-control-padding) / 2);
    background:var(--form-control-background-color);
}
.sx-form-control input[type=color],.sx-form-control input[type=date],.sx-form-control input[type=datetime-local]{
    cursor:pointer;
}

.sx-form-control textarea{
    margin:0;width:100%;
    height:15rem;
    resize:none;box-sizing:border-box;
    outline:none;flex-grow:1;
    border:1px solid var(--form-control-border-color);
    font-size:var(--form-control-font-size);
    padding:var(--form-control-padding);
    background:var(--form-control-background-color);
    color:var(--form-control-text-color);
    transition:background-color var(--form-control-transition-time);
}

.sx-form-control input[type=checkbox],
.sx-form-control input[type=radio]{
    display:none;
}
.sx-form-control input[type=checkbox]+label,.sx-form-control input[type=radio]+label{
    user-select:none;
    display:flex;align-items:center;position:relative;z-index:1;
}
.sx-form-control input[type=checkbox]+label::before,.sx-form-control input[type=radio]+label::before{
    content:'';display:block;margin-right:var(--form-control-margin);box-sizing:border-box;
    height:100%;
    width:var(--form-control-height);
    border:1px solid var(--form-control-checkbox-border-color);
    background:var(--form-control-background-color);
    border-radius:var(--border-radius);
}
.sx-form-control input[type=checkbox]+label:empty::before,.sx-form-control input[type=radio]+label:empty::before{
    margin-right:0;
}

.sx-form-control input[type=checkbox]+label:focus::after,.sx-form-control input[type=radio]+label:focus::after{
    box-shadow:inset 0 0 1rem rgba(var(--theme-contrast-rgb),0.2);
}

.sx-form-control input[type=checkbox]+label::after,.sx-form-control input[type=radio]+label::after{
    content:'';display:block;position:absolute;z-index:1;box-sizing:border-box;
    width:calc(var(--form-control-height) * 0.5);
    height:calc(var(--form-control-height) * 0.5);
    top:calc(var(--form-control-height) * 0.25);
    left:calc(var(--form-control-height) * 0.25);
    border:none;
    background:transparent;
    transition:background-color var(--form-control-transition-time);
}
.sx-form-control input[type=checkbox]:checked+label::after,.sx-form-control input[type=radio]:checked+label::after{
    background:var(--form-control-checkbox-checked-color);
}
.sx-form-control input[type=radio]+label::before{
    border-radius:50%;
}
.sx-form-control input[type=radio]+label::after{
    border-radius:50%;
}


.sx-form-control.switch input[type=checkbox]+label::before{
    width:calc(var(--form-control-height) * 1.5);
    border-radius:calc(var(--form-control-height) / 2);
    transition:all var(--form-control-transition-time);
}

.sx-form-control.switch input[type=checkbox]+label::after{
    width:calc(var(--form-control-height) - 4px);
    height:calc(var(--form-control-height) - 4px);
    border-radius:50%;top:2px;left:2px;
    background:var(--bg_0-lv_1);
    box-shadow:0 0 4px var(--bg_0-lv_10);
    transition:all var(--form-control-transition-time);
}

.sx-form-control.switch input[type=checkbox]:checked+label::before{
    background:var(--green-lv_1);
    border:none;
}

.sx-form-control.switch input[type=checkbox]:checked+label::after{
    left:calc(var(--form-control-height) * 1.5 - calc(var(--form-control-height) - 4px) - 2px);
}

/* Start: Red Checkbox */
.sx-form-control.red input[type=checkbox]+label::before,.sx-form-control.red input[type=radio]+label::before{
    border:1px solid var(--form-control-checkbox-red-border-color);
}
.sx-form-control.red input[type=checkbox]:checked+label::after,.sx-form-control.red input[type=radio]:checked+label::after{
    background:var(--form-control-checkbox-red-checked-color);
}
/* End: Red Checkbox */

/* Start: Green Checkbox */
.sx-form-control.green input[type=checkbox]+label::before,.sx-form-control.green input[type=radio]+label::before{
    border:1px solid var(--form-control-checkbox-green-border-color);
}
.sx-form-control.green input[type=checkbox]:checked+label::after,.sx-form-control.green input[type=radio]:checked+label::after{
    background:var(--form-control-checkbox-green-checked-color);
}
/* End: Green Checkbox */

/* Start: Blue Checkbox */
.sx-form-control.blue input[type=checkbox]+label::before,.sx-form-control.blue input[type=radio]+label::before{
    border:1px solid var(--form-control-checkbox-blue-border-color);
}
.sx-form-control.blue input[type=checkbox]:checked+label::after,.sx-form-control.blue input[type=radio]:checked+label::after{
    background:var(--form-control-checkbox-blue-checked-color);
}
/* End: Blue Checkbox */

.sx-form-control .sx-button,
.sx-form-control input[type=button],
.sx-form-control input[type=submit],
.sx-form-control input[type=reset],
.sx-form-control button
{
    display:flex;align-items:center;justify-content:center;
    margin:0;width:100%;
    flex-grow:1;box-sizing:border-box;
    outline:none;border:none;
    font-size:var(--form-control-font-size);
    padding:0 calc(4 * var(--form-control-padding));
    background:var(--form-control-button-background-color);
    color:var(--form-control-text-color);
    transition:background-color var(--form-control-transition-time),color var(--form-control-transition-time);
    border-radius:var(--border-radius);
    text-decoration:none!important;
    user-select:none;
}
.sx-form-control .sx-button>.icon,
.sx-form-control input[type=button]>.icon,
.sx-form-control input[type=submit]>.icon,
.sx-form-control input[type=reset]>.icon,
.sx-form-control button>.icon{
    margin-right:0.5rem;
}

.sx-form-control .sx-button.disabled,
.sx-form-control input[type=button]:disabled,
.sx-form-control input[type=submit]:disabled,
.sx-form-control input[type=reset]:disabled,
.sx-form-control button:disabled
{
    cursor:not-allowed!important;
    background:var(--form-control-button-disabled-background-color)!important;
    color:var(--form-control-button-disabled-color)!important;
    text-shadow:1px 1px 1px var(--form-control-button-disabled-shadow-color);
}
.sx-form-control .sx-button:hover,
.sx-form-control input[type=button]:hover,
.sx-form-control input[type=submit]:hover,
.sx-form-control input[type=reset]:hover,
.sx-form-control button:hover
{
    background:var(--form-control-button-background-color-hover);
}
.sx-form-control .sx-button:focus,
.sx-form-control input[type=button]:focus,
.sx-form-control input[type=submit]:focus,
.sx-form-control input[type=reset]:focus,
.sx-form-control button:focus
{
    background:var(--form-control-button-background-color-focus);
    box-shadow:inset 0 0 1rem rgba(var(--theme-contrast-rgb),0.2);
}
.sx-form-control .sx-button:active,
.sx-form-control input[type=button]:active,
.sx-form-control input[type=submit]:active,
.sx-form-control input[type=reset]:active,
.sx-form-control button:active
{
    background:var(--form-control-button-background-color-active);
}


/* Start: Red Button */
.sx-form-control.red .sx-button,
.sx-form-control.red input[type=button],
.sx-form-control.red input[type=submit],
.sx-form-control.red input[type=reset],
.sx-form-control.red button
{
    color:var(--form-control-button-red-text-color);
    background:var(--form-control-button-red-background-color);
}

.sx-form-control.red .sx-button:hover,
.sx-form-control.red input[type=button]:hover,
.sx-form-control.red input[type=submit]:hover,
.sx-form-control.red input[type=reset]:hover,
.sx-form-control.red button:hover
{
    background:var(--form-control-button-red-background-color-hover);
}
.sx-form-control.red .sx-button:focus,
.sx-form-control.red input[type=button]:focus,
.sx-form-control.red input[type=submit]:focus,
.sx-form-control.red input[type=reset]:focus,
.sx-form-control.red button:focus
{
    background:var(--form-control-button-red-background-color-focus);
}
.sx-form-control.red .sx-button:active,
.sx-form-control.red input[type=button]:active,
.sx-form-control.red input[type=submit]:active,
.sx-form-control.red input[type=reset]:active,
.sx-form-control.red button:active
{
    background:var(--form-control-button-red-background-color-active);
}
/* End: Red Button */


/* Start: Green Button */
.sx-form-control.green .sx-button,
.sx-form-control.green input[type=button],
.sx-form-control.green input[type=submit],
.sx-form-control.green input[type=reset],
.sx-form-control.green button
{
    color:var(--form-control-button-green-text-color);
    background:var(--form-control-button-green-background-color);
}
.sx-form-control.green .sx-button:hover,
.sx-form-control.green input[type=button]:hover,
.sx-form-control.green input[type=submit]:hover,
.sx-form-control.green input[type=reset]:hover,
.sx-form-control.green button:hover
{
    background:var(--form-control-button-green-background-color-hover);
}
.sx-form-control.green .sx-button:focus,
.sx-form-control.green input[type=button]:focus,
.sx-form-control.green input[type=submit]:focus,
.sx-form-control.green input[type=reset]:focus,
.sx-form-control.green button:focus
{
    background:var(--form-control-button-green-background-color-focus);
}
.sx-form-control.green .sx-button:active,
.sx-form-control.green input[type=button]:active,
.sx-form-control.green input[type=submit]:active,
.sx-form-control.green input[type=reset]:active,
.sx-form-control.green button:active
{
    background:var(--form-control-button-green-background-color-active);
}
/* End: Green Button */


/* Start: Blue Button */
.sx-form-control.blue .sx-button,
.sx-form-control.blue input[type=button],
.sx-form-control.blue input[type=submit],
.sx-form-control.blue input[type=reset],
.sx-form-control.blue button
{
    color:var(--form-control-button-blue-text-color);
    background:var(--form-control-button-blue-background-color);
}
.sx-form-control.blue .sx-button:hover,
.sx-form-control.blue input[type=button]:hover,
.sx-form-control.blue input[type=submit]:hover,
.sx-form-control.blue input[type=reset]:hover,
.sx-form-control.blue button:hover
{
    background:var(--form-control-button-blue-background-color-hover);
}
.sx-form-control.blue .sx-button:focus,
.sx-form-control.blue input[type=button]:focus,
.sx-form-control.blue input[type=submit]:focus,
.sx-form-control.blue input[type=reset]:focus,
.sx-form-control.blue button:focus
{
    background:var(--form-control-button-blue-background-color-focus);
}
.sx-form-control.blue .sx-button:active,
.sx-form-control.blue input[type=button]:active,
.sx-form-control.blue input[type=submit]:active,
.sx-form-control.blue input[type=reset]:active,
.sx-form-control.blue button:active
{
    background:var(--form-control-button-blue-background-color-active);
}
/* End: Blue Button */



.sx-form-control-group{
    display:flex;flex-direction:row;
}
.sx-form-control-group>.sx-form-control{
    display:flex;
    margin-left:0!important;margin-top:0!important;
}
.sx-form-control-group>.sx-form-control .sx-button,
.sx-form-control-group>.sx-form-control input[type=button],
.sx-form-control-group>.sx-form-control input[type=submit],
.sx-form-control-group>.sx-form-control input[type=reset],
.sx-form-control-group>.sx-form-control button{
    border-radius:0;
}
.sx-form-control-group>.sx-form-control:first-child .sx-button,
.sx-form-control-group>.sx-form-control:first-child input[type=button],
.sx-form-control-group>.sx-form-control:first-child input[type=submit],
.sx-form-control-group>.sx-form-control:first-child input[type=reset],
.sx-form-control-group>.sx-form-control:first-child button{
    border-radius:var(--border-radius) 0 0 var(--border-radius);
}
.sx-form-control-group>.sx-form-control:last-child .sx-button,
.sx-form-control-group>.sx-form-control:last-child input[type=button],
.sx-form-control-group>.sx-form-control:last-child input[type=submit],
.sx-form-control-group>.sx-form-control:last-child input[type=reset],
.sx-form-control-group>.sx-form-control:last-child button{
    border-radius:0 var(--border-radius) var(--border-radius) 0;
}


.sx-form-control select:not([size]){
    margin:0;width:100%;
    box-sizing:border-box;
    --triangle-icon-size:calc(var(--form-control-height) / 2);
    --triangle-margin-right:calc((var(--form-control-height) - var(--triangle-icon-size)) / 2);
    position:relative;z-index:1;cursor:pointer;
    outline:none;flex-grow:1;
    border:1px solid var(--form-control-border-color);
    font-size:var(--form-control-font-size);
    padding:0 var(--form-control-height) 0 var(--form-control-padding);
    background:var(--form-control-background-color) no-repeat right var(--triangle-margin-right) center;
    background-image:url('data:image/svg+xml;utf8,<svg fill="%23000" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');
    background-size:var(--triangle-icon-size);
    color:var(--form-control-text-color);
}
html.dark-mode .sx-form-control select:not([size]){
    background-image:url('data:image/svg+xml;utf8,<svg fill="%23fff" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');
}

.sx-hidden{
    display:none;
}

.sx-scrollable{
    -webkit-overflow-scrolling:touch;
    overflow-x:hidden;
    overflow-y:hidden;
}
.sx-scrollable.x{
    overflow-x:auto;
}
.sx-scrollable.y{
    overflow-y:auto;
}

.sx-form-control select[size]{
    margin:0;width:100%;
    box-sizing:border-box;
    position:relative;z-index:1;cursor:pointer;
    outline:none;flex-grow:1;
    border:1px solid var(--form-control-border-color);
    font-size:var(--form-control-font-size);
    padding:var(--form-control-padding);
    background:var(--form-control-background-color);
    color:var(--form-control-text-color);
}
.sx-form-control select[size] optgroup::before{
    display:flex;align-items:center;
    height:var(--form-control-height);box-sizing:border-box;
}
.sx-form-control select[size] option{
    display:flex;align-items:center;
    height:var(--form-control-height);box-sizing:border-box;
}
.sx-form-control select[size] option:checked{
    background:var(--blue-lv_1);
    color:var(--blue-lv_1-nm-lv_1);
}

.sx-form-control select:hover{
    background-color:var(--form-control-background-color-hover);   
}
.sx-form-control select:focus{
    background-color:var(--form-control-background-color-focus);   
}

.sx-invisible-loader{
    display:block;opacity:1;
    width:100vw;height:100vh;
    position:fixed;top:0;left:0;z-index:9999;
    background:transparent;
    cursor:wait;
}

.sx-dialog{
    display:block;opacity:1;
    width:100vw;height:100vh;
    position:fixed;top:0;left:0;z-index:9999;
    background:rgba(var(--theme-contrast-rgb),0.2);
    backdrop-filter:blur(5px);
    -webkit-backdrop-filter:blur(5px);
}

.sx-dialog>.container{
    display:flex;justify-content:center;align-items:center;
    width:100%;height:100%;box-sizing:border-box;
}
.sx-dialog>.container>form.box{
    display:flex;
    background:rgba(var(--theme-rgb),0.85);
    box-shadow:0 0 10px rgba(0,0,0,0.1);
    width:min(35rem,calc(100vw - 2rem));
    max-height:calc(100vh - 2rem);
    flex-direction:column;
    border-radius:var(--border-radius);
    overflow:auto;
    position:relative;z-index:1;
}

.sx-dialog>.container>form.box .close{
    position:absolute;cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    width:2rem;height:2rem;
    right:0.5rem;
    top:0.5rem;
    border-radius:50%;
    transition:background-color 0.2s;
}

.sx-dialog>.container>form.box .close:hover{
    background-color:rgba(var(--theme-contrast-rgb),0.1);
}
.sx-dialog>.container>form.box .close::after{
    content:'x';line-height:0;
    margin-top:-0.25em;
}
.sx-dialog>.container>form.box>.row{
    padding:1.5rem;
}
.sx-dialog>.container>form.box>.row+.row{
    padding-top:0;
}
.sx-dialog>.container>form.box>.row:empty{
    display:none;
}
.sx-dialog>.container>form.box>.title{
    font-size:1.5rem;
}
.sx-dialog>.container>form.box>.content{
    display:flex;
}
.sx-dialog>.container>form.box>.content>.icon{
    flex-shrink:0;flex-basis:3rem;width:3rem;height:3rem;margin-right:0.5rem;
    box-sizing:border-box;
}

@media screen and (max-width:576px){
    .sx-dialog>.container>form.box>.content{
        flex-direction:column;align-items:center;justify-content:center;
    }
    .sx-dialog>.container>form.box>.row>.container{
        display:flex;flex-direction:column;box-sizing:border-box;
        align-items:center;justify-content:center;
    }
}

.sx-dialog>.container>form.box>.content>.icon.info{
    display:flex;align-items:center;justify-content:center;
    background:var(--blue-lv_1);
    border-radius:50%;
}
.sx-dialog>.container>form.box>.content>.icon.info::after{
    content:'i';font-style:italic;font-family:serif;font-size:2rem;
    color:var(--blue-lv_1-nm-lv_3);
}

.sx-dialog>.container>form.box>.content>.icon.question{
    display:flex;align-items:center;justify-content:center;
    background:var(--blue-lv_1);
    border-radius:50%;
}
.sx-dialog>.container>form.box>.content>.icon.question::after{
    content:'?';font-family:serif;font-size:2rem;
    color:var(--blue-lv_1-nm-lv_3);
}

.sx-dialog>.container>form.box>.content>.icon.error{
    display:flex;align-items:center;justify-content:center;
    background:var(--red-lv_1);
    border-radius:50%;
}
.sx-dialog>.container>form.box>.content>.icon.error::after{
    content:'!';font-family:serif;font-size:2rem;
    color:var(--red-lv_1-nm-lv_3);
}

.sx-dialog>.container>form.box>.content>.icon.warn{
    display:flex;align-items:center;justify-content:center;position:relative;z-index:1;
}

.sx-dialog>.container>form.box>.content>.icon.warn::before{
    content:'';position:absolute;
    display:block;
    z-index:1;
    width:0;height:0;
    border:1.5rem solid transparent;
    border-bottom:3rem solid var(--red-lv_1);
    transform:translateY(-1rem);
}

.sx-dialog>.container>form.box>.content>.icon.warn::after{
    content:'!';font-family:serif;font-size:2rem;position:absolute;z-index:2;
    color:var(--red-lv_1-nm-lv_3);
}
.sx-dialog>.container>form.box>.content>.container{flex-grow:1;}
.sx-dialog>.container>form.box>.content>.container p{
    margin:0;padding:0;
    text-align:left;
    text-align-last:left;
}
.sx-dialog>.container>form.box>.action{
    display:flex;align-items:center;justify-content:right;
    flex-wrap:wrap;
    column-gap:0.2rem;row-gap:0.2rem;
}
.sx-dialog.sx-loader i.sx-spinner{
    font-size:max(2rem,min(10vw,10vh));
}