/*!****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/.pnpm/next@16.3.2_@babel+core@7.29.7_@types+node@26.2.0_babel-plugin-react-compiler@1.0.0_rea_1f93af5aaaabf6977575c1e59e603cc1/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[15].oneOf[11].use[2]!./node_modules/.pnpm/next@16.3.2_@babel+core@7.29.7_@types+node@26.2.0_babel-plugin-react-compiler@1.0.0_rea_1f93af5aaaabf6977575c1e59e603cc1/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[15].oneOf[11].use[3]!./node_modules/.pnpm/next@16.3.2_@babel+core@7.29.7_@types+node@26.2.0_babel-plugin-react-compiler@1.0.0_rea_1f93af5aaaabf6977575c1e59e603cc1/node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[15].oneOf[11].use[4]!./node_modules/.pnpm/next@16.3.2_@babel+core@7.29.7_@types+node@26.2.0_babel-plugin-react-compiler@1.0.0_rea_1f93af5aaaabf6977575c1e59e603cc1/node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[15].oneOf[11].use[5]!./src/app/css/app.scss ***!
  \****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
:root {
  --red-50: #fef2f2;
  --red-100: #fee2e2;
  --red-125: #fedcdc;
  --red-150: #fed6d6;
  --red-175: #fed0d0;
  --red-200: #fecaca;
  --red-225: #fec1c1;
  --red-250: #fdb8b8;
  --red-275: #fdaeae;
  --red-300: #fca5a5;
  --red-325: #fb9898;
  --red-350: #fa8b8b;
  --red-375: #f97e7e;
  --red-400: #f87171;
  --red-425: #f66666;
  --red-450: #f45b5b;
  --red-475: #f14f4f;
  --red-500: #ef4444;
  --red-525: #ea3d3d;
  --red-550: #e63535;
  --red-575: #e12e2e;
  --red-600: #dc2626;
  --red-625: #d32424;
  --red-650: #cb2121;
  --red-675: #c21f1f;
  --red-700: #b91c1c;
  --red-725: #b11c1c;
  --red-750: #a91c1c;
  --red-775: #a11b1b;
  --red-800: #991b1b;
  --red-825: #931c1c;
  --red-850: #8c1c1c;
  --red-875: #861d1d;
  --red-900: #7f1d1d;
  --green-50: #e8f5e9;
  --green-100: #c8e6c9;
  --green-125: #bfe2c1;
  --green-150: #b7deb8;
  --green-175: #aedab0;
  --green-200: #a5d6a7;
  --green-225: #9cd29e;
  --green-250: #93cf96;
  --green-275: #8acb8d;
  --green-300: #81c784;
  --green-325: #7ac47e;
  --green-350: #74c177;
  --green-375: #6dbe71;
  --green-400: #66bb6a;
  --green-425: #60b864;
  --green-450: #59b55d;
  --green-475: #53b257;
  --green-500: #4caf50;
  --green-525: #4aab4e;
  --green-550: #48a84c;
  --green-575: #45a449;
  --green-600: #43a047;
  --green-625: #409c44;
  --green-650: #3e9742;
  --green-675: #3b933f;
  --green-700: #388e3c;
  --green-725: #368a3a;
  --green-750: #338637;
  --green-775: #318135;
  --green-800: #2e7d32;
  --green-825: #29752e;
  --green-850: #256e29;
  --green-875: #206625;
  --green-900: #1b5e20;
  --blue-50: #e3f2fd;
  --blue-100: #bbdefb;
  --blue-125: #b0d9fb;
  --blue-150: #a6d4fa;
  --blue-175: #9bcffa;
  --blue-200: #90caf9;
  --blue-225: #85c5f8;
  --blue-250: #7ac0f8;
  --blue-275: #6fbaf7;
  --blue-300: #64b5f6;
  --blue-325: #5cb1f6;
  --blue-350: #53adf6;
  --blue-375: #4ba9f5;
  --blue-400: #42a5f5;
  --blue-425: #3aa1f5;
  --blue-450: #329ef4;
  --blue-475: #299af4;
  --blue-500: #2196f3;
  --blue-525: #2093f0;
  --blue-550: #208fec;
  --blue-575: #1f8ce9;
  --blue-600: #1e88e5;
  --blue-625: #1d84e0;
  --blue-650: #1c7fdc;
  --blue-675: #1a7bd7;
  --blue-700: #1976d2;
  --blue-725: #1872ce;
  --blue-750: #176ec9;
  --blue-775: #1669c5;
  --blue-800: #1565c0;
  --blue-825: #135eb8;
  --blue-850: #1156b1;
  --blue-875: #0f4fa9;
  --blue-900: #0d47a1;
  --yellow-50: #fffde7;
  --yellow-100: #fff9c4;
  --yellow-125: #fff8ba;
  --yellow-150: #fff7b1;
  --yellow-175: #fff6a7;
  --yellow-200: #fff59d;
  --yellow-225: #fff493;
  --yellow-250: #fff38a;
  --yellow-275: #fff280;
  --yellow-300: #fff176;
  --yellow-325: #fff06f;
  --yellow-350: #fff067;
  --yellow-375: #ffef60;
  --yellow-400: #ffee58;
  --yellow-425: #ffed51;
  --yellow-450: #ffed4a;
  --yellow-475: #ffec42;
  --yellow-500: #ffeb3b;
  --yellow-525: #ffe63a;
  --yellow-550: #fee238;
  --yellow-575: #fedd37;
  --yellow-600: #fdd835;
  --yellow-625: #fdd233;
  --yellow-650: #fccc31;
  --yellow-675: #fcc62f;
  --yellow-700: #fbc02d;
  --yellow-725: #fbba2b;
  --yellow-750: #fab429;
  --yellow-775: #faae27;
  --yellow-800: #f9a825;
  --yellow-825: #f89e22;
  --yellow-850: #f7941e;
  --yellow-875: #f6891b;
  --yellow-900: #f57f17;
  --purple-50: #f3e5f5;
  --purple-100: #e1bee7;
  --purple-125: #dcb3e3;
  --purple-150: #d8a9e0;
  --purple-175: #d39edc;
  --purple-200: #ce93d8;
  --purple-225: #c988d4;
  --purple-250: #c47ed0;
  --purple-275: #bf73cc;
  --purple-300: #ba68c8;
  --purple-325: #b660c5;
  --purple-350: #b358c2;
  --purple-375: #af4fbf;
  --purple-400: #ab47bc;
  --purple-425: #a73fb9;
  --purple-450: #a437b6;
  --purple-475: #a02fb3;
  --purple-500: #9c27b0;
  --purple-525: #9926af;
  --purple-550: #9526ad;
  --purple-575: #9225ac;
  --purple-600: #8e24aa;
  --purple-625: #8923a8;
  --purple-650: #8522a6;
  --purple-675: #8020a4;
  --purple-700: #7b1fa2;
  --purple-725: #771ea0;
  --purple-750: #731d9e;
  --purple-775: #6e1c9c;
  --purple-800: #6a1b9a;
  --purple-825: #621997;
  --purple-850: #5a1893;
  --purple-875: #521690;
  --purple-900: #4a148c;
  --orange-50: #fff3e0;
  --orange-100: #ffe0b2;
  --orange-125: #ffdba6;
  --orange-150: #ffd699;
  --orange-175: #ffd18d;
  --orange-200: #ffcc80;
  --orange-225: #ffc773;
  --orange-250: #ffc267;
  --orange-275: #ffbc5a;
  --orange-300: #ffb74d;
  --orange-325: #ffb343;
  --orange-350: #ffaf3a;
  --orange-375: #ffab30;
  --orange-400: #ffa726;
  --orange-425: #ffa31d;
  --orange-450: #ffa013;
  --orange-475: #ff9c0a;
  --orange-500: #ff9800;
  --orange-525: #fe9500;
  --orange-550: #fd9200;
  --orange-575: #fc8f00;
  --orange-600: #fb8c00;
  --orange-625: #fa8800;
  --orange-650: #f88400;
  --orange-675: #f78000;
  --orange-700: #f57c00;
  --orange-725: #f47800;
  --orange-750: #f27400;
  --orange-775: #f17000;
  --orange-800: #ef6c00;
  --orange-825: #ed6500;
  --orange-850: #eb5f00;
  --orange-875: #e85800;
  --orange-900: #e65100;
  --white-50: rgb(255, 255, 255);
  --white-100: rgba(255, 255, 255, 0.1);
  --white-125: rgba(255, 255, 255, 0.125);
  --white-150: rgba(255, 255, 255, 0.15);
  --white-175: rgba(255, 255, 255, 0.175);
  --white-200: rgba(255, 255, 255, 0.2);
  --white-225: rgba(255, 255, 255, 0.225);
  --white-250: rgba(255, 255, 255, 0.25);
  --white-275: rgba(255, 255, 255, 0.275);
  --white-300: rgba(255, 255, 255, 0.3);
  --white-325: rgba(255, 255, 255, 0.325);
  --white-350: rgba(255, 255, 255, 0.35);
  --white-375: rgba(255, 255, 255, 0.375);
  --white-400: rgba(255, 255, 255, 0.4);
  --white-425: rgba(255, 255, 255, 0.425);
  --white-450: rgba(255, 255, 255, 0.45);
  --white-475: rgba(255, 255, 255, 0.475);
  --white-500: rgba(255, 255, 255, 0.5);
  --white-525: rgba(255, 255, 255, 0.525);
  --white-550: rgba(255, 255, 255, 0.55);
  --white-575: rgba(255, 255, 255, 0.575);
  --white-600: rgba(255, 255, 255, 0.6);
  --white-625: rgba(255, 255, 255, 0.625);
  --white-650: rgba(255, 255, 255, 0.65);
  --white-675: rgba(255, 255, 255, 0.675);
  --white-700: rgba(255, 255, 255, 0.7);
  --white-725: rgba(255, 255, 255, 0.725);
  --white-750: rgba(255, 255, 255, 0.75);
  --white-775: rgba(255, 255, 255, 0.775);
  --white-800: rgba(255, 255, 255, 0.8);
  --white-825: rgba(255, 255, 255, 0.825);
  --white-850: rgba(255, 255, 255, 0.85);
  --white-875: rgba(255, 255, 255, 0.875);
  --white-900: rgba(255, 255, 255, 0.9);
  --white-925: rgba(255, 255, 255, 0.925);
  --white-950: rgba(255, 255, 255, 0.95);
  --white-975: rgba(255, 255, 255, 0.975);
  --gray-50: #fafafa;
  --gray-100: #f5f5f5;
  --gray-125: #f3f3f3;
  --gray-150: #f2f2f2;
  --gray-175: #f0f0f0;
  --gray-200: #eeeeee;
  --gray-225: #ebebeb;
  --gray-250: #e7e7e7;
  --gray-275: #e4e4e4;
  --gray-300: #e0e0e0;
  --gray-325: #d7d7d7;
  --gray-350: #cfcfcf;
  --gray-375: #c6c6c6;
  --gray-400: #bdbdbd;
  --gray-425: #b5b5b5;
  --gray-450: #aeaeae;
  --gray-475: #a6a6a6;
  --gray-500: #9e9e9e;
  --gray-525: #949494;
  --gray-550: #8a8a8a;
  --gray-575: #7f7f7f;
  --gray-600: #757575;
  --gray-625: #707070;
  --gray-650: #6b6b6b;
  --gray-675: #666666;
  --gray-700: #616161;
  --gray-725: #595959;
  --gray-750: #525252;
  --gray-775: #4a4a4a;
  --gray-800: #424242;
  --gray-825: #3a3a3a;
  --gray-850: #323232;
  --gray-875: #292929;
  --gray-900: #212121;
  --black-50: #f7f7f7;
  --black-100: #e1e1e1;
  --black-125: #dddddd;
  --black-150: #d8d8d8;
  --black-175: #d4d4d4;
  --black-200: #cfcfcf;
  --black-225: #c8c8c8;
  --black-250: #c0c0c0;
  --black-275: #b9b9b9;
  --black-300: #b1b1b1;
  --black-325: #acacac;
  --black-350: #a8a8a8;
  --black-375: #a3a3a3;
  --black-400: #9e9e9e;
  --black-425: #969696;
  --black-450: #8e8e8e;
  --black-475: #868686;
  --black-500: #7e7e7e;
  --black-525: #777777;
  --black-550: #707070;
  --black-575: #696969;
  --black-600: #626262;
  --black-625: #5e5e5e;
  --black-650: #5a5a5a;
  --black-675: #555555;
  --black-700: #515151;
  --black-725: #4c4c4c;
  --black-750: #464646;
  --black-775: #414141;
  --black-800: #3b3b3b;
  --black-825: #353535;
  --black-850: #2f2f2f;
  --black-875: #282828;
  --black-900: #222222;
  --black-925: #202020;
  --black-950: #1e1e1e;
  --black-975: #1b1b1b;
  --black-1000: #191919;
  --black-pitch: #000000;
  --pink-50: #fce4ec;
  --pink-100: #f8bbd0;
  --pink-125: #f7b0c8;
  --pink-150: #f6a5c1;
  --pink-175: #f59ab9;
  --pink-200: #f48fb1;
  --pink-225: #f384a9;
  --pink-250: #f279a2;
  --pink-275: #f16d9a;
  --pink-300: #f06292;
  --pink-325: #ef5a8c;
  --pink-350: #ee5186;
  --pink-375: #ed4980;
  --pink-400: #ec407a;
  --pink-425: #eb3874;
  --pink-450: #eb2f6f;
  --pink-475: #ea2769;
  --pink-500: #e91e63;
  --pink-525: #e51d62;
  --pink-550: #e11d62;
  --pink-575: #dc1c61;
  --pink-600: #d81b60;
  --pink-625: #d31a5f;
  --pink-650: #cd1a5e;
  --pink-675: #c8195c;
  --pink-700: #c2185b;
  --pink-725: #bd175a;
  --pink-750: #b81659;
  --pink-775: #b21558;
  --pink-800: #ad1457;
  --pink-825: #a41355;
  --pink-850: #9b1153;
  --pink-875: #911051;
  --pink-900: #880e4f;
  --teal-50: #e0f2f1;
  --teal-100: #b2dfdb;
  --teal-125: #a6dad5;
  --teal-150: #99d5d0;
  --teal-175: #8dd0ca;
  --teal-200: #80cbc4;
  --teal-225: #73c6be;
  --teal-250: #67c1b8;
  --teal-275: #5abbb2;
  --teal-300: #4db6ac;
  --teal-325: #43b2a8;
  --teal-350: #3aaea3;
  --teal-375: #30aa9f;
  --teal-400: #26a69a;
  --teal-425: #1da296;
  --teal-450: #139e91;
  --teal-475: #0a9a8d;
  --teal-500: #009688;
  --teal-525: #009385;
  --teal-550: #009082;
  --teal-575: #008c7e;
  --teal-600: #00897b;
  --teal-625: #008577;
  --teal-650: #008173;
  --teal-675: #007d6f;
  --teal-700: #00796b;
  --teal-725: #007567;
  --teal-750: #007164;
  --teal-775: #006d60;
  --teal-800: #00695c;
  --teal-825: #006255;
  --teal-850: #005b4e;
  --teal-875: #005447;
  --teal-900: #004d40;
  --cyan-50: #e0f7fa;
  --cyan-100: #b2ebf2;
  --cyan-125: #a6e8f0;
  --cyan-150: #99e5ee;
  --cyan-175: #8de1ec;
  --cyan-200: #80deea;
  --cyan-225: #73dbe8;
  --cyan-250: #67d7e6;
  --cyan-275: #5ad4e3;
  --cyan-300: #4dd0e1;
  --cyan-325: #43cedf;
  --cyan-350: #3acbde;
  --cyan-375: #30c9dc;
  --cyan-400: #26c6da;
  --cyan-425: #1dc4d9;
  --cyan-450: #13c1d7;
  --cyan-475: #0abfd6;
  --cyan-500: #00bcd4;
  --cyan-525: #00b8cf;
  --cyan-550: #00b4cb;
  --cyan-575: #00b0c6;
  --cyan-600: #00acc1;
  --cyan-625: #00a7bb;
  --cyan-650: #00a2b4;
  --cyan-675: #009cae;
  --cyan-700: #0097a7;
  --cyan-725: #0092a1;
  --cyan-750: #008d9b;
  --cyan-775: #008895;
  --cyan-800: #00838f;
  --cyan-825: #007a84;
  --cyan-850: #00727a;
  --cyan-875: #00696f;
  --cyan-900: #006064;
  --lime-50: #f9fbe7;
  --lime-100: #f0f4c3;
  --lime-125: #eef3b9;
  --lime-150: #ebf1b0;
  --lime-175: #e9f0a6;
  --lime-200: #e6ee9c;
  --lime-225: #e4ec92;
  --lime-250: #e1eb89;
  --lime-275: #dfe97f;
  --lime-300: #dce775;
  --lime-325: #dae66e;
  --lime-350: #d8e466;
  --lime-375: #d6e35f;
  --lime-400: #d4e157;
  --lime-425: #d2e050;
  --lime-450: #d1df48;
  --lime-475: #cfdd41;
  --lime-500: #cddc39;
  --lime-525: #cad838;
  --lime-550: #c7d336;
  --lime-575: #c3cf35;
  --lime-600: #c0ca33;
  --lime-625: #bcc531;
  --lime-650: #b8bf2f;
  --lime-675: #b3ba2d;
  --lime-700: #afb42b;
  --lime-725: #abae29;
  --lime-750: #a7a928;
  --lime-775: #a2a326;
  --lime-800: #9e9d24;
  --lime-825: #979421;
  --lime-850: #908a1e;
  --lime-875: #89811a;
  --lime-900: #827717;
  --amber-50: #fff8e1;
  --amber-100: #ffecb3;
  --amber-125: #ffe9a7;
  --amber-150: #ffe69b;
  --amber-175: #ffe38e;
  --amber-200: #ffe082;
  --amber-225: #ffdd75;
  --amber-250: #ffdb69;
  --amber-275: #ffd85c;
  --amber-300: #ffd54f;
  --amber-325: #ffd245;
  --amber-350: #ffd03c;
  --amber-375: #ffcd32;
  --amber-400: #ffca28;
  --amber-425: #ffc820;
  --amber-450: #ffc618;
  --amber-475: #ffc30f;
  --amber-500: #ffc107;
  --amber-525: #ffbe05;
  --amber-550: #ffba04;
  --amber-575: #ffb702;
  --amber-600: #ffb300;
  --amber-625: #ffae00;
  --amber-650: #ffaa00;
  --amber-675: #ffa500;
  --amber-700: #ffa000;
  --amber-725: #ff9c00;
  --amber-750: #ff9800;
  --amber-775: #ff9300;
  --amber-800: #ff8f00;
  --amber-825: #ff8700;
  --amber-850: #ff7f00;
  --amber-875: #ff7700;
  --amber-900: #ff6f00;
  --brown-50: #efebe9;
  --brown-100: #d7ccc8;
  --brown-125: #d0c4bf;
  --brown-150: #cabbb6;
  --brown-175: #c3b3ad;
  --brown-200: #bcaaa4;
  --brown-225: #b5a29b;
  --brown-250: #af9992;
  --brown-275: #a89188;
  --brown-300: #a1887f;
  --brown-325: #9c8278;
  --brown-350: #977b71;
  --brown-375: #92756a;
  --brown-400: #8d6e63;
  --brown-425: #88685c;
  --brown-450: #836256;
  --brown-475: #7e5b4f;
  --brown-500: #795548;
  --brown-525: #765346;
  --brown-550: #735145;
  --brown-575: #704e43;
  --brown-600: #6d4c41;
  --brown-625: #69493f;
  --brown-650: #65463c;
  --brown-675: #61433a;
  --brown-700: #5d4037;
  --brown-725: #593d35;
  --brown-750: #563a33;
  --brown-775: #523730;
  --brown-800: #4e342e;
  --brown-825: #4a312b;
  --brown-850: #462e29;
  --brown-875: #422a26;
  --brown-900: #3e2723;
  --indigo-50: #e8eaf6;
  --indigo-100: #c5cae9;
  --indigo-125: #bcc2e5;
  --indigo-150: #b2b9e2;
  --indigo-175: #a9b1de;
  --indigo-200: #9fa8da;
  --indigo-225: #96a0d6;
  --indigo-250: #8c97d3;
  --indigo-275: #838fcf;
  --indigo-300: #7986cb;
  --indigo-325: #727fc8;
  --indigo-350: #6b79c6;
  --indigo-375: #6372c3;
  --indigo-400: #5c6bc0;
  --indigo-425: #5565bd;
  --indigo-450: #4e5ebb;
  --indigo-475: #4658b8;
  --indigo-500: #3f51b5;
  --indigo-525: #3e4fb3;
  --indigo-550: #3c4db0;
  --indigo-575: #3b4bae;
  --indigo-600: #3949ab;
  --indigo-625: #3747a8;
  --indigo-650: #3544a5;
  --indigo-675: #3242a2;
  --indigo-700: #303f9f;
  --indigo-725: #2e3d9c;
  --indigo-750: #2c3a99;
  --indigo-775: #2a3896;
  --indigo-800: #283593;
  --indigo-825: #25318e;
  --indigo-850: #212c89;
  --indigo-875: #1e2883;
  --indigo-900: #1a237e;
  --slate-50: #eceff1;
  --slate-100: #cfd8dc;
  --slate-125: #c7d2d6;
  --slate-150: #c0cbd1;
  --slate-175: #b8c5cb;
  --slate-200: #b0bec5;
  --slate-225: #a8b8bf;
  --slate-250: #a0b1ba;
  --slate-275: #98abb4;
  --slate-300: #90a4ae;
  --slate-325: #8a9faa;
  --slate-350: #849aa5;
  --slate-375: #7e95a1;
  --slate-400: #78909c;
  --slate-425: #728b98;
  --slate-450: #6c8794;
  --slate-475: #66828f;
  --slate-500: #607d8b;
  --slate-525: #5d7987;
  --slate-550: #5a7683;
  --slate-575: #57727e;
  --slate-600: #546e7a;
  --slate-625: #506975;
  --slate-650: #4d646f;
  --slate-675: #495f6a;
  --slate-700: #455a64;
  --slate-725: #42555f;
  --slate-750: #3e515a;
  --slate-775: #3b4c54;
  --slate-800: #37474f;
  --slate-825: #334249;
  --slate-850: #2f3d44;
  --slate-875: #2a373e;
  --slate-900: #263238;
  --manatee-50: #f8f9fb;
  --manatee-100: #f0f2f5;
  --manatee-125: #edf0f4;
  --manatee-150: #ebeef2;
  --manatee-175: #e8ebf1;
  --manatee-200: #e5e9ef;
  --manatee-225: #e2e7ed;
  --manatee-250: #dfe4eb;
  --manatee-275: #dbe2e9;
  --manatee-300: #d8dfe7;
  --manatee-325: #d5dde5;
  --manatee-350: #d2dae3;
  --manatee-375: #cfd8e1;
  --manatee-400: #ccd5df;
  --manatee-425: #cad3dd;
  --manatee-450: #c9d1db;
  --manatee-475: #c7ced9;
  --manatee-500: #c5ccd7;
  --manatee-525: #bec6d2;
  --manatee-550: #b7c0ce;
  --manatee-575: #afb9c9;
  --manatee-600: #a8b3c4;
  --manatee-625: #a1acbe;
  --manatee-650: #99a6b8;
  --manatee-675: #929fb2;
  --manatee-700: #8a98ac;
  --manatee-725: #8392a6;
  --manatee-750: #7c8ba1;
  --manatee-775: #75859b;
  --manatee-800: #6e7e95;
  --manatee-825: #66778e;
  --manatee-850: #5f7088;
  --manatee-875: #576881;
  --manatee-900: #4f617a;
  --manatee-950: #3a4a63;
}

@keyframes shimmering {
  0% {
    transform: translate3d(-500%, 0, 0) rotate(var(--shimmer-angle));
  }
  100% {
    transform: translate3d(500%, 0, 0) rotate(var(--shimmer-angle));
  }
}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@keyframes spinnerWave {
  0% {
    opacity: 0.2;
    transform: scale(1);
  }
  10% {
    opacity: 1;
    transform: scale(1.75);
  }
  20% {
    opacity: 0.2;
    transform: scale(1);
  }
  100% {
    opacity: 0.2;
    transform: scale(1);
  }
}
@keyframes breath {
  0% {
    opacity: 0.5;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0.5;
  }
}
@keyframes textshimmer {
  0% {
    background-position: -120% 0;
  }
  50%, 100% {
    background-position: 120% 0;
  }
}
:root {
  --basic: ease;
  --back: linear( 0, -0.0077 5.2%, -0.0452 16.98%, -0.0493 22.35%, -0.0418 25.57%, -0.0258 28.57%, -0.0007 31.42%, 0.0335 34.15%, 0.1242 39.03%, 0.2505 43.65%, 0.3844 47.35%, 0.656 53.68%, 0.81 58.37%, 0.9282 63.52%, 0.9719 66.23%, 1.0055 69.04%, 1.0255 71.4%, 1.0396 73.87%, 1.0477 76.48%, 1.05 79.27%, 1.0419 84.36%, 1.0059 95.49%, 1 );
  --expo: linear( 0, 0.0053 17.18%, 0.0195 26.59%, 0.0326 30.31%, 0.0506 33.48%, 0.0744 36.25%, 0.1046 38.71%, 0.1798 42.62%, 0.2846 45.93%, 0.3991 48.37%, 0.6358 52.29%, 0.765 55.45%, 0.8622 59.3%, 0.8986 61.51%, 0.9279 63.97%, 0.9481 66.34%, 0.9641 69.01%, 0.9856 75.57%, 0.9957 84.37%, 1 );
  --sine: linear( 0, 0.007 5.35%, 0.0282 10.75%, 0.0638 16.26%, 0.1144 21.96%, 0.1833 28.16%, 0.2717 34.9%, 0.6868 62.19%, 0.775 68.54%, 0.8457 74.3%, 0.9141 81.07%, 0.9621 87.52%, 0.9905 93.8%, 1 );
  --power: linear( 0, 0.0012 14.95%, 0.0089 22.36%, 0.0297 28.43%, 0.0668 33.43%, 0.0979 36.08%, 0.1363 38.55%, 0.2373 43.07%, 0.3675 47.01%, 0.5984 52.15%, 0.7121 55.23%, 0.8192 59.21%, 0.898 63.62%, 0.9297 66.23%, 0.9546 69.06%, 0.9733 72.17%, 0.9864 75.67%, 0.9982 83.73%, 1 );
  --circ: linear( -0, 0.0033 5.75%, 0.0132 11.43%, 0.0296 16.95%, 0.0522 22.25%, 0.0808 27.25%, 0.1149 31.89%, 0.1542 36.11%, 0.1981 39.85%, 0.2779 44.79%, 0.3654 48.15%, 0.4422 49.66%, 0.5807 50.66%, 0.6769 53.24%, 0.7253 55.37%, 0.7714 58.01%, 0.8142 61.11%, 0.8536 64.65%, 0.9158 72.23%, 0.9619 80.87%, 0.9904 90.25%, 1 );
  --bounce: linear( 0, 0.0039, 0.0157, 0.0352, 0.0625 9.09%, 0.1407, 0.25, 0.3908, 0.5625, 0.7654, 1, 0.8907, 0.8125 45.45%, 0.7852, 0.7657, 0.7539, 0.75, 0.7539, 0.7657, 0.7852, 0.8125 63.64%, 0.8905, 1 72.73%, 0.9727, 0.9532, 0.9414, 0.9375, 0.9414, 0.9531, 0.9726, 1, 0.9883, 0.9844, 0.9883, 1 );
  --elastic: linear( 0, 0.0009 8.51%, -0.0047 19.22%, 0.0016 22.39%, 0.023 27.81%, 0.0237 30.08%, 0.0144 31.81%, -0.0051 33.48%, -0.1116 39.25%, -0.1181 40.59%, -0.1058 41.79%, -0.0455, 0.0701 45.34%, 0.9702 55.19%, 1.0696 56.97%, 1.0987 57.88%, 1.1146 58.82%, 1.1181 59.83%, 1.1092 60.95%, 1.0057 66.48%, 0.986 68.14%, 0.9765 69.84%, 0.9769 72.16%, 0.9984 77.61%, 1.0047 80.79%, 0.9991 91.48%, 1 );
  --ease: var(--back);
  --spring: cubic-bezier(0.2, -0.36, 0, 1.46);
  --liquid: cubic-bezier(0.175, 0.885, 0.32, 2.2);
}

.--devtools {
  --search-border: 0px;
  --list-item-hover: var(--surface-hover);
  --list-item-padding-sm: 4px;
  --list-item-padding-md: 8px;
  --list-item-radius-sm: 8px;
  --list-item-radius-md: 12px;
  --codeblock-border: 1px solid var(--border-primary);
  --codeblock-radius: var(--radius-sm);
  background: var(--surface);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.--devtools .--body {
  padding: 0px !important;
}

.--devtools .--body .--devtools-box {
  width: 30vw;
}

.--devtools .--body .--devtools-box .--devtools-head {
  border-bottom: 1px var(--border-primary) solid;
}

.--devtools .--body .--devtools-box .--devtools-head .--devtools-search {
  width: 100%;
}

.--devtools .--body .--devtools-box .--devtools-content {
  height: 60vh;
  overflow: hidden;
}

.--devtools .--body .--devtools-box .--devtools-content.--has-doc .--devtools-panels {
  transform: translateX(-50%);
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-panels {
  width: 200%;
  height: 100%;
  display: flex;
  transition: transform 0.28s ease;
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-panel {
  width: 50%;
  min-width: 50%;
  height: 100%;
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-doc-panel {
  border-left: 1px var(--border-primary) solid;
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-scroll {
  padding: 5px !important;
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-doc-scroll {
  padding: 10px !important;
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-item-section {
  opacity: 0.5;
  padding: var(--list-item-padding-sm);
  font-size: var(--text-sm);
  margin-bottom: 5px;
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-item {
  padding: var(--list-item-padding-sm);
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-item .--devtools-icon svg {
  fill: var(--text-primary);
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-item .--devtools-label {
  color: var(--text-primary);
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-item .--devtools-detail {
  color: var(--text-secondary);
  opacity: 0.8;
  font-size: var(--text-xs);
  line-height: 1.3;
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-item {
  cursor: pointer;
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-item.--active {
  background: var(--surface-hover);
  border-radius: var(--list-item-radius-sm);
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-item.--devtools-item-passive {
  cursor: default;
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-doc-head {
  margin-bottom: 6px;
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-doc-head .--devtools-back {
  color: var(--text-secondary);
  font-size: var(--text-sm);
  cursor: pointer;
  width: fit-content;
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-doc-head .--devtools-back:hover {
  color: var(--text-primary);
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-doc-head .--devtools-doc-title {
  color: var(--text-primary);
  font-size: var(--text-lg);
  font-weight: 600;
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-doc-head .--devtools-doc-summary {
  color: var(--text-secondary);
  font-size: var(--text-sm);
  line-height: 1.45;
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-doc-caption {
  color: var(--text-secondary);
  font-size: var(--text-sm);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-doc-example {
  margin-bottom: 12px;
}

.--devtools .--body .--devtools-box .--devtools-content .--devtools-doc-example .--devtools-doc-code {
  color: var(--text-primary);
  background: var(--surface-hover);
  border: 1px var(--border-primary) solid;
  border-radius: var(--radius-sm);
  padding: 10px;
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
  font-size: var(--text-xs);
  line-height: 1.4;
  word-break: break-word;
}

body {
  --accordion: #fff;
  --accordion-label: #111;
  --accordion-radius: 5px;
  --accordion-border: 1px #ddd solid;
  --accordion-head: #fff;
  --accordion-head-hover: #f1f1f1;
  --accordion-head-padding: 10px;
  --accordion-head-font-size: 16px;
  --accordion-head-font-weight: normal;
  --accordion-head-arrow-size: 18px;
  --accordion-head-arrow: #111;
  --accordion-detail-padding: 10px;
  --accordion-detail-font-size: 15px;
}

[color-scheme=dark] body {
  --accordion: #1c1d1e;
  --accordion-label: #fff;
  --accordion-border: 1px #232426 solid;
  --accordion-head: #1c1d1e;
  --accordion-head-hover: #292a2c;
  --accordion-head-arrow: #fff;
}

.--accordion {
  background: var(--accordion);
  border: var(--accordion-border);
  border-radius: var(--accordion-radius);
  overflow: hidden;
}

.--accordion .--toggle {
  border: 0px;
  background: var(--accordion-head);
  padding: var(--accordion-head-padding);
  border-radius: var(--accordian-radius);
  flex: 1 1;
  width: 100%;
}

.--accordion .--toggle .--label {
  flex: 1 1;
  color: var(--accordion-label);
  font-size: var(--accordion-head-font-size);
  font-weight: var(--accordion-head-font-weight);
}

.--accordion .--toggle .--arrow {
  width: var(--accordion-head-arrow-size);
}

.--accordion .--toggle .--arrow svg path {
  fill: var(--accordion-head-arrow);
}

.--accordion .--toggle:hover {
  background: var(--accordion-head-hover);
}

.--accordion .--detail {
  padding: var(--accordion-detail-padding);
  font-size: var(--accordion-detail-font-size);
}

body {
  --tip-s: 0;
  --actionbar: #fff;
  --actionbar-radius: 50px;
  --actionbar-padding: 2px;
  --actionbar-shadow: 0px 0px 0px 1px #ccc, 0px 0px 8px #c0b0b0;
  --actionbar-gap: 2px;
  --actionbar-action-size: 40px;
  --actionbar-action: transparent;
  --actionbar-action-color: #111;
  --actionbar-action-hover: #ddd;
  --actionbar-action-selected: #eee;
  --actionbar-action-border: 0px;
  --actionbar-action-padding: 6px;
  --actionbar-action-radius: 20px;
  --actionbar-action-icon-size: 18px;
  --actionbar-tooltip: #111;
  --actionbar-tooltip-padding: 2px 0px;
  --actionbar-tooltip-radius: 10px;
  --actionbar-tooltip-color: #fff;
  --actionbar-tooltip-speed: 0.05s;
  --actionbar-tooltip-track-speed: 0.3s;
}

.--actionbar {
  background: var(--actionbar);
  border-radius: var(--actionbar-radius);
  padding: var(--actionbar-padding);
  box-shadow: var(--actionbar-shadow);
  gap: var(--actionbar-gap);
}

.--actionbar.--bottom {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 20px;
}

.--actionbar .--action {
  color: var(--actionbar-action-color);
  width: var(--actionbar-action-size);
  height: var(--actionbar-action-size);
  background: var(--actionbar-action);
  border: var(--actionbar-action-border);
  padding: var(--actionbar-action-padding);
  border-radius: var(--actionbar-action-radius);
  flex: 1 1;
}

.--actionbar .--action svg {
  width: 100%;
  height: 100%;
}

.--actionbar .--action img {
  width: 100%;
  height: 100%;
}

.--actionbar .--action .--icon {
  font-size: var(--actionbar-action-icon-size);
}

.--actionbar .--action:hover {
  background: var(--actionbar-action-hover);
}

.--actionbar .--action.--selected {
  background: var(--actionbar-action-selected);
}

.--actionbar .--tip {
  --tip-width: calc( var(--tip-w) * 1ch + 6px );
  translate: calc(-50% + var(--tip-x) * 1px) calc(-50% + var(--tip-y) * 1px);
  bottom: 60px;
  background: var(--actionbar-tooltip);
  padding: var(--actionbar-tooltip-padding);
  border-radius: var(--actionbar-tooltip-radius);
  color: var(--actionbar-tooltip-color);
  scale: var(--tip-s);
  transform-origin: center;
  width: var(--tip-width);
  transition: all var(--actionbar-tooltip-speed) linear 0s;
  overflow: hidden;
}

.--actionbar .--tip .--track {
  width: calc(var(--tip-width) * var(--tip-l));
  translate: calc(var(--tip-m) * var(--tip-width) * -1) 0px;
  transition: all var(--actionbar-tooltip-track-speed) var(--spring) 0s;
}

.--actionbar .--tip .--track .--lb {
  text-align: center;
  width: var(--tip-width);
}

body {
  --za-composer: var(--surface);
  --za-border: 1px var(--border-primary) solid;
  --za-padding: 0px 0px 10px 0px;
  --za-active-color-1: #5ea1ff;
  --za-active-color-2: #b183ff;
  --za-active-speed: 2s;
  --za-active-blur: 50px;
}

*:has(> .zuz-agent) {
  display: flex;
  align-items: stretch;
}

.--zuz-agent {
  width: 100%;
  height: 100%;
  max-width: 100vw;
  max-height: 100vh;
}

.--zuz-agent.--xs {
  --za-radius: var(--radius-xs);
  --za-text-size: var(--text-xs);
}

.--zuz-agent.--sm {
  --za-radius: var(--radius-sm);
  --za-text-size: var(--text-sm);
}

.--zuz-agent.--md {
  --za-radius: var(--radius-md);
  --za-text-size: var(--text-md);
}

.--zuz-agent.--lg {
  --za-radius: var(--radius-lg);
  --za-text-size: var(--text-lg);
}

.--zuz-agent.--xl {
  --za-radius: var(--radius-xl);
  --za-text-size: var(--text-xl);
}

.--zuz-agent.--xxl {
  --za-radius: var(--radius-xxl);
  --za-text-size: var(--text-xxl);
}

.--zuz-agent.--2xl {
  --za-radius: var(--radius-2xl);
  --za-text-size: var(--text-2xl);
}

.--zuz-agent.--3xl {
  --za-radius: var(--radius-3xl);
  --za-text-size: var(--text-3xl);
}

.--zuz-agent.--4xl {
  --za-radius: var(--radius-4xl);
  --za-text-size: var(--text-4xl);
}

.--zuz-agent.--5xl {
  --za-radius: var(--radius-5xl);
  --za-text-size: var(--text-5xl);
}

.--zuz-agent.--6xl {
  --za-radius: var(--radius-6xl);
  --za-text-size: var(--text-6xl);
}

.--zuz-agent.--7xl {
  --za-radius: var(--radius-7xl);
  --za-text-size: var(--text-7xl);
}

.--zuz-agent.--8xl {
  --za-radius: var(--radius-8xl);
  --za-text-size: var(--text-8xl);
}

.--zuz-agent.--9xl {
  --za-radius: var(--radius-9xl);
  --za-text-size: var(--text-9xl);
}

.--zuz-agent .--za-chat {
  width: 100%;
  height: 100%;
  flex: 1 1;
  min-height: 0;
  padding: var(--za-padding);
}

.--zuz-agent .--za-chat .--za-bottom-ref {
  height: 75px;
  min-height: 75px;
}

.--zuz-agent .--za-chat .--za-messages {
  flex: 1 1;
  min-height: 0;
  width: var(--za-width, 100%);
  margin: 0 auto;
  padding: var(--za-messages-padding, 15px);
  font-size: var(--za-chat-text-size, 16px);
  --bubble-stamp-size: var(--za-chat-text-size, 16px);
}

.--zuz-agent .--za-chat .--za-messages --za-bubble-margin .--za-chat-empty .--za-ce-title {
  font-size: var(--za-empty-title-size, 18px);
  opacity: 0.75;
}

.--zuz-agent .--za-chat .--za-messages --za-bubble-margin .--za-chat-empty .--za-ce-msg {
  opacity: 0.5;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity {
  margin: 4px 0 14px;
  max-width: var(--za-activity-width, 560px);
}

.--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-summary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  padding: 2px 0;
  color: inherit;
  background: rgba(0, 0, 0, 0);
  border: 0;
  cursor: pointer;
  text-align: left;
  opacity: 0.55;
  margin-bottom: 5px;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-summary:hover {
  opacity: 1;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-summary-text, .--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-title, .--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-detail {
  font-size: var(--za-activity-font-size, 15px);
}

.--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-toggle {
  width: 12px;
  height: 12px;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-steps {
  gap: 0;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-step {
  gap: 8px;
  min-height: 24px;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-rail {
  width: 16px;
  flex: 0 0 16px;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-marker {
  width: 16px;
  height: 16px;
  color: currentColor;
  opacity: 0.6;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-marker .--spinner {
  width: 12px;
  height: 12px;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-line {
  width: 1px;
  min-height: 8px;
  flex: 1 1;
  margin: 2px 0;
  background: currentColor;
  opacity: 0.2;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-copy {
  min-width: 0;
  padding: 0 0 9px;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-title {
  opacity: 0.6;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-active {
  font-weight: 600;
  opacity: 1;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-detail {
  margin-top: 2px;
  overflow: hidden;
  color: inherit;
  opacity: 0.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity .--za-activity-failed {
  color: var(--danger, #d63c3c);
  opacity: 1;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity.--za-activity-compact-live {
  margin: 4px 0;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity.--za-activity-compact-live .--za-activity-step {
  min-height: 20px;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity.--za-activity-compact-live .--za-activity-rail {
  display: none;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity.--za-activity-compact-live .--za-activity-copy {
  flex-direction: row;
  align-items: baseline;
  gap: 6px;
  min-width: 0;
  padding: 0;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity.--za-activity-compact-live .--za-activity-title {
  overflow: hidden;
  font-size: 12px;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.--zuz-agent .--za-chat .--za-messages .--za-activity.--za-activity-compact-live .--za-activity-detail {
  min-width: 0;
  max-width: 360px;
  margin: 0;
  overflow: hidden;
  font-size: 11px;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: 0.65;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-tools {
  width: 100%;
  margin: 8px 0;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-tool {
  overflow: hidden;
  border: 1px solid var(--border-primary);
  border-radius: 8px;
  background: var(--surface);
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-tool.--failed {
  border-color: var(--danger, #d63c3c);
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-tool-summary {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 7px;
  padding: 8px 10px;
  border: 0;
  color: inherit;
  background: rgba(0, 0, 0, 0);
  cursor: pointer;
  text-align: left;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-tool-summary:disabled {
  cursor: default;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-tool-summary .--icon {
  width: 14px;
  height: 14px;
  opacity: 0.65;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-tool-name {
  flex: 1 1;
  min-width: 0;
  overflow: hidden;
  font-family: var(--font-mono, monospace);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-tool-state, .--zuz-agent .--za-chat .--za-messages .--za-msg .--za-tool-value-label {
  font-size: 11px;
  opacity: 0.55;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-tool-details {
  padding: 0 10px 10px;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-tool-value pre {
  max-height: 260px;
  margin: 0;
  padding: 8px 10px;
  overflow: auto;
  border: 1px solid var(--border-primary);
  border-radius: 6px;
  background: color-mix(in srgb, var(--surface) 80%, #000);
  font-family: var(--font-mono, monospace);
  font-size: 12px;
  white-space: pre-wrap;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-agent-execution {
  width: 100%;
  margin: 8px 0 14px;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-agent-terminal {
  overflow: hidden;
  border: 1px solid var(--border-primary);
  border-radius: 8px;
  background: var(--surface);
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-agent-terminal-command, .--zuz-agent .--za-chat .--za-messages .--za-msg .--za-agent-terminal-result {
  padding: 7px 10px;
  font-family: var(--font-mono, monospace);
  font-size: 12px;
  opacity: 0.72;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-agent-terminal-output {
  max-height: 260px;
  margin: 0;
  padding: 8px 10px;
  overflow: auto;
  background: color-mix(in srgb, var(--surface) 80%, #000);
  font-family: var(--font-mono, monospace);
  font-size: 12px;
  white-space: pre-wrap;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-agent-terminal.--failed {
  border-color: var(--danger, #d63c3c);
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-agent-stats {
  font-size: 11px;
  opacity: 0.55;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--zuz-code-pre {
  width: 100%;
  min-width: 0px;
  margin: 5px 0px 20px 0px;
  flex-basis: 100%;
  overflow: hidden;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-code-head {
  background: var(--za-code-head-background);
  border: var(--za-code-head-border);
  padding: 0px 10px 0px 15px;
  border-radius: var(--za-code-head-radius);
}

.--zuz-agent .--za-chat .--za-messages .--za-msg .--za-code-head .--za-ch-head {
  font-size: 10px;
  opacity: 0.75;
  font-weight: bold;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg.--za-msg-user {
  max-width: 90%;
  margin: var(--za-bubble-margin, 30px 0px);
  align-self: end;
}

.--zuz-agent .--za-chat .--za-messages .--za-msg.--za-msg-user .--za-bubble {
  background: var(--za-bubble, var(--surface));
  padding: var(--za-bubble-padding, 10px);
  border-radius: var(--za-radius, 30px);
}

.--zuz-agent .--za-chat .--za-connection-banner {
  margin: 8px 10px 0;
  padding: 7px 10px;
  border: 1px solid var(--warning, #c18b00);
  border-radius: 8px;
  background: color-mix(in srgb, var(--warning, #c18b00) 12%, var(--surface));
  color: inherit;
  font-size: 12px;
}

.--zuz-agent .--za-chat .--za-approval {
  width: var(--za-width, 100%);
  margin: 0 auto;
  padding: 12px;
  border: var(--za-border);
  border-radius: calc(var(--za-radius) / 2);
  background: var(--za-composer);
}

.--zuz-agent .--za-chat .--za-approval .--za-approval-title {
  font-weight: 600;
}

.--zuz-agent .--za-chat .--za-approval .--za-approval-description, .--zuz-agent .--za-chat .--za-approval .--za-approval-risk, .--zuz-agent .--za-chat .--za-approval .--za-approval-prompt {
  font-size: 13px;
  opacity: 0.7;
}

.--zuz-agent .--za-chat .--za-approval .--za-approval-command {
  overflow: hidden;
  border: 1px solid var(--border-primary);
  border-radius: 8px;
  background: var(--surface);
}

.--zuz-agent .--za-chat .--za-approval .--za-approval-command .--za-approval-tool {
  padding: 6px 9px;
  border-bottom: 1px solid var(--border-primary);
  font-family: var(--font-mono, monospace);
  font-size: 12px;
  opacity: 0.7;
}

.--zuz-agent .--za-chat .--za-approval .--za-approval-command pre {
  max-height: 150px;
  margin: 0;
  padding: 8px 9px;
  overflow: auto;
  font-family: var(--font-mono, monospace);
  font-size: 12px;
  white-space: pre-wrap;
}

.--zuz-agent .--za-chat .--za-approval .--za-approval-actions {
  justify-content: flex-end;
}

.--zuz-agent .--za-chat .--za-composer {
  background: var(--za-composer);
  width: var(--za-width, 100%);
  border: var(--za-border);
  border-radius: calc(var(--za-radius) / 2);
  margin: 0 auto;
  overflow: hidden;
}

.--zuz-agent .--za-chat .--za-composer .--za-composer-header {
  padding: 8px 10px 0;
  position: relative;
  z-index: 3;
}

.--zuz-agent .--za-chat .--za-composer .--za-border {
  inset: 0;
  z-index: 0;
  border-radius: 30px;
  background: conic-gradient(from 0deg, transparent 0deg 55deg, var(--vscode-focusBorder, var(--za-active-color-1)) 105deg, var(--za-active-color-2) 160deg, transparent 230deg 360deg);
  animation: spin var(--za-active-speed) linear infinite;
  filter: blur(var(--za-active-blur, 50px));
  opacity: 0;
}

.--zuz-agent .--za-chat .--za-composer .--za-border.--agent-running {
  opacity: 1;
}

.--zuz-agent .--za-chat .--za-composer .--za-shell {
  padding: 2px;
  border-radius: calc(var(--za-radius) / 2);
  z-index: 2;
}

.--zuz-agent .--za-chat .--za-composer .--za-composer-input {
  min-height: 75px !important;
  flex: 1 1;
  font-size: 16px;
  background: rgba(0, 0, 0, 0) !important;
  border: 0px !important;
}

.--zuz-agent .--za-chat .--za-composer .--za-composer-actions {
  padding: 2px 5px;
  border-top: var(--za-border);
}

.--zuz-agent .--za-chat .--za-composer .--za-composer-actions .--za-ca-l {
  flex: 1 1;
  gap: 8px;
}

.--zuz-agent .--za-chat .--za-composer .--za-composer-actions .--za-ca-l .--za-action-add {
  width: 24px;
  aspect-ratio: 1/1;
  font-size: var(--text-sm);
  border-radius: var(--radius-md);
  background: var(--za-action);
}

.--zuz-agent .--za-chat .--za-composer .--za-composer-actions .--za-ca-l .--za-action-add:hover {
  background: var(--za-action-hover);
}

body {
  --alert-gap: 10px;
  --critical-bg: #7f1d1d;
  --critical-color: #fff;
  --critical-border: #7f1d1d;
  --default-bg: var(--surface);
  --default-color: var(--text-primary);
  --default-border: 1px var(--border-primary);
  --draft-bg: color-mix(in srgb, #94a3b8 14%, var(--surface));
  --draft-color: color-mix(in srgb, #334155 88%, var(--text-primary));
  --draft-border: color-mix(in srgb, #94a3b8 32%, var(--border-primary));
  --error-bg: color-mix(in srgb, #ef4444 14%, var(--surface));
  --error-color: #b91c1c;
  --error-border: color-mix(in srgb, #ef4444 38%, var(--border-primary));
  --info-bg: color-mix(in srgb, #0ea5e9 14%, var(--surface));
  --info-color: #0369a1;
  --info-border: color-mix(in srgb, #0ea5e9 36%, var(--border-primary));
  --neutral-bg: color-mix(in srgb, #64748b 12%, var(--surface));
  --neutral-color: var(--text-primary);
  --neutral-border: color-mix(in srgb, #64748b 28%, var(--border-primary));
  --primary-bg: color-mix(in srgb, var(--primary) 14%, var(--surface));
  --primary-color: color-mix(in srgb, var(--primary) 82%, var(--text-primary));
  --primary-border: color-mix(in srgb, var(--primary) 34%, var(--border-primary));
  --secondary-bg: color-mix(in srgb, var(--text-secondary) 10%, var(--surface));
  --secondary-color: var(--text-secondary);
  --secondary-border: color-mix(in srgb, var(--text-secondary) 24%, var(--border-primary));
  --success-bg: color-mix(in srgb, #22c55e 14%, var(--surface));
  --success-color: #15803d;
  --success-border: color-mix(in srgb, #22c55e 34%, var(--border-primary));
  --tip-bg: color-mix(in srgb, #8b5cf6 14%, var(--surface));
  --tip-color: #6d28d9;
  --tip-border: color-mix(in srgb, #8b5cf6 34%, var(--border-primary));
  --warning-bg: color-mix(in srgb, #f59e0b 16%, var(--surface));
  --warning-color: #b45309;
  --warning-border: color-mix(in srgb, #f59e0b 36%, var(--border-primary));
}

.--alert {
  border: 1px var(--alert-border) solid;
  background-color: var(--alert-bg);
  color: var(--alert-color);
  gap: var(--alert-gap);
}

.--alert path {
  fill: var(--alert-color);
}

.--alert.--xs {
  font-size: var(--text-xs);
  padding: var(--padding-xs);
  border-radius: var(--radius-xs);
}

.--alert.--sm {
  font-size: var(--text-sm);
  padding: var(--padding-sm);
  border-radius: var(--radius-sm);
}

.--alert.--md {
  font-size: var(--text-md);
  padding: var(--padding-md);
  border-radius: var(--radius-md);
}

.--alert.--lg {
  font-size: var(--text-lg);
  padding: var(--padding-lg);
  border-radius: var(--radius-lg);
}

.--alert.--xl {
  font-size: var(--text-xl);
  padding: var(--padding-xl);
  border-radius: var(--radius-xl);
}

.--alert.--xxl {
  font-size: var(--text-xxl);
  padding: var(--padding-xxl);
  border-radius: var(--radius-xxl);
}

.--alert.--2xl {
  font-size: var(--text-2xl);
  padding: var(--padding-2xl);
  border-radius: var(--radius-2xl);
}

.--alert.--3xl {
  font-size: var(--text-3xl);
  padding: var(--padding-3xl);
  border-radius: var(--radius-3xl);
}

.--alert.--4xl {
  font-size: var(--text-4xl);
  padding: var(--padding-4xl);
  border-radius: var(--radius-4xl);
}

.--alert.--5xl {
  font-size: var(--text-5xl);
  padding: var(--padding-5xl);
  border-radius: var(--radius-5xl);
}

.--alert.--6xl {
  font-size: var(--text-6xl);
  padding: var(--padding-6xl);
  border-radius: var(--radius-6xl);
}

.--alert.--7xl {
  font-size: var(--text-7xl);
  padding: var(--padding-7xl);
  border-radius: var(--radius-7xl);
}

.--alert.--8xl {
  font-size: var(--text-8xl);
  padding: var(--padding-8xl);
  border-radius: var(--radius-8xl);
}

.--alert.--9xl {
  font-size: var(--text-9xl);
  padding: var(--padding-9xl);
  border-radius: var(--radius-9xl);
}

.--alert .--icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.--alert .--meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1 1;
}

.--alert .--meta .--title.--tm {
  font-weight: bold;
}

.--alert.--critical {
  --alert-border: var(--critical-border);
  --alert-bg: var(--critical-bg);
  --alert-color: var(--critical-color);
}

.--alert.--default {
  --alert-border: var(--default-border);
  --alert-bg: var(--default-bg);
  --alert-color: var(--default-color);
}

.--alert.--draft {
  --alert-border: var(--draft-border);
  --alert-bg: var(--draft-bg);
  --alert-color: var(--draft-color);
}

.--alert.--error {
  --alert-border: var(--error-border);
  --alert-bg: var(--error-bg);
  --alert-color: var(--error-color);
}

.--alert.--info {
  --alert-border: var(--info-border);
  --alert-bg: var(--info-bg);
  --alert-color: var(--info-color);
}

.--alert.--neutral {
  --alert-border: var(--neutral-border);
  --alert-bg: var(--neutral-bg);
  --alert-color: var(--neutral-color);
}

.--alert.--primary {
  --alert-border: var(--primary-border);
  --alert-bg: var(--primary-bg);
  --alert-color: var(--primary-color);
}

.--alert.--secondary {
  --alert-border: var(--secondary-border);
  --alert-bg: var(--secondary-bg);
  --alert-color: var(--secondary-color);
}

.--alert.--success {
  --alert-border: var(--success-border);
  --alert-bg: var(--success-bg);
  --alert-color: var(--success-color);
}

.--alert.--tip {
  --alert-border: var(--tip-border);
  --alert-bg: var(--tip-bg);
  --alert-color: var(--tip-color);
}

.--alert.--warning {
  --alert-border: var(--warning-border);
  --alert-bg: var(--warning-bg);
  --alert-color: var(--warning-color);
}

:root {
  --autocomplete-arrow: #111;
  --autocomplete-arrow-size-sm: 40px;
  --autocomplete-arrow-size-md: 24px;
  --autocomplete-arrow-size-lg: 30px;
  --autocomplete-item-hover: #d4d4d4;
}

.--autocomplete {
  width: 100%;
  background: var(--input);
  z-index: 2;
}

.--autocomplete .--arrow svg {
  fill: var(--autocomplete-arrow);
}

.--autocomplete.--sm {
  border-radius: var(--input-radius-sm);
}

.--autocomplete.--sm .--suggestion-list {
  border-radius: var(--input-radius-sm);
}

.--autocomplete.--sm .--arrow {
  width: var(--autocomplete-arrow-size-sm);
}

.--autocomplete.--sm .--arrow svg {
  width: calc(var(--autocomplete-arrow-size-sm) / 2.5);
}

.--autocomplete.--sm .--input {
  width: calc(100% - var(--autocomplete-arrow-size-sm));
}

.--autocomplete.--md {
  border-radius: var(--input-radius-md);
}

.--autocomplete.--md .--suggestion-list {
  border-radius: var(--input-radius-md);
}

.--autocomplete.--md .--arrow {
  width: var(--autocomplete-arrow-size-md);
}

.--autocomplete.--md .--arrow svg {
  width: calc(var(--autocomplete-arrow-size-md) / 2.5);
}

.--autocomplete.--md .--input {
  width: calc(100% - var(--autocomplete-arrow-size-md));
}

.--autocomplete.--lg {
  border-radius: var(--input-radius-lg);
}

.--autocomplete.--lg .--suggestion-list {
  border-radius: var(--input-radius-lg);
}

.--autocomplete.--lg .--arrow {
  width: var(--autocomplete-arrow-size-lg);
}

.--autocomplete.--lg .--arrow svg {
  width: calc(var(--autocomplete-arrow-size-lg) / 2.5);
}

.--autocomplete.--lg .--input {
  width: calc(100% - var(--autocomplete-arrow-size-lg));
}

.--autocomplete .--suggestion-list {
  left: 0px;
  right: 0px;
  background: var(--input);
  z-index: 2;
  padding: 8px 0px;
  overflow-x: hidden;
}

.--autocomplete .--suggestion-list li {
  cursor: pointer;
}

.--autocomplete .--suggestion-list li:hover {
  background: var(--autocomplete-item-hover);
}

.--autocomplete .--suggestion-list li.--current {
  background: var(--autocomplete-item-hover);
}

body {
  --avatar-bg: #e5e9ef;
  --avatar-text-size: 14px;
}

[color-scheme=dark] body {
  --avatar-bg: #3a3c41;
}

.--avatar {
  overflow: hidden;
  min-width: var(--avatar-size) !important;
  min-height: var(--avatar-size);
  max-width: var(--avatar-size);
  max-height: var(--avatar-size);
}

.--avatar.--circle {
  border-radius: 50%;
  corner-shape: round !important;
}

.--avatar.--circle img {
  border-radius: 50%;
}

.--avatar.--square {
  corner-shape: squircle !important;
  border-radius: calc(var(--avatar-size) * 2);
}

.--avatar.--square img {
  border-radius: calc(var(--avatar-size) * 2);
}

.--avatar.--xs {
  --avatar-size: 24px;
}

.--avatar.--sm {
  --avatar-size: 30px;
}

.--avatar.--md {
  --avatar-size: 48px;
}

.--avatar.--lg {
  --avatar-size: 72px;
}

.--avatar.--xl {
  --avatar-size: 96px;
}

.--avatar .--avatar-label {
  color: var(--avatar-label-color, var(--text-primary));
  font-size: var(--avatar-text-size);
  font-weight: 700;
}

body {
  --badge-success: var(--green-500);
  --badge-error: var(--red-500);
  --badge-idle: var(--orange-500);
  --badge-dead: var(--text-primary);
  --badge-opacity: 0.5;
  --badge-multiplier: 4px;
}

.--badge {
  --badge-color: var(--badge-dead);
  --badge-dot-opacity: 1;
  --badge-current-bg: var(--badge-color);
  --badge-current-border: 0px;
  --badge-current-color: #fff;
}

.--badge.--success {
  --badge-color: var(--badge-success);
}

.--badge.--error {
  --badge-color: var(--badge-error);
}

.--badge.--idle {
  --badge-color: var(--badge-idle);
}

.--badge.--dead {
  --badge-color: var(--badge-dead);
  --badge-dot-opacity: var(--badge-opacity);
}

.--badge.--solid {
  --badge-current-bg: var(--badge-color);
  --badge-current-color: #fff;
  --badge-current-border: 1px solid color-mix(in srgb, var(--badge-color) 24%, transparent);
}

.--badge.--subtle, .--badge.--surface {
  --badge-current-bg: color-mix(in srgb, var(--badge-color) 12%, var(--surface));
  --badge-current-border: 1px solid color-mix(in srgb, var(--badge-color) 24%, transparent);
  --badge-current-color: var(--badge-color);
}

.--badge.--outline, .--badge.--ghost {
  --badge-current-bg: transparent;
  --badge-current-border: 1px solid color-mix(in srgb, var(--badge-color) 32%, transparent);
  --badge-current-color: var(--badge-color);
}

.--badge.--plain {
  --badge-current-bg: transparent;
  --badge-current-border: 0px;
  --badge-current-color: var(--badge-color);
}

.--badge.--xs {
  --badge-text-size: var(--text-xs);
  --badge-radius: var(--badge-radius-xs, var(--radius-xs));
}

.--badge.--xs .--label {
  font-size: var(--badge-text-xs, var(--text-xs));
  padding: var(--badge-padding-xs, var(--padding-xs));
}

.--badge.--xs .--icon {
  padding-left: var(--padding-xs-x);
}

.--badge.--sm {
  --badge-text-size: var(--text-sm);
  --badge-radius: var(--badge-radius-sm, var(--radius-sm));
}

.--badge.--sm .--label {
  font-size: var(--badge-text-sm, var(--text-sm));
  padding: var(--badge-padding-sm, var(--padding-sm));
}

.--badge.--sm .--icon {
  padding-left: var(--padding-sm-x);
}

.--badge.--md {
  --badge-text-size: var(--text-md);
  --badge-radius: var(--badge-radius-md, var(--radius-md));
}

.--badge.--md .--label {
  font-size: var(--badge-text-md, var(--text-md));
  padding: var(--badge-padding-md, var(--padding-md));
}

.--badge.--md .--icon {
  padding-left: var(--padding-md-x);
}

.--badge.--lg {
  --badge-text-size: var(--text-lg);
  --badge-radius: var(--badge-radius-lg, var(--radius-lg));
}

.--badge.--lg .--label {
  font-size: var(--badge-text-lg, var(--text-lg));
  padding: var(--badge-padding-lg, var(--padding-lg));
}

.--badge.--lg .--icon {
  padding-left: var(--padding-lg-x);
}

.--badge.--xl {
  --badge-text-size: var(--text-xl);
  --badge-radius: var(--badge-radius-xl, var(--radius-xl));
}

.--badge.--xl .--label {
  font-size: var(--badge-text-xl, var(--text-xl));
  padding: var(--badge-padding-xl, var(--padding-xl));
}

.--badge.--xl .--icon {
  padding-left: var(--padding-xl-x);
}

.--badge.--xxl {
  --badge-text-size: var(--text-xxl);
  --badge-radius: var(--badge-radius-xxl, var(--radius-xxl));
}

.--badge.--xxl .--label {
  font-size: var(--badge-text-xxl, var(--text-xxl));
  padding: var(--badge-padding-xxl, var(--padding-xxl));
}

.--badge.--xxl .--icon {
  padding-left: var(--padding-xxl-x);
}

.--badge.--2xl {
  --badge-text-size: var(--text-2xl);
  --badge-radius: var(--badge-radius-2xl, var(--radius-2xl));
}

.--badge.--2xl .--label {
  font-size: var(--badge-text-2xl, var(--text-2xl));
  padding: var(--badge-padding-2xl, var(--padding-2xl));
}

.--badge.--2xl .--icon {
  padding-left: var(--padding-2xl-x);
}

.--badge.--3xl {
  --badge-text-size: var(--text-3xl);
  --badge-radius: var(--badge-radius-3xl, var(--radius-3xl));
}

.--badge.--3xl .--label {
  font-size: var(--badge-text-3xl, var(--text-3xl));
  padding: var(--badge-padding-3xl, var(--padding-3xl));
}

.--badge.--3xl .--icon {
  padding-left: var(--padding-3xl-x);
}

.--badge.--4xl {
  --badge-text-size: var(--text-4xl);
  --badge-radius: var(--badge-radius-4xl, var(--radius-4xl));
}

.--badge.--4xl .--label {
  font-size: var(--badge-text-4xl, var(--text-4xl));
  padding: var(--badge-padding-4xl, var(--padding-4xl));
}

.--badge.--4xl .--icon {
  padding-left: var(--padding-4xl-x);
}

.--badge.--5xl {
  --badge-text-size: var(--text-5xl);
  --badge-radius: var(--badge-radius-5xl, var(--radius-5xl));
}

.--badge.--5xl .--label {
  font-size: var(--badge-text-5xl, var(--text-5xl));
  padding: var(--badge-padding-5xl, var(--padding-5xl));
}

.--badge.--5xl .--icon {
  padding-left: var(--padding-5xl-x);
}

.--badge.--6xl {
  --badge-text-size: var(--text-6xl);
  --badge-radius: var(--badge-radius-6xl, var(--radius-6xl));
}

.--badge.--6xl .--label {
  font-size: var(--badge-text-6xl, var(--text-6xl));
  padding: var(--badge-padding-6xl, var(--padding-6xl));
}

.--badge.--6xl .--icon {
  padding-left: var(--padding-6xl-x);
}

.--badge.--7xl {
  --badge-text-size: var(--text-7xl);
  --badge-radius: var(--badge-radius-7xl, var(--radius-7xl));
}

.--badge.--7xl .--label {
  font-size: var(--badge-text-7xl, var(--text-7xl));
  padding: var(--badge-padding-7xl, var(--padding-7xl));
}

.--badge.--7xl .--icon {
  padding-left: var(--padding-7xl-x);
}

.--badge.--8xl {
  --badge-text-size: var(--text-8xl);
  --badge-radius: var(--badge-radius-8xl, var(--radius-8xl));
}

.--badge.--8xl .--label {
  font-size: var(--badge-text-8xl, var(--text-8xl));
  padding: var(--badge-padding-8xl, var(--padding-8xl));
}

.--badge.--8xl .--icon {
  padding-left: var(--padding-8xl-x);
}

.--badge.--9xl {
  --badge-text-size: var(--text-9xl);
  --badge-radius: var(--badge-radius-9xl, var(--radius-9xl));
}

.--badge.--9xl .--label {
  font-size: var(--badge-text-9xl, var(--text-9xl));
  padding: var(--badge-padding-9xl, var(--padding-9xl));
}

.--badge.--9xl .--icon {
  padding-left: var(--padding-9xl-x);
}

.--badge:has(.--dot) {
  min-width: calc(var(--badge-size) * var(--badge-multiplier)) !important;
  min-height: calc(var(--badge-size) * var(--badge-multiplier));
  max-width: calc(var(--badge-size) * var(--badge-multiplier));
  max-height: calc(var(--badge-size) * var(--badge-multiplier));
}

.--badge:has(.--label) {
  border-radius: var(--badge-radius);
  background: var(--badge-current-bg);
  border: var(--badge-current-border);
}

.--badge .--dot {
  --badge-corner: round;
  --badge-radius: 50%;
  corner-shape: var(--badge-corner) !important;
  border-radius: var(--badge-radius);
  min-width: calc(var(--badge-size) * 1px) !important;
  min-height: calc(var(--badge-size) * 1px);
  max-width: calc(var(--badge-size) * 1px);
  max-height: calc(var(--badge-size) * 1px);
  background: var(--badge-color);
  opacity: var(--badge-dot-opacity);
}

.--badge .--icon {
  color: var(--badge-current-color);
}

.--badge .--label {
  color: var(--badge-current-color);
  white-space: pre;
}

.--badge {
  --icon-color-1: var(--badge-current-color);
  --icon-color-2: rgb(from var(--icon-color-1) r g b / var(--icon-alpha, 0.5));
}

body {
  --button: var(--primary, var(--red-700));
  --button-hover: var(--primary-hover, var(--red-800));
  --button-border: 0px;
  --button-color: white;
  --button-disabled: var(--gray-200);
  --button-disabled-color: var(--gray-400);
  --button-gap-xs: 4px;
  --button-gap-sm: 6px;
  --button-gap-md: 8px;
  --button-gap-lg: 10px;
  --button-gap-xl: 10px;
  --button-ghost-hover: var(--surface);
}

[color-scheme=dark] body {
  --button-disabled: var(--gray-900);
  --button-disabled-color: var(--gray-800);
}

.--button {
  --button-current-bg: var(--button);
  --button-current-hover: var(--button-hover);
  --button-current-border: var(--button-border);
  --button-current-color: var(--button-color);
  --button-current-disabled-bg: var(--button-disabled);
  --button-current-disabled-color: var(--button-disabled-color);
  --button-current-disabled-border: var(--button-border);
  --icon-color-1: var(--button-current-color);
  --icon-color-2: rgb(from var(--icon-color-1) r g b / var(--icon-alpha, 0.5));
  width: fit-content;
}

.--button.--xs {
  padding: var(--padding-xs);
  font-size: var(--text-size-custom, var(--text-xs));
  border-radius: var(--radius-xs);
  gap: var(--button-gap-xs);
}

.--button.--sm {
  padding: var(--padding-sm);
  font-size: var(--text-size-custom, var(--text-sm));
  border-radius: var(--radius-sm);
  gap: var(--button-gap-sm);
}

.--button.--md {
  padding: var(--padding-md);
  font-size: var(--text-size-custom, var(--text-md));
  border-radius: var(--radius-md);
  gap: var(--button-gap-md);
}

.--button.--lg {
  padding: var(--padding-lg);
  font-size: var(--text-size-custom, var(--text-lg));
  border-radius: var(--radius-lg);
  gap: var(--button-gap-lg);
}

.--button.--xl {
  padding: var(--padding-xl);
  font-size: var(--text-size-custom, var(--text-xl));
  border-radius: var(--radius-xl);
  gap: var(--button-gap-xl);
}

.--button.--xxl {
  padding: var(--padding-xxl);
  font-size: var(--text-size-custom, var(--text-xxl));
  border-radius: var(--radius-xxl);
  gap: var(--button-gap-xxl);
}

.--button.--2xl {
  padding: var(--padding-2xl);
  font-size: var(--text-size-custom, var(--text-2xl));
  border-radius: var(--radius-2xl);
  gap: var(--button-gap-2xl);
}

.--button.--3xl {
  padding: var(--padding-3xl);
  font-size: var(--text-size-custom, var(--text-3xl));
  border-radius: var(--radius-3xl);
  gap: var(--button-gap-3xl);
}

.--button.--4xl {
  padding: var(--padding-4xl);
  font-size: var(--text-size-custom, var(--text-4xl));
  border-radius: var(--radius-4xl);
  gap: var(--button-gap-4xl);
}

.--button.--5xl {
  padding: var(--padding-5xl);
  font-size: var(--text-size-custom, var(--text-5xl));
  border-radius: var(--radius-5xl);
  gap: var(--button-gap-5xl);
}

.--button.--6xl {
  padding: var(--padding-6xl);
  font-size: var(--text-size-custom, var(--text-6xl));
  border-radius: var(--radius-6xl);
  gap: var(--button-gap-6xl);
}

.--button.--7xl {
  padding: var(--padding-7xl);
  font-size: var(--text-size-custom, var(--text-7xl));
  border-radius: var(--radius-7xl);
  gap: var(--button-gap-7xl);
}

.--button.--8xl {
  padding: var(--padding-8xl);
  font-size: var(--text-size-custom, var(--text-8xl));
  border-radius: var(--radius-8xl);
  gap: var(--button-gap-8xl);
}

.--button.--9xl {
  padding: var(--padding-9xl);
  font-size: var(--text-size-custom, var(--text-9xl));
  border-radius: var(--radius-9xl);
  gap: var(--button-gap-9xl);
}

.--button {
  border: var(--button-current-border);
  background: var(--button-current-bg);
  color: var(--button-current-color);
  white-space: pre;
  cursor: pointer;
}

.--button:hover {
  background: var(--button-current-hover);
}

.--button:not(.--skeleton):disabled {
  background: var(--button-current-disabled-bg);
  color: var(--button-current-disabled-color);
  border: var(--button-current-disabled-border);
  cursor: auto !important;
  --icon-color-1: rgb(from var(--button-current-color) r g b / 0.3);
  --icon-color-2: rgb(from var(--icon-color-1) r g b / var(--icon-alpha, 0.5));
}

.--button.--solid {
  --button-current-bg: var(--button);
  --button-current-hover: var(--button-hover);
  --button-current-border: var(--button-border);
  --button-current-color: var(--button-color);
  --button-current-disabled-bg: var(--button-disabled);
  --button-current-disabled-color: var(--button-disabled-color);
  --button-current-disabled-border: var(--button-border);
}

.--button.--subtle {
  --button-current-bg: var(--surface-hover);
  --button-current-hover: var(--surface);
  --button-current-border: 1px solid var(--surface-hover);
  --button-current-color: var(--text-primary);
  --button-current-disabled-bg: var(--button-disabled);
  --button-current-disabled-color: var(--button-disabled-color);
  --button-current-disabled-border: 1px solid var(--button-disabled);
}

.--button.--surface {
  --button-current-bg: var(--surface);
  --button-current-hover: var(--surface-hover);
  --button-current-border: 1px solid var(--button-border-primary, var(--border-primary));
  --button-current-color: var(--text-primary);
  --button-current-disabled-bg: var(--button-disabled);
  --button-current-disabled-color: var(--button-disabled-color);
  --button-current-disabled-border: 1px solid var(--button-disabled);
}

.--button.--outline {
  --button-current-bg: transparent;
  --button-current-hover: var(--surface-hover);
  --button-current-border: 1px solid var(--button-border-primary, var(--border-primary));
  --button-current-color: var(--text-primary);
  --button-current-disabled-bg: transparent;
  --button-current-disabled-color: var(--button-disabled-color);
  --button-current-disabled-border: 1px solid var(--button-disabled-color);
}

.--button.--outline-reverse {
  --button-current-bg: var(--surface-hover);
  --button-current-hover: transparent;
  --button-current-border: 1px solid var(--button-border-primary, var(--border-primary));
  --button-current-color: var(--button);
  --button-current-disabled-bg: transparent;
  --button-current-disabled-color: var(--button-disabled-color);
  --button-current-disabled-border: 1px solid var(--button-disabled-color);
}

.--button.--plain {
  --button-current-bg: transparent;
  --button-current-hover: transparent;
  --button-current-border: 0px;
  --button-current-color: var(--text-primary);
  --button-current-disabled-bg: transparent;
  --button-current-disabled-color: var(--button-disabled-color);
  --button-current-disabled-border: 0px;
  padding: 0px !important;
}

.--button.--link {
  --button-current-bg: transparent;
  --button-current-hover: transparent;
  --button-current-border: 0px;
  --button-current-color: var(--link-color, var(--text-primary));
  --button-current-disabled-bg: transparent;
  --button-current-disabled-color: var(--button-disabled-color);
  --button-current-disabled-border: 0px;
  padding: 0px !important;
}

.--button.--link:hover {
  text-decoration: underline;
}

.--button.--ghost {
  --button-current-bg: transparent;
  --button-current-hover: var(--button-ghost-hover);
  --button-current-border: 1px solid transparent;
  --button-current-color: var(--text-primary);
  --button-current-disabled-bg: transparent;
  --button-current-disabled-color: var(--button-disabled-color);
  --button-current-disabled-border: 1px solid transparent;
}

body {
  --calendar: var(--gray-200);
  --calendar-selector: #fff;
  --calendar-selected-day-bg: var(--blue-700);
  --calendar-selected-day-color: #fff;
  --calendar-current-day-bg: #fff;
  --calendar-current-day-color: var(--text);
}

[color-scheme=dark] body {
  --calendar: var(--gray-800);
  --calendar-selector: var(--gray-700);
  --calendar-current-day-bg: var(--gray-600);
  --calendar-current-day-color: var(--text);
}

.--calendar {
  background-color: var(--calendar);
  overflow: hidden;
  border: 1px var(--calendar-border, var(--border-primary)) solid;
}

.--calendar .--calendar-quick-select {
  width: 220px;
}

.--calendar .--calendar-quick-select .--button {
  background: rgba(0, 0, 0, 0) !important;
  color: var(--text-primary);
  width: 100%;
  text-align: left !important;
}

.--calendar .--calendar-quick-select .--button:hover {
  background: var(--calendar-selector) !important;
}

.--calendar .--calendar-quick-select .--button:disabled {
  opacity: 0.35;
  color: var(--button-disabled-color) !important;
  cursor: auto !important;
}

.--calendar .--calendar-quick-select .--button:disabled:hover {
  background: rgba(0, 0, 0, 0) !important;
}

.--calendar .--calendar-selector {
  width: 275px;
  background: var(--calendar-selector);
}

.--calendar .--calendar-selector .--calendar-head .--button {
  background: rgba(0, 0, 0, 0) !important;
  color: var(--text-primary);
  padding: 2px !important;
}

.--calendar .--calendar-selector .--calendar-head .--button.--calendar-chevron {
  width: 30px;
  height: 30px;
}

.--calendar .--calendar-selector .--calendar-head .--button.--calendar-chevron svg {
  width: 100%;
  fill: var(--text-primary);
}

.--calendar .--calendar-selector .--calendar-head .--button:hover {
  background: var(--calendar) !important;
}

.--calendar .--calendar-selector .--calendar-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  padding: 8px 0px;
  align-items: stretch;
  flex: 1 1;
  gap: 2px;
}

.--calendar .--calendar-selector .--calendar-days .--calendar-day {
  text-align: center;
  color: var(--text-primary);
  background: rgba(0, 0, 0, 0) !important;
  color: var(--text-primary);
  padding: 2px !important;
  width: 100%;
  height: 100%;
}

.--calendar .--calendar-selector .--calendar-days .--calendar-day:not(.--calendar-dd) {
  font-weight: 600;
}

.--calendar .--calendar-selector .--calendar-days .--calendar-day:is(button):hover {
  background: var(--calendar) !important;
}

.--calendar .--calendar-selector .--calendar-days .--calendar-day:is(button):disabled {
  opacity: 0.35;
  cursor: auto !important;
}

.--calendar .--calendar-selector .--calendar-days .--calendar-day:is(button):disabled:hover {
  background: rgba(0, 0, 0, 0) !important;
}

.--calendar .--calendar-selector .--calendar-days .--calendar-day.--calendar-dd-selected {
  background: var(--calendar-selected-day-bg) !important;
  color: var(--calendar-selected-day-color) !important;
}

.--calendar .--calendar-selector .--calendar-days .--calendar-day.--calendar-dd-selected:hover {
  background: var(--calendar-selected-day-bg) !important;
  color: var(--calendar-selected-day-color) !important;
}

.--calendar .--calendar-selector .--calendar-days .--calendar-day.--calendar-dd-range {
  background: color-mix(in srgb, var(--calendar-selected-day-bg) 16%, transparent) !important;
}

.--calendar .--calendar-selector .--calendar-days .--calendar-day.--calendar-dd-range-start, .--calendar .--calendar-selector .--calendar-days .--calendar-day.--calendar-dd-range-end {
  position: relative;
  z-index: 2;
}

.--calendar .--calendar-selector .--calendar-days .--calendar-day.--calendar-dd-current:not(.--calendar-dd-selected) {
  background: var(--calendar-current-day-bg) !important;
  color: var(--calendar-current-day-color) !important;
}

.--calendar.--xs {
  border-radius: var(--calendar-radius-xs, var(--radius-xs));
  font-size: var(--text-xs);
}

.--calendar.--xs .--calendar-quick-select {
  padding: var(--padding-xs);
}

.--calendar.--xs .--calendar-quick-select .--button {
  border-radius: var(--radius-xs);
}

.--calendar.--xs .--calendar-selector {
  padding: var(--padding-xs);
}

.--calendar.--xs .--calendar-selector .--calendar-head .--calendar-cm {
  padding-left: var(--padding-xs);
}

.--calendar.--xs .--calendar-selector .--calendar-head .--button {
  border-radius: var(--radius-xs);
}

.--calendar.--xs .--calendar-day {
  border-radius: var(--radius-xs);
}

.--calendar.--sm {
  border-radius: var(--calendar-radius-sm, var(--radius-sm));
  font-size: var(--text-sm);
}

.--calendar.--sm .--calendar-quick-select {
  padding: var(--padding-sm);
}

.--calendar.--sm .--calendar-quick-select .--button {
  border-radius: var(--radius-sm);
}

.--calendar.--sm .--calendar-selector {
  padding: var(--padding-sm);
}

.--calendar.--sm .--calendar-selector .--calendar-head .--calendar-cm {
  padding-left: var(--padding-sm);
}

.--calendar.--sm .--calendar-selector .--calendar-head .--button {
  border-radius: var(--radius-sm);
}

.--calendar.--sm .--calendar-day {
  border-radius: var(--radius-sm);
}

.--calendar.--md {
  border-radius: var(--calendar-radius-md, var(--radius-md));
  font-size: var(--text-md);
}

.--calendar.--md .--calendar-quick-select {
  padding: var(--padding-md);
}

.--calendar.--md .--calendar-quick-select .--button {
  border-radius: var(--radius-md);
}

.--calendar.--md .--calendar-selector {
  padding: var(--padding-md);
}

.--calendar.--md .--calendar-selector .--calendar-head .--calendar-cm {
  padding-left: var(--padding-md);
}

.--calendar.--md .--calendar-selector .--calendar-head .--button {
  border-radius: var(--radius-md);
}

.--calendar.--md .--calendar-day {
  border-radius: var(--radius-md);
}

.--calendar.--lg {
  border-radius: var(--calendar-radius-lg, var(--radius-lg));
  font-size: var(--text-lg);
}

.--calendar.--lg .--calendar-quick-select {
  padding: var(--padding-lg);
}

.--calendar.--lg .--calendar-quick-select .--button {
  border-radius: var(--radius-lg);
}

.--calendar.--lg .--calendar-selector {
  padding: var(--padding-lg);
}

.--calendar.--lg .--calendar-selector .--calendar-head .--calendar-cm {
  padding-left: var(--padding-lg);
}

.--calendar.--lg .--calendar-selector .--calendar-head .--button {
  border-radius: var(--radius-lg);
}

.--calendar.--lg .--calendar-day {
  border-radius: var(--radius-lg);
}

.--calendar.--xl {
  border-radius: var(--calendar-radius-xl, var(--radius-xl));
  font-size: var(--text-xl);
}

.--calendar.--xl .--calendar-quick-select {
  padding: var(--padding-xl);
}

.--calendar.--xl .--calendar-quick-select .--button {
  border-radius: var(--radius-xl);
}

.--calendar.--xl .--calendar-selector {
  padding: var(--padding-xl);
}

.--calendar.--xl .--calendar-selector .--calendar-head .--calendar-cm {
  padding-left: var(--padding-xl);
}

.--calendar.--xl .--calendar-selector .--calendar-head .--button {
  border-radius: var(--radius-xl);
}

.--calendar.--xl .--calendar-day {
  border-radius: var(--radius-xl);
}

.--calendar.--xxl {
  border-radius: var(--calendar-radius-xxl, var(--radius-xxl));
  font-size: var(--text-xxl);
}

.--calendar.--xxl .--calendar-quick-select {
  padding: var(--padding-xxl);
}

.--calendar.--xxl .--calendar-quick-select .--button {
  border-radius: var(--radius-xxl);
}

.--calendar.--xxl .--calendar-selector {
  padding: var(--padding-xxl);
}

.--calendar.--xxl .--calendar-selector .--calendar-head .--calendar-cm {
  padding-left: var(--padding-xxl);
}

.--calendar.--xxl .--calendar-selector .--calendar-head .--button {
  border-radius: var(--radius-xxl);
}

.--calendar.--xxl .--calendar-day {
  border-radius: var(--radius-xxl);
}

.--calendar.--2xl {
  border-radius: var(--calendar-radius-2xl, var(--radius-2xl));
  font-size: var(--text-2xl);
}

.--calendar.--2xl .--calendar-quick-select {
  padding: var(--padding-2xl);
}

.--calendar.--2xl .--calendar-quick-select .--button {
  border-radius: var(--radius-2xl);
}

.--calendar.--2xl .--calendar-selector {
  padding: var(--padding-2xl);
}

.--calendar.--2xl .--calendar-selector .--calendar-head .--calendar-cm {
  padding-left: var(--padding-2xl);
}

.--calendar.--2xl .--calendar-selector .--calendar-head .--button {
  border-radius: var(--radius-2xl);
}

.--calendar.--2xl .--calendar-day {
  border-radius: var(--radius-2xl);
}

.--calendar.--3xl {
  border-radius: var(--calendar-radius-3xl, var(--radius-3xl));
  font-size: var(--text-3xl);
}

.--calendar.--3xl .--calendar-quick-select {
  padding: var(--padding-3xl);
}

.--calendar.--3xl .--calendar-quick-select .--button {
  border-radius: var(--radius-3xl);
}

.--calendar.--3xl .--calendar-selector {
  padding: var(--padding-3xl);
}

.--calendar.--3xl .--calendar-selector .--calendar-head .--calendar-cm {
  padding-left: var(--padding-3xl);
}

.--calendar.--3xl .--calendar-selector .--calendar-head .--button {
  border-radius: var(--radius-3xl);
}

.--calendar.--3xl .--calendar-day {
  border-radius: var(--radius-3xl);
}

.--calendar.--4xl {
  border-radius: var(--calendar-radius-4xl, var(--radius-4xl));
  font-size: var(--text-4xl);
}

.--calendar.--4xl .--calendar-quick-select {
  padding: var(--padding-4xl);
}

.--calendar.--4xl .--calendar-quick-select .--button {
  border-radius: var(--radius-4xl);
}

.--calendar.--4xl .--calendar-selector {
  padding: var(--padding-4xl);
}

.--calendar.--4xl .--calendar-selector .--calendar-head .--calendar-cm {
  padding-left: var(--padding-4xl);
}

.--calendar.--4xl .--calendar-selector .--calendar-head .--button {
  border-radius: var(--radius-4xl);
}

.--calendar.--4xl .--calendar-day {
  border-radius: var(--radius-4xl);
}

.--calendar.--5xl {
  border-radius: var(--calendar-radius-5xl, var(--radius-5xl));
  font-size: var(--text-5xl);
}

.--calendar.--5xl .--calendar-quick-select {
  padding: var(--padding-5xl);
}

.--calendar.--5xl .--calendar-quick-select .--button {
  border-radius: var(--radius-5xl);
}

.--calendar.--5xl .--calendar-selector {
  padding: var(--padding-5xl);
}

.--calendar.--5xl .--calendar-selector .--calendar-head .--calendar-cm {
  padding-left: var(--padding-5xl);
}

.--calendar.--5xl .--calendar-selector .--calendar-head .--button {
  border-radius: var(--radius-5xl);
}

.--calendar.--5xl .--calendar-day {
  border-radius: var(--radius-5xl);
}

.--calendar.--6xl {
  border-radius: var(--calendar-radius-6xl, var(--radius-6xl));
  font-size: var(--text-6xl);
}

.--calendar.--6xl .--calendar-quick-select {
  padding: var(--padding-6xl);
}

.--calendar.--6xl .--calendar-quick-select .--button {
  border-radius: var(--radius-6xl);
}

.--calendar.--6xl .--calendar-selector {
  padding: var(--padding-6xl);
}

.--calendar.--6xl .--calendar-selector .--calendar-head .--calendar-cm {
  padding-left: var(--padding-6xl);
}

.--calendar.--6xl .--calendar-selector .--calendar-head .--button {
  border-radius: var(--radius-6xl);
}

.--calendar.--6xl .--calendar-day {
  border-radius: var(--radius-6xl);
}

.--calendar.--7xl {
  border-radius: var(--calendar-radius-7xl, var(--radius-7xl));
  font-size: var(--text-7xl);
}

.--calendar.--7xl .--calendar-quick-select {
  padding: var(--padding-7xl);
}

.--calendar.--7xl .--calendar-quick-select .--button {
  border-radius: var(--radius-7xl);
}

.--calendar.--7xl .--calendar-selector {
  padding: var(--padding-7xl);
}

.--calendar.--7xl .--calendar-selector .--calendar-head .--calendar-cm {
  padding-left: var(--padding-7xl);
}

.--calendar.--7xl .--calendar-selector .--calendar-head .--button {
  border-radius: var(--radius-7xl);
}

.--calendar.--7xl .--calendar-day {
  border-radius: var(--radius-7xl);
}

.--calendar.--8xl {
  border-radius: var(--calendar-radius-8xl, var(--radius-8xl));
  font-size: var(--text-8xl);
}

.--calendar.--8xl .--calendar-quick-select {
  padding: var(--padding-8xl);
}

.--calendar.--8xl .--calendar-quick-select .--button {
  border-radius: var(--radius-8xl);
}

.--calendar.--8xl .--calendar-selector {
  padding: var(--padding-8xl);
}

.--calendar.--8xl .--calendar-selector .--calendar-head .--calendar-cm {
  padding-left: var(--padding-8xl);
}

.--calendar.--8xl .--calendar-selector .--calendar-head .--button {
  border-radius: var(--radius-8xl);
}

.--calendar.--8xl .--calendar-day {
  border-radius: var(--radius-8xl);
}

.--calendar.--9xl {
  border-radius: var(--calendar-radius-9xl, var(--radius-9xl));
  font-size: var(--text-9xl);
}

.--calendar.--9xl .--calendar-quick-select {
  padding: var(--padding-9xl);
}

.--calendar.--9xl .--calendar-quick-select .--button {
  border-radius: var(--radius-9xl);
}

.--calendar.--9xl .--calendar-selector {
  padding: var(--padding-9xl);
}

.--calendar.--9xl .--calendar-selector .--calendar-head .--calendar-cm {
  padding-left: var(--padding-9xl);
}

.--calendar.--9xl .--calendar-selector .--calendar-head .--button {
  border-radius: var(--radius-9xl);
}

.--calendar.--9xl .--calendar-day {
  border-radius: var(--radius-9xl);
}

@keyframes carouselEntry {
  from {
    translate: 0 0 -500px;
    scale: 0;
  }
  to {
    scale: 1;
  }
}
.--carousel {
  --carousel-spacing: 160px;
  --carousel-rotation: 20deg;
  --carousel-scale-step: 0.15;
  --carousel-height: 500px;
  --carousel-perspective: 1200px;
  --carousel-transition: var(--power);
  --carousel-speed: 0.5s;
  --carousel-brightness: 0.2;
  --carousel-blur: 4px;
  width: 100%;
  height: 100%;
  min-height: var(--carousel-height);
}

@media (max-width: 1024px) {
  .--carousel {
    --carousel-spacing: 120px;
  }
}
@media (max-width: 768px) {
  .--carousel {
    --carousel-spacing: 80px;
    --carousel-rotation: 30deg;
    --carousel-perspective: 800px;
  }
}
.--carousel .--carousel-stage {
  transform-style: preserve-3d;
  height: var(--carousel-height);
  width: 100%;
  flex: 1 1;
  perspective: var(--carousel-perspective);
}

.--carousel .--carousel-item-wrapper {
  opacity: 0;
  animation: carouselEntry 1s var(--power) backwards;
}

.--carousel .--carousel-item-wrapper:nth-child(1) {
  animation-delay: 0.08s;
}

.--carousel .--carousel-item-wrapper:nth-child(2) {
  animation-delay: 0.16s;
}

.--carousel .--carousel-item-wrapper:nth-child(3) {
  animation-delay: 0.24s;
}

.--carousel .--carousel-item-wrapper:nth-child(4) {
  animation-delay: 0.32s;
}

.--carousel .--carousel-item-wrapper:nth-child(5) {
  animation-delay: 0.4s;
}

.--carousel .--carousel-item-wrapper:nth-child(6) {
  animation-delay: 0.48s;
}

.--carousel .--carousel-item-wrapper:nth-child(7) {
  animation-delay: 0.56s;
}

.--carousel .--carousel-item-wrapper:nth-child(8) {
  animation-delay: 0.64s;
}

.--carousel .--carousel-item-wrapper:nth-child(9) {
  animation-delay: 0.72s;
}

.--carousel .--carousel-item-wrapper:nth-child(10) {
  animation-delay: 0.8s;
}

.--carousel .--carousel-item-wrapper:nth-child(11) {
  animation-delay: 0.88s;
}

.--carousel .--carousel-item-wrapper:nth-child(12) {
  animation-delay: 0.96s;
}

.--carousel .--carousel-item-wrapper:nth-child(13) {
  animation-delay: 1.04s;
}

.--carousel .--carousel-item-wrapper:nth-child(14) {
  animation-delay: 1.12s;
}

.--carousel .--carousel-item-wrapper:nth-child(15) {
  animation-delay: 1.2s;
}

.--carousel .--carousel-item-wrapper:nth-child(16) {
  animation-delay: 1.28s;
}

.--carousel .--carousel-item-wrapper:nth-child(17) {
  animation-delay: 1.36s;
}

.--carousel .--carousel-item-wrapper:nth-child(18) {
  animation-delay: 1.44s;
}

.--carousel .--carousel-item-wrapper:nth-child(19) {
  animation-delay: 1.52s;
}

.--carousel .--carousel-item-wrapper:nth-child(20) {
  animation-delay: 1.6s;
}

.--carousel .--carousel-item-wrapper {
  transition-property: transform, opacity, filter;
  transition-duration: var(--carousel-speed);
  transition-timing-function: var(--carousel-transition), ease, ease;
  transition-delay: 0s;
  will-change: transform;
}

.--carousel .--carousel-item-wrapper:not(.--is-active) {
  opacity: calc(1 - var(--abs-offset) * 0.25);
}

.--carousel .--carousel-item-wrapper.--is-active {
  filter: brightness(1) blur(0px) !important;
  opacity: 1 !important;
}

.--carousel .--carousel-item-wrapper {
  --abs-offset: max(var(--offset), -1 * var(--offset));
  --direction: clamp(-1, var(--offset), 1);
  --current-rotation: calc(clamp(0, var(--abs-offset), 1) * var(--carousel-rotation) * var(--direction) * -1);
  --z-depth: calc(200px - (var(--abs-offset) * 100px));
  --extra-push: calc(clamp(0, var(--abs-offset), 1) * 40px);
  transform: translateX(calc(var(--offset) * var(--carousel-spacing) + var(--direction) * var(--extra-push))) scale(calc(1 - var(--abs-offset) * var(--carousel-scale-step))) rotateY(var(--current-rotation)) translateZ(var(--z-depth));
  opacity: calc(1 - var(--abs-offset) * 0.25);
  pointer-events: none;
}

.--carousel .--carousel-item-wrapper.--is-active {
  pointer-events: auto;
}

.--carousel.--loop-infinite .--carousel-item-wrapper[style*="--offset: 5"], .--carousel.--loop-infinite .--carousel-item-wrapper[style*="--offset: -5"] {
  opacity: 0;
  transition: none;
}

.--carousel.--effect-coverflow .--carousel-item-wrapper {
  filter: blur(calc(var(--abs-offset, 0) * var(--carousel-blur, 1px))) brightness(calc(1 - var(--abs-offset, 0) * var(--carousel-brightness, 0.2)));
}

:root {
  --bubble-me: var(--green-800);
  --bubble-you: var(--gray-800);
  --bubble-text-color: #fff;
  --bubble-me-text-color: var(--bubble-text-color);
  --bubble-you-text-color: var(--bubble-text-color);
  --bubble-padding: 6px 10px;
  --bubble-audio-padding: var(--bubble-padding);
  --bubble-image-padding: 4px;
  --bubble-radius-default: 10px;
  --bubble-text-size: 14px;
  --bubble-stamp-size: 11px;
  --bubble-arrow-size: 1em;
  --bubble-tick-size: 16px;
  --bubble-tick-color: rgba(255, 255, 255, 0.5);
  --bubble-tick-read-color: #77ff4a;
  --bubble-duration-text-size: var(--bubble-stamp-size);
  --bubble-max-size: 200px;
  --bubble-name-margin: 0px 0px 3px 0px;
}

.--bubble-wrapper {
  margin: 2px 0;
}

.--bubble-wrapper.--bw-me {
  align-items: flex-end;
  justify-content: flex-end;
}

.--bubble-wrapper.--bw-me .--avatar {
  --avatar-bg: var(--bubble-avatar-bg, var(--bubble-avatar-bg-me));
}

.--bubble-wrapper.--bw-me {
  --bubble-radius: var(--bubble-radius-me, var(--bubble-radius-default));
  --bubble-stamp-color: var(--bubble-stamp-color-me, var(--text-primary-inverted));
}

.--bubble-wrapper.--bw-you {
  --bubble-radius: var(--bubble-radius-you, var(--bubble-radius-default));
  --bubble-stamp-color: var(--bubble-stamp-color-me, var(--text-primary));
}

.--bubble-wrapper.--bw-you .--avatar {
  --avatar-bg: var(--bubble-avatar-bg, var(--bubble-avatar-bg-you));
}

.--bubble-wrapper .--bubble {
  animation: bubble-entry 0.2s ease-out both;
  transform-origin: bottom;
  width: fit-content;
  max-width: 80%;
  border-radius: var(--bubble-radius);
}

.--bubble-wrapper .--bubble.--bma-text, .--bubble-wrapper .--bubble:not(.--with-media) {
  padding: var(--bubble-padding);
}

.--bubble-wrapper .--bubble.--bubble-grouped.--bubble-me {
  border-top-right-radius: 6px;
}

.--bubble-wrapper .--bubble.--bubble-grouped.--bubble-you {
  border-top-left-radius: 6px;
}

.--bubble-wrapper .--bubble.--bma-audio {
  padding: var(--bubble-audio-padding);
}

.--bubble-wrapper .--bubble.--bma-img {
  padding: var(--bubble-image-padding);
}

.--bubble-wrapper .--bubble.--bubble-me {
  background: var(--bubble-me);
}

.--bubble-wrapper .--bubble.--bubble-me.--b-arrow:before {
  --bubble-arrow-color: var(--bubble-me);
  right: calc(var(--bubble-arrow-size) * -0.5);
  border-bottom-left-radius: 100%;
  border-left: var(--bubble-arrow-size) solid var(--bubble-arrow-color);
}

.--bubble-wrapper .--bubble.--bubble-me .--bubble-text {
  color: var(--bubble-me-text-color);
}

.--bubble-wrapper .--bubble.--bubble-me .--bubble-attachments {
  background: var(--bubble-attachment-bg, var(--bubble-attachment-bg-me));
}

.--bubble-wrapper .--bubble.--bubble-you {
  background: var(--bubble-you);
}

.--bubble-wrapper .--bubble.--bubble-you.--b-arrow:before {
  --bubble-arrow-color: var(--bubble-you);
  left: calc(var(--bubble-arrow-size) * -0.5);
  border-bottom-right-radius: 100%;
  border-right: var(--bubble-arrow-size) solid var(--bubble-arrow-color);
}

.--bubble-wrapper .--bubble.--bubble-you .--bubble-text {
  color: var(--bubble-you-text-color);
}

.--bubble-wrapper .--bubble.--bubble-you .--bubble-attachments {
  background: var(--bubble-attachment-bg, var(--bubble-attachment-bg-you));
}

.--bubble-wrapper .--bubble .--bubble-text {
  font-size: var(--bubble-text-size);
  color: var(--bubble-text-color);
}

.--bubble-wrapper .--bubble .--bubble-attachments {
  padding: var(--bubble-attachment-padding, 2px);
  margin: var(--bubble-attachment-margin, 4px 0px);
  border-radius: var(--bubble-attachment-radius, var(--bubble-radius));
}

.--bubble-wrapper .--bubble .--bubble-stamp {
  font-size: var(--bubble-stamp-size);
  opacity: 0.75;
  color: var(--bubble-stamp-color);
}

.--bubble-wrapper .--bubble .--bubble-name {
  font-weight: bold;
  color: var(--bubble-name-color);
  margin: var(--bubble-name-margin);
}

.--bubble-wrapper .--bubble.--b-arrow:before {
  content: "";
  width: 1.5em;
  height: 2em;
  position: absolute;
  z-index: -1;
  bottom: 0px;
  display: block;
}

.--bubble-wrapper .--bubble .--bubble-stats {
  gap: 6px;
}

.--bubble-wrapper .--bubble .--bubble-stats .--bubble-status {
  width: calc(var(--bubble-tick-size));
  line-height: 0.65;
}

.--bubble-wrapper .--bubble .--bubble-stats .--bubble-status svg {
  fill: var(--bubble-tick-color);
}

.--bubble-wrapper .--bubble .--bubble-stats .--bubble-status.--bs-3 svg {
  fill: var(--bubble-tick-read-color);
}

.--bubble-wrapper .--bubble .--bubble-audio {
  gap: 10px;
  min-width: var(--bubble-max-size) !important;
}

.--bubble-wrapper .--bubble .--bubble-audio .--bm-action {
  width: 36px;
  line-height: 0.6;
}

.--bubble-wrapper .--bubble .--bubble-audio .--bm-action svg {
  fill: var(--bubble-text-color);
}

.--bubble-wrapper .--bubble .--bubble-audio .--bm-dur {
  font-size: var(--bubble-duration-text-size);
}

.--bubble-wrapper .--bubble .--bubble-image {
  max-width: var(--bubble-max-size);
}

.--bubble-wrapper .--bubble .--bubble-image img {
  width: 100%;
  border-radius: var(--bubble-radius);
}

.--bubble-wrapper .--bubble .--bubble-attachments .--bubble-attachment {
  display: block;
  text-decoration: none;
  color: inherit;
  border-radius: 10px;
  border: 1px solid hsla(0, 0%, 100%, 0.2);
  background: hsla(0, 0%, 100%, 0.08);
  padding: 8px;
}

.--bubble-wrapper .--bubble .--bubble-attachments .--bubble-attachment .--att-icon {
  width: 28px;
  min-width: 28px !important;
}

.--bubble-wrapper .--bubble .--bubble-attachments .--bubble-attachment .--att-icon svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.--bubble-wrapper .--bubble .--bubble-attachments .--att-image img {
  width: 100%;
  max-width: min(280px, 100%);
  border-radius: 8px;
}

.--bubble-wrapper .--bubble .--bubble-attachments .--att-image .--att-meta {
  margin-top: 6px;
  gap: 8px;
}

.--bubble-wrapper .--bubble.--bubble-style-ios {
  border-radius: 18px;
  box-shadow: 0 8px 22px rgba(10, 15, 40, 0.15);
}

.--bubble-wrapper .--bubble.--bubble-style-ios.--bubble-me {
  background: linear-gradient(160deg, #1f8bff 0%, #0b68d9 100%);
}

.--bubble-wrapper .--bubble.--bubble-style-ios.--bubble-you {
  background: #fff;
}

.--bubble-wrapper .--bubble.--bubble-style-ios.--bubble-you .--bubble-text, .--bubble-wrapper .--bubble.--bubble-style-ios.--bubble-you .--bubble-stamp, .--bubble-wrapper .--bubble.--bubble-style-ios.--bubble-you .--bubble-status {
  color: #12161f;
}

.--bubble-wrapper .--bubble.--bubble-style-android {
  border-radius: 14px;
  border: 1px solid hsla(0, 0%, 100%, 0.12);
}

.--bubble-wrapper .--bubble.--bubble-style-android.--bubble-me {
  background: #0f8a5f;
}

.--bubble-wrapper .--bubble.--bubble-style-android.--bubble-you {
  background: #2a2d34;
}

.--bubble-wrapper .--bubble.--bubble-style-blocks {
  border-radius: 4px;
  border: 1px solid hsla(0, 0%, 100%, 0.2);
  box-shadow: 4px 4px 0 rgba(0, 0, 0, 0.25);
}

.--bubble-wrapper .--bubble.--bubble-style-glass {
  background: hsla(0, 0%, 100%, 0.14);
  border: 1px solid hsla(0, 0%, 100%, 0.25);
  backdrop-filter: blur(12px) saturate(140%);
  -webkit-backdrop-filter: blur(12px) saturate(140%);
}

.--bubble-wrapper .--bubble.--bubble-style-minimal {
  background: rgba(0, 0, 0, 0);
  border: 1px solid currentColor;
}

.--bubble-wrapper .--bubble.--bubble-style-minimal .--bubble-stamp {
  opacity: 0.65;
}

.--typing-indicator {
  min-width: 84px !important;
}

.--typing-indicator .--typing-dot {
  width: 6px;
  height: 6px;
  border-radius: 99px;
  background: currentColor;
  opacity: 0.45;
  animation: typing-bounce 1s infinite ease-in-out;
}

.--typing-indicator .--typing-dot:nth-child(2) {
  animation-delay: 0.15s;
}

.--typing-indicator .--typing-dot:nth-child(3) {
  animation-delay: 0.3s;
}

@keyframes typing-bounce {
  0%, 80%, 100% {
    transform: translateY(0);
    opacity: 0.35;
  }
  40% {
    transform: translateY(-3px);
    opacity: 1;
  }
}
@keyframes bubble-entry {
  0% {
    opacity: 0;
    transform: translateY(8px) scale(0.98);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
body {
  --chat-date-padding: 10px;
}

.--chatlist .--list {
  padding: var(--chatlist-padding, 0px);
}

.--chatlist .--list .--chat-date {
  padding: var(--chat-date-padding-custom, var(--chat-date-padding));
}

body {
  --checkbox-check-color: #fff;
  --checkbox-check-size: 13px;
  --checkbox-radius: 6px;
  --checkbox-checked: rgb(46, 161, 42);
  --checkbox-unchecked: rgb(203, 203, 203);
  --checkbox-thumb: #fff;
  --checkbox-thumb-shadow: #000;
  --checkbox-thumb-shadow-size: 2px;
  --checkbox-size: 20px;
  --checkbox-size-sm: 18px;
  --checkbox-size-md: 20px;
  --checkbox-size-lg: 22px;
  --checkbox-size-xl: 24px;
}

.--checkbox {
  height: var(--checkbox-size);
  width: var(--checkbox-size);
  cursor: pointer;
  border: 1px var(--checkbox-unchecked) solid;
  border-radius: var(--checkbox-radius);
  overflow: hidden;
  background-color: var(--checkbox-unchecked);
}

.--checkbox input[type=checkbox] {
  z-index: 0;
  opacity: 0;
}

.--checkbox:before {
  font-size: var(--checkbox-check-size);
  color: var(--checkbox-check-color);
  opacity: 0;
}

.--checkbox.is-checked {
  background-color: var(--checkbox-checked);
  border: 1px var(--checkbox-checked) solid;
}

.--checkbox.is-checked:before {
  opacity: 1;
}

.--checkbox.is-checked svg {
  fill: var(--checkbox-check-color);
}

.--checkbox.--disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.--checkbox svg {
  fill: var(--checkbox-unchecked);
}

.--checkbox.--xs {
  --checkbox-size: var(--checkbox-size-xs, var(--size-xs));
}

.--checkbox.--sm {
  --checkbox-size: var(--checkbox-size-sm, var(--size-sm));
}

.--checkbox.--md {
  --checkbox-size: var(--checkbox-size-md, var(--size-md));
}

.--checkbox.--lg {
  --checkbox-size: var(--checkbox-size-lg, var(--size-lg));
}

.--checkbox.--xl {
  --checkbox-size: var(--checkbox-size-xl, var(--size-xl));
}

.--checkbox.--xxl {
  --checkbox-size: var(--checkbox-size-xxl, var(--size-xxl));
}

.--checkbox.--2xl {
  --checkbox-size: var(--checkbox-size-2xl, var(--size-2xl));
}

.--checkbox.--3xl {
  --checkbox-size: var(--checkbox-size-3xl, var(--size-3xl));
}

.--checkbox.--4xl {
  --checkbox-size: var(--checkbox-size-4xl, var(--size-4xl));
}

.--checkbox.--5xl {
  --checkbox-size: var(--checkbox-size-5xl, var(--size-5xl));
}

.--checkbox.--6xl {
  --checkbox-size: var(--checkbox-size-6xl, var(--size-6xl));
}

.--checkbox.--7xl {
  --checkbox-size: var(--checkbox-size-7xl, var(--size-7xl));
}

.--checkbox.--8xl {
  --checkbox-size: var(--checkbox-size-8xl, var(--size-8xl));
}

.--checkbox.--9xl {
  --checkbox-size: var(--checkbox-size-9xl, var(--size-9xl));
}

body {
  --shiki-bg: #0d1117;
  --shiki-fg: #c9d1d9;
  --shiki-line-highlight: #2d333b;
}

[color-scheme=dark] body {
  --shiki-bg: #0d1117;
  --shiki-fg: #c9d1d9;
}

code {
  font-family: var(--codeblock-font, "SF Mono", "Monaco", "Inconsolata", "Fira Code", "Fira Mono", "Droid Sans Mono", monospace) !important;
  font-optical-sizing: auto;
  font-style: normal;
}

.--code-block {
  background-color: var(--codeblock-background);
  border: var(--codeblock-border);
  --line-num-width: 40px;
  white-space: pre;
  tab-size: 4;
  position: relative;
  border-radius: var(--codeblock-radius) !important;
  overflow: auto;
}

.--code-block pre {
  font-family: var(--codeblock-font, monospace) !important;
  font-size: var(--codeblock-font-size, inherit) !important;
}

.--code-block pre.--shiki-pre {
  background-color: rgba(0, 0, 0, 0) !important;
  margin: 0;
  font-family: var(--codeblock-font, "SF Mono", "Monaco", "Inconsolata", monospace) !important;
  font-size: inherit;
  letter-spacing: inherit;
  border-radius: inherit;
  border-width: inherit;
  white-space: inherit;
  background: rgba(0, 0, 0, 0) !important;
}

.--code-block pre.--shiki-pre .shiki {
  padding: 1rem;
  background-color: rgba(0, 0, 0, 0) !important;
}

.--code-block pre.--shiki-pre code {
  font-family: inherit !important;
  background: rgba(0, 0, 0, 0) !important;
  height: fit-content;
  display: flex;
}

.--code-block pre.--shiki-pre code .shiki {
  background-color: rgba(0, 0, 0, 0) !important;
}

.--code-block pre.--shiki-pre .line {
  display: flex;
  width: 100%;
  padding: 0 4px;
  border-left: 3px solid rgba(0, 0, 0, 0);
}

.--code-block pre.--shiki-pre span {
  font-family: var(--codeblock-font, monospace) !important;
  font-size: var(--codeblock-font-size, inherit) !important;
}

.--code-block .--code-line {
  font-family: var(--codeblock-font, monospace) !important;
}

body {
  --colorpicker: var(--input);
  --colorpicker-swatch-xxl: 32px;
  --colorpicker-swatch-xl: 28px;
  --colorpicker-swatch-lg: 24px;
  --colorpicker-swatch-md: 20px;
  --colorpicker-swatch-sm: 16px;
  --colorpicker-swatch-xs: 14px;
}

.--color-picker {
  background: var(--colorpicker);
  gap: 10px;
  overflow: hidden;
}

.--color-picker .--input {
  background: rgba(0, 0, 0, 0) !important;
  border: none !important;
  padding: 0 !important;
  width: 100% !important;
  cursor: pointer;
}

.--color-picker .--cp-swatch {
  border-radius: 4px;
  flex-shrink: 0;
  cursor: pointer;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.15);
}

.--color-picker.--color-picker-square {
  background: rgba(0, 0, 0, 0);
  padding: 0 !important;
  gap: 0;
  cursor: pointer;
  aspect-ratio: 1/1;
}

.--color-picker.--color-picker-square .--cp-swatch {
  width: 100% !important;
  height: 100% !important;
}

.--color-picker.--xs {
  font-size: var(--text-xs);
  padding: var(--colorpicker-padding-xs, var(--padding-xs));
  border-radius: var(--colorpicker-border-radius-xs, var(--radius-xs));
}

.--color-picker.--xs .--cp-swatch {
  width: var(--colorpicker-swatch-xs);
  height: var(--colorpicker-swatch-xs);
  border-radius: var(--colorpicker-swatch-radius-xs, var(--radius-sm));
}

.--color-picker.--sm {
  font-size: var(--text-sm);
  padding: var(--colorpicker-padding-sm, var(--padding-sm));
  border-radius: var(--colorpicker-border-radius-sm, var(--radius-sm));
}

.--color-picker.--sm .--cp-swatch {
  width: var(--colorpicker-swatch-sm);
  height: var(--colorpicker-swatch-sm);
  border-radius: var(--colorpicker-swatch-radius-sm, var(--radius-sm));
}

.--color-picker.--md {
  font-size: var(--text-md);
  padding: var(--colorpicker-padding-md, var(--padding-md));
  border-radius: var(--colorpicker-border-radius-md, var(--radius-md));
}

.--color-picker.--md .--cp-swatch {
  width: var(--colorpicker-swatch-md);
  height: var(--colorpicker-swatch-md);
  border-radius: var(--colorpicker-swatch-radius-md, var(--radius-sm));
}

.--color-picker.--lg {
  font-size: var(--text-lg);
  padding: var(--colorpicker-padding-lg, var(--padding-lg));
  border-radius: var(--colorpicker-border-radius-lg, var(--radius-lg));
}

.--color-picker.--lg .--cp-swatch {
  width: var(--colorpicker-swatch-lg);
  height: var(--colorpicker-swatch-lg);
  border-radius: var(--colorpicker-swatch-radius-lg, var(--radius-sm));
}

.--color-picker.--xl {
  font-size: var(--text-xl);
  padding: var(--colorpicker-padding-xl, var(--padding-xl));
  border-radius: var(--colorpicker-border-radius-xl, var(--radius-xl));
}

.--color-picker.--xl .--cp-swatch {
  width: var(--colorpicker-swatch-xl);
  height: var(--colorpicker-swatch-xl);
  border-radius: var(--colorpicker-swatch-radius-xl, var(--radius-sm));
}

.--color-picker.--xxl {
  font-size: var(--text-xxl);
  padding: var(--colorpicker-padding-xxl, var(--padding-xxl));
  border-radius: var(--colorpicker-border-radius-xxl, var(--radius-xxl));
}

.--color-picker.--xxl .--cp-swatch {
  width: var(--colorpicker-swatch-xxl);
  height: var(--colorpicker-swatch-xxl);
  border-radius: var(--colorpicker-swatch-radius-xxl, var(--radius-sm));
}

.--color-picker.--2xl {
  font-size: var(--text-2xl);
  padding: var(--colorpicker-padding-2xl, var(--padding-2xl));
  border-radius: var(--colorpicker-border-radius-2xl, var(--radius-2xl));
}

.--color-picker.--2xl .--cp-swatch {
  width: var(--colorpicker-swatch-2xl);
  height: var(--colorpicker-swatch-2xl);
  border-radius: var(--colorpicker-swatch-radius-2xl, var(--radius-sm));
}

.--color-picker.--3xl {
  font-size: var(--text-3xl);
  padding: var(--colorpicker-padding-3xl, var(--padding-3xl));
  border-radius: var(--colorpicker-border-radius-3xl, var(--radius-3xl));
}

.--color-picker.--3xl .--cp-swatch {
  width: var(--colorpicker-swatch-3xl);
  height: var(--colorpicker-swatch-3xl);
  border-radius: var(--colorpicker-swatch-radius-3xl, var(--radius-sm));
}

.--color-picker.--4xl {
  font-size: var(--text-4xl);
  padding: var(--colorpicker-padding-4xl, var(--padding-4xl));
  border-radius: var(--colorpicker-border-radius-4xl, var(--radius-4xl));
}

.--color-picker.--4xl .--cp-swatch {
  width: var(--colorpicker-swatch-4xl);
  height: var(--colorpicker-swatch-4xl);
  border-radius: var(--colorpicker-swatch-radius-4xl, var(--radius-sm));
}

.--color-picker.--5xl {
  font-size: var(--text-5xl);
  padding: var(--colorpicker-padding-5xl, var(--padding-5xl));
  border-radius: var(--colorpicker-border-radius-5xl, var(--radius-5xl));
}

.--color-picker.--5xl .--cp-swatch {
  width: var(--colorpicker-swatch-5xl);
  height: var(--colorpicker-swatch-5xl);
  border-radius: var(--colorpicker-swatch-radius-5xl, var(--radius-sm));
}

.--color-picker.--6xl {
  font-size: var(--text-6xl);
  padding: var(--colorpicker-padding-6xl, var(--padding-6xl));
  border-radius: var(--colorpicker-border-radius-6xl, var(--radius-6xl));
}

.--color-picker.--6xl .--cp-swatch {
  width: var(--colorpicker-swatch-6xl);
  height: var(--colorpicker-swatch-6xl);
  border-radius: var(--colorpicker-swatch-radius-6xl, var(--radius-sm));
}

.--color-picker.--7xl {
  font-size: var(--text-7xl);
  padding: var(--colorpicker-padding-7xl, var(--padding-7xl));
  border-radius: var(--colorpicker-border-radius-7xl, var(--radius-7xl));
}

.--color-picker.--7xl .--cp-swatch {
  width: var(--colorpicker-swatch-7xl);
  height: var(--colorpicker-swatch-7xl);
  border-radius: var(--colorpicker-swatch-radius-7xl, var(--radius-sm));
}

.--color-picker.--8xl {
  font-size: var(--text-8xl);
  padding: var(--colorpicker-padding-8xl, var(--padding-8xl));
  border-radius: var(--colorpicker-border-radius-8xl, var(--radius-8xl));
}

.--color-picker.--8xl .--cp-swatch {
  width: var(--colorpicker-swatch-8xl);
  height: var(--colorpicker-swatch-8xl);
  border-radius: var(--colorpicker-swatch-radius-8xl, var(--radius-sm));
}

.--color-picker.--9xl {
  font-size: var(--text-9xl);
  padding: var(--colorpicker-padding-9xl, var(--padding-9xl));
  border-radius: var(--colorpicker-border-radius-9xl, var(--radius-9xl));
}

.--color-picker.--9xl .--cp-swatch {
  width: var(--colorpicker-swatch-9xl);
  height: var(--colorpicker-swatch-9xl);
  border-radius: var(--colorpicker-swatch-radius-9xl, var(--radius-sm));
}

.--color-picker-chooser {
  background: var(--surface);
  border-radius: var(--colorpicker-radius, var(--radius-sm));
  box-shadow: var(--shadow-md, 0 4px 24px rgba(0, 0, 0, 0.18));
  padding: 12px;
  width: 240px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  z-index: var(--max-z-index);
  -webkit-user-select: none;
          user-select: none;
  pointer-events: auto;
  border: var(--colorpicker-border);
}

.--color-picker-chooser .--cp-area {
  position: relative;
  width: 100%;
  height: 160px;
  border-radius: 6px;
  overflow: hidden;
  cursor: crosshair;
  flex-shrink: 0;
}

.--color-picker-chooser .--cp-area .--cp-area-gradient-s {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, white, transparent);
}

.--color-picker-chooser .--cp-area .--cp-area-gradient-v {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, transparent, black);
}

.--color-picker-chooser .--cp-area .--cp-cursor {
  position: absolute;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.4);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.--color-picker-chooser .--cp-slider {
  position: relative;
  width: 100%;
  height: 12px;
  border-radius: 6px;
  cursor: pointer;
  flex-shrink: 0;
}

.--color-picker-chooser .--cp-slider.--cp-hue {
  background: linear-gradient(to right, #ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000);
}

.--color-picker-chooser .--cp-slider .--cp-thumb {
  position: absolute;
  top: 50%;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.--color-picker-chooser .--cp-inputs {
  display: flex;
  gap: 8px;
  align-items: center;
}

.--color-picker-chooser .--cp-inputs .--cp-preview {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  flex-shrink: 0;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.15);
}

.--color-picker-chooser .--cp-inputs .--cp-hex-input {
  flex: 1 1;
  background: var(--input, rgba(0, 0, 0, 0.06));
  border: none;
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 13px;
  color: var(--text-primary);
  font-family: monospace;
  outline: none;
  width: 100%;
  min-width: 0;
}

.--color-picker-chooser.--color-picker-expanded {
  position: relative;
  width: 100%;
  box-shadow: none;
  z-index: auto;
}

body {
  --color-scheme-border: 1px var(--border-primary) solid;
  --color-scheme-size-sm: 26px;
  --color-scheme-size-md: 30px;
  --color-scheme-size-lg: 36px;
  --color-scheme-padding-sm: 6px;
  --color-scheme-padding-md: 8px;
  --color-scheme-padding-lg: 2px;
  --color-scheme: var(--surface);
  --color-scheme-active: var(--slate-100);
  --color-scheme-hover: var(--surface-hover);
  --color-scheme-icon: var(--text-primary);
  --color-scheme-radius: 50px;
}

.--segmented.--color-scheme {
  --segment-item-padding-sm: 0px;
  --segmented-radius-sm: 20px;
  --segmented-border: var(--color-scheme-border);
  --segmented: var(--color-scheme);
  --segment-tab: var(--color-scheme-active);
  width: 100px;
}

.--segmented.--color-scheme.--sm {
  height: var(--color-scheme-size-sm);
}

.--segmented.--color-scheme.--md {
  height: var(--color-scheme-size-md);
}

.--segmented.--color-scheme.--lg {
  height: var(--color-scheme-size-lg);
}

.--color-scheme-switch {
  border: var(--color-scheme-border);
  background: var(--color-scheme);
  border-radius: var(--color-scheme-radius) !important;
}

.--color-scheme-switch:active {
  background: var(--color-scheme-active);
}

.--color-scheme-switch:hover {
  background: var(--color-scheme-hover);
}

.--color-scheme-switch.--sm {
  width: var(--color-scheme-size-sm);
  height: var(--color-scheme-size-sm);
  padding: var(--color-scheme-padding-sm);
}

.--color-scheme-switch.--md {
  width: var(--color-scheme-size-md);
  height: var(--color-scheme-size-md);
  padding: var(--color-scheme-padding-md);
}

.--color-scheme-switch.--lg {
  width: var(--color-scheme-size-lg);
  height: var(--color-scheme-size-lg);
  padding: var(--color-scheme-padding-lg);
}

.--color-scheme-switch svg circle, .--color-scheme-switch svg path, .--color-scheme-switch svg rect {
  stroke: var(--color-scheme-icon);
  fill: var(--color-scheme-icon);
}

body {
  --context: #fff;
  --context-border: 0px;
  --context-radius: 10px;
  --context-padding: 10px;
  --context-shadow-a: 0px 0px 1px #bbbbbb;
  --context-shadow-b: 0px 1px 2px #eee;
  --context-seperator: #eee;
  --context-seperator-height: 1px;
  --context-seperator-margin: 3px 6px;
  --context-item: #fff;
  --context-item-color: #111;
  --context-item-width: 220px;
  --context-item-padding: 6px 10px;
  --context-item-gap: 10px;
  --context-item-font-size: 14px;
  --context-item-radius: 5px;
  --context-item-icon-size: 18px;
  --context-item-hover: #f1f1f1;
  --context-arrow-size: 10px;
  --context-arrow-x: 20px;
  --context-arrow-y: 14px;
}

[color-scheme=dark] body {
  --context: #222;
  --context-shadow-a: 0px 0px 1px #00000080;
  --context-shadow-b: 0px 1px 2px #00000080;
  --context-seperator: #333;
  --context-item: #222;
  --context-item-color: #eee;
  --context-item-hover: #333;
}

.--contextmenu {
  z-index: var(--max-z-index);
  background: var(--context);
  border-radius: var(--context-radius);
  padding: var(--context-padding);
  filter: drop-shadow(var(--context-shadow-a)) drop-shadow(var(--context-shadow-b));
  pointer-events: auto !important;
  top: calc(var(--max-z-index) * -1px);
  left: calc(var(--max-z-index) * -1px);
  opacity: 0;
}

.--contextmenu:after {
  content: "";
  position: absolute;
  width: var(--context-arrow-size);
  height: var(--context-arrow-size);
  background: inherit;
  transform: rotate(45deg);
  z-index: -1;
  border-radius: calc(var(--context-arrow-size) / 4);
}

.--contextmenu.--has-arrow::after {
  top: calc(var(--context-arrow-size) / 2 * -1);
  left: 50%;
  margin-left: calc(var(--context-arrow-size) / -2);
}

.--contextmenu.--has-arrow.--arrow-side-top::after {
  top: calc(var(--context-arrow-size) / 2 * -1);
  bottom: auto;
  left: 50%;
  right: auto;
  margin-left: calc(var(--context-arrow-size) / -2);
  margin-top: 0;
}

.--contextmenu.--has-arrow.--arrow-side-bottom::after {
  bottom: calc(var(--context-arrow-size) / 2 * -1);
  top: auto;
  left: 50%;
  right: auto;
  margin-left: calc(var(--context-arrow-size) / -2);
  margin-top: 0;
}

.--contextmenu.--has-arrow.--arrow-side-left::after {
  left: calc(var(--context-arrow-size) / 2 * -1);
  right: auto;
  top: 50%;
  bottom: auto;
  margin-left: 0;
  margin-top: calc(var(--context-arrow-size) / -2);
}

.--contextmenu.--has-arrow.--arrow-side-right::after {
  right: calc(var(--context-arrow-size) / 2 * -1);
  left: auto;
  top: 50%;
  bottom: auto;
  margin-left: 0;
  margin-top: calc(var(--context-arrow-size) / -2);
}

.--contextmenu.--has-arrow.--arrow-side-top.--arrow-align-left::after, .--contextmenu.--has-arrow.--arrow-side-bottom.--arrow-align-left::after {
  left: var(--context-arrow-x);
  margin-left: 0;
}

.--contextmenu.--has-arrow.--arrow-side-top.--arrow-align-right::after, .--contextmenu.--has-arrow.--arrow-side-bottom.--arrow-align-right::after {
  right: var(--context-arrow-x);
  left: auto;
  margin-left: 0;
}

.--contextmenu.--has-arrow.--arrow-side-top.--arrow-align-center::after, .--contextmenu.--has-arrow.--arrow-side-bottom.--arrow-align-center::after {
  left: 50%;
  right: auto;
  margin-left: calc(var(--context-arrow-size) / -2);
}

.--contextmenu.--has-arrow.--arrow-side-left.--arrow-align-top::after, .--contextmenu.--has-arrow.--arrow-side-right.--arrow-align-top::after {
  top: var(--context-arrow-y);
  margin-top: 0;
}

.--contextmenu.--has-arrow.--arrow-side-left.--arrow-align-bottom::after, .--contextmenu.--has-arrow.--arrow-side-right.--arrow-align-bottom::after {
  bottom: var(--context-arrow-y);
  top: auto;
  margin-top: 0;
}

.--contextmenu.--has-arrow.--arrow-side-left.--arrow-align-center::after, .--contextmenu.--has-arrow.--arrow-side-right.--arrow-align-center::after {
  top: 50%;
  bottom: auto;
  margin-top: calc(var(--context-arrow-size) / -2);
}

.--contextmenu .--line {
  height: var(--context-seperator-height);
  background: var(--context-seperator);
  margin: var(--context-seperator-margin);
}

.--contextmenu .--item {
  min-width: var(--context-item-width) !important;
  width: 100%;
  padding: var(--context-item-padding);
  gap: var(--context-item-gap);
  cursor: pointer;
  font-size: var(--context-item-font-size);
  border-radius: var(--context-item-radius);
  background: var(--context-item);
  border: 0px;
  color: var(--context-item-color);
  --icon-color-1: var(--context-item-color);
  --icon-color-2: rgb(from var(--icon-color-1) r g b / var(--icon-alpha, 0.5));
}

.--contextmenu .--item .--icon {
  width: var(--context-item-icon-size);
  height: var(--context-item-icon-size);
}

.--contextmenu .--item .--icon .--ico {
  font-size: var(--context-item-icon-size);
}

.--contextmenu .--item .--label {
  color: var(--context-item-color);
  flex: 1 1;
}

.--contextmenu .--item .--submenu-caret {
  margin-left: auto;
  opacity: 0.7;
  font-size: 12px;
  line-height: 1;
}

.--contextmenu .--item.--disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.--contextmenu .--item:hover {
  background: var(--context-item-hover);
}

.--contextmenu.--submenu {
  z-index: calc(var(--max-z-index) + 1);
}

body {
  --cookie-consent: var(--surface);
  --cookie-consent-padding: 20px;
  --cookie-consent-width: 320px;
}

.--cookie-consent {
  z-index: var(--max-z-index);
  background: var(--cookie-consent);
  gap: 15px;
  position: fixed;
  bottom: 20px;
  width: var(--cookie-consent-width);
  border: var(--cookie-consent-border, 1px var(--border-primary) solid);
}

.--cookie-consent.--xs {
  border-radius: var(--cookie-consent-radius, var(--radius-xs));
  padding: var(--cookie-consent-padding, var(--padding-xs));
}

.--cookie-consent.--sm {
  border-radius: var(--cookie-consent-radius, var(--radius-sm));
  padding: var(--cookie-consent-padding, var(--padding-sm));
}

.--cookie-consent.--md {
  border-radius: var(--cookie-consent-radius, var(--radius-md));
  padding: var(--cookie-consent-padding, var(--padding-md));
}

.--cookie-consent.--lg {
  border-radius: var(--cookie-consent-radius, var(--radius-lg));
  padding: var(--cookie-consent-padding, var(--padding-lg));
}

.--cookie-consent.--xl {
  border-radius: var(--cookie-consent-radius, var(--radius-xl));
  padding: var(--cookie-consent-padding, var(--padding-xl));
}

.--cookie-consent.--xxl {
  border-radius: var(--cookie-consent-radius, var(--radius-xxl));
  padding: var(--cookie-consent-padding, var(--padding-xxl));
}

.--cookie-consent.--2xl {
  border-radius: var(--cookie-consent-radius, var(--radius-2xl));
  padding: var(--cookie-consent-padding, var(--padding-2xl));
}

.--cookie-consent.--3xl {
  border-radius: var(--cookie-consent-radius, var(--radius-3xl));
  padding: var(--cookie-consent-padding, var(--padding-3xl));
}

.--cookie-consent.--4xl {
  border-radius: var(--cookie-consent-radius, var(--radius-4xl));
  padding: var(--cookie-consent-padding, var(--padding-4xl));
}

.--cookie-consent.--5xl {
  border-radius: var(--cookie-consent-radius, var(--radius-5xl));
  padding: var(--cookie-consent-padding, var(--padding-5xl));
}

.--cookie-consent.--6xl {
  border-radius: var(--cookie-consent-radius, var(--radius-6xl));
  padding: var(--cookie-consent-padding, var(--padding-6xl));
}

.--cookie-consent.--7xl {
  border-radius: var(--cookie-consent-radius, var(--radius-7xl));
  padding: var(--cookie-consent-padding, var(--padding-7xl));
}

.--cookie-consent.--8xl {
  border-radius: var(--cookie-consent-radius, var(--radius-8xl));
  padding: var(--cookie-consent-padding, var(--padding-8xl));
}

.--cookie-consent.--9xl {
  border-radius: var(--cookie-consent-radius, var(--radius-9xl));
  padding: var(--cookie-consent-padding, var(--padding-9xl));
}

.--cookie-consent.--left {
  left: 20px;
}

.--cookie-consent.--right {
  right: 20px;
}

.--cookie-consent .--title {
  font-weight: bold;
}

.--cookie-consent .--message {
  font-size: calc(var(--cookie-consent-font-size) * 0.8);
}

.--cookie-consent .--footer {
  margin-top: 20px;
  gap: 10px;
}

body {
  --cover-bg: rgba(255,255,255,0.8);
  --cover-label: var(--text-primary);
  --cover-radius: var(--cover-radius, 0px);
}

[color-scheme=dark] body {
  --cover-bg: rgba(0,0,0,0.8);
  --cover-label: var(--text-primary);
}

.--cover {
  -webkit-backdrop-filter: blur(4px);
          backdrop-filter: blur(4px);
  z-index: 99999;
  gap: 15px;
  pointer-events: auto;
  border-radius: var(--cover-radius);
}

.--cover .label {
  font-size: 14px;
  animation: breath 1s linear infinite;
}

body {
  --cropper-border: 3px var(--border-primary) solid;
}

.--cropper canvas {
  cursor: move;
  border: var(--cropper-border);
  margin-bottom: 10px;
  border-radius: var(--cropper-radius);
}

.--cropper.--circle canvas {
  border-radius: 50%;
}

.--cropper .--cropper-slider {
  width: 250px;
  margin: 15px auto 0px auto;
}

body {
  --crumb-padding: 6px 2px;
  --crumb-item-gap: 5px;
  --crumb-item-color: var(--text-primary);
  --crumb-item-hover: var(--text-primary-hover);
  --crumb-item-hover-color: #fff;
  --crumb-item-radius: 6px;
  --crumb-item-padding: 2px 5px;
}

.--crumb {
  gap: var(--crumb-gap);
}

.--crumb li {
  padding: var(--crumb-padding) !important;
}

.--crumb .--crumb-item {
  background: rgba(0, 0, 0, 0);
  color: var(--crumb-item-color);
  gap: var(--crumb-item-gap);
  padding: var(--crumb-item-padding);
  border-radius: var(--crumb-item-radius);
}

.--crumb .--crumb-item:first-child:disabled {
  --button-disabled-color: var(--text-primary) !important;
}

.--crumb .--crumb-item:not(:first-child):disabled {
  --button-disabled-color: var(--gray-500) !important;
}

.--crumb .--crumb-item:hover {
  background: var(--crumb-item-hover);
  color: var(--crumb-item-hover-color);
}

.--crumb .--crumb-item:disabled {
  background: rgba(0, 0, 0, 0) !important;
  pointer-events: none;
}

.--crumb .--crumb-chevron {
  width: 20px;
  line-height: 0;
}

.--crumb .--crumb-chevron svg {
  fill: var(--text-primary);
}

.--crumb .--list-seperator {
  padding: 0px !important;
}

body {
  --datepicker: var(--input);
  --datepicker-border: var(--input-border);
  --datepicker-icon-xxl: 48px;
  --datepicker-icon-xl: 36px;
  --datepicker-icon-lg: 30px;
  --datepicker-icon-md: 24px;
  --datepicker-icon-sm: 20px;
  --datepicker-icon-xs: 16px;
}

.--date-picker {
  background: var(--datepicker);
  border: var(--datepicker-border);
  gap: 10px;
}

.--date-picker .--input {
  background: rgba(0, 0, 0, 0) !important;
  border: none !important;
  padding: 0 !important;
  width: 100% !important;
}

.--date-picker .--date-picker-icon {
  color: var(--text-primary);
}

.--date-picker .--date-picker-icon svg {
  fill: var(--text-primary);
}

.--date-picker .--date-picker-icon svg path {
  fill: var(--text-primary);
}

.--date-picker.--xs {
  font-size: var(--text-xs);
  line-height: var(--lh-xs, 1.4);
  padding: var(--datepicker-padding-xs, var(--padding-xs));
  border-radius: var(--datepicker-border-radius-xs, var(--radius-xs));
  min-height: var(--datepicker-control-height-xs, var(--control-height-xs));
  height: var(--datepicker-control-height-xs, var(--control-height-xs));
}

.--date-picker.--xs .--date-picker-icon {
  width: var(--datepicker-icon-xs);
  height: var(--datepicker-icon-xs);
}

.--date-picker.--sm {
  font-size: var(--text-sm);
  line-height: var(--lh-sm, 1.4);
  padding: var(--datepicker-padding-sm, var(--padding-sm));
  border-radius: var(--datepicker-border-radius-sm, var(--radius-sm));
  min-height: var(--datepicker-control-height-sm, var(--control-height-sm));
  height: var(--datepicker-control-height-sm, var(--control-height-sm));
}

.--date-picker.--sm .--date-picker-icon {
  width: var(--datepicker-icon-sm);
  height: var(--datepicker-icon-sm);
}

.--date-picker.--md {
  font-size: var(--text-md);
  line-height: var(--lh-md, 1.4);
  padding: var(--datepicker-padding-md, var(--padding-md));
  border-radius: var(--datepicker-border-radius-md, var(--radius-md));
  min-height: var(--datepicker-control-height-md, var(--control-height-md));
  height: var(--datepicker-control-height-md, var(--control-height-md));
}

.--date-picker.--md .--date-picker-icon {
  width: var(--datepicker-icon-md);
  height: var(--datepicker-icon-md);
}

.--date-picker.--lg {
  font-size: var(--text-lg);
  line-height: var(--lh-lg, 1.4);
  padding: var(--datepicker-padding-lg, var(--padding-lg));
  border-radius: var(--datepicker-border-radius-lg, var(--radius-lg));
  min-height: var(--datepicker-control-height-lg, var(--control-height-lg));
  height: var(--datepicker-control-height-lg, var(--control-height-lg));
}

.--date-picker.--lg .--date-picker-icon {
  width: var(--datepicker-icon-lg);
  height: var(--datepicker-icon-lg);
}

.--date-picker.--xl {
  font-size: var(--text-xl);
  line-height: var(--lh-xl, 1.4);
  padding: var(--datepicker-padding-xl, var(--padding-xl));
  border-radius: var(--datepicker-border-radius-xl, var(--radius-xl));
  min-height: var(--datepicker-control-height-xl, var(--control-height-xl));
  height: var(--datepicker-control-height-xl, var(--control-height-xl));
}

.--date-picker.--xl .--date-picker-icon {
  width: var(--datepicker-icon-xl);
  height: var(--datepicker-icon-xl);
}

.--date-picker.--xxl {
  font-size: var(--text-xxl);
  line-height: var(--lh-xxl, 1.4);
  padding: var(--datepicker-padding-xxl, var(--padding-xxl));
  border-radius: var(--datepicker-border-radius-xxl, var(--radius-xxl));
  min-height: var(--datepicker-control-height-xxl, var(--control-height-xxl));
  height: var(--datepicker-control-height-xxl, var(--control-height-xxl));
}

.--date-picker.--xxl .--date-picker-icon {
  width: var(--datepicker-icon-xxl);
  height: var(--datepicker-icon-xxl);
}

.--date-picker.--2xl {
  font-size: var(--text-2xl);
  line-height: var(--lh-2xl, 1.4);
  padding: var(--datepicker-padding-2xl, var(--padding-2xl));
  border-radius: var(--datepicker-border-radius-2xl, var(--radius-2xl));
  min-height: var(--datepicker-control-height-2xl, var(--control-height-2xl));
  height: var(--datepicker-control-height-2xl, var(--control-height-2xl));
}

.--date-picker.--2xl .--date-picker-icon {
  width: var(--datepicker-icon-2xl);
  height: var(--datepicker-icon-2xl);
}

.--date-picker.--3xl {
  font-size: var(--text-3xl);
  line-height: var(--lh-3xl, 1.4);
  padding: var(--datepicker-padding-3xl, var(--padding-3xl));
  border-radius: var(--datepicker-border-radius-3xl, var(--radius-3xl));
  min-height: var(--datepicker-control-height-3xl, var(--control-height-3xl));
  height: var(--datepicker-control-height-3xl, var(--control-height-3xl));
}

.--date-picker.--3xl .--date-picker-icon {
  width: var(--datepicker-icon-3xl);
  height: var(--datepicker-icon-3xl);
}

.--date-picker.--4xl {
  font-size: var(--text-4xl);
  line-height: var(--lh-4xl, 1.4);
  padding: var(--datepicker-padding-4xl, var(--padding-4xl));
  border-radius: var(--datepicker-border-radius-4xl, var(--radius-4xl));
  min-height: var(--datepicker-control-height-4xl, var(--control-height-4xl));
  height: var(--datepicker-control-height-4xl, var(--control-height-4xl));
}

.--date-picker.--4xl .--date-picker-icon {
  width: var(--datepicker-icon-4xl);
  height: var(--datepicker-icon-4xl);
}

.--date-picker.--5xl {
  font-size: var(--text-5xl);
  line-height: var(--lh-5xl, 1.4);
  padding: var(--datepicker-padding-5xl, var(--padding-5xl));
  border-radius: var(--datepicker-border-radius-5xl, var(--radius-5xl));
  min-height: var(--datepicker-control-height-5xl, var(--control-height-5xl));
  height: var(--datepicker-control-height-5xl, var(--control-height-5xl));
}

.--date-picker.--5xl .--date-picker-icon {
  width: var(--datepicker-icon-5xl);
  height: var(--datepicker-icon-5xl);
}

.--date-picker.--6xl {
  font-size: var(--text-6xl);
  line-height: var(--lh-6xl, 1.4);
  padding: var(--datepicker-padding-6xl, var(--padding-6xl));
  border-radius: var(--datepicker-border-radius-6xl, var(--radius-6xl));
  min-height: var(--datepicker-control-height-6xl, var(--control-height-6xl));
  height: var(--datepicker-control-height-6xl, var(--control-height-6xl));
}

.--date-picker.--6xl .--date-picker-icon {
  width: var(--datepicker-icon-6xl);
  height: var(--datepicker-icon-6xl);
}

.--date-picker.--7xl {
  font-size: var(--text-7xl);
  line-height: var(--lh-7xl, 1.4);
  padding: var(--datepicker-padding-7xl, var(--padding-7xl));
  border-radius: var(--datepicker-border-radius-7xl, var(--radius-7xl));
  min-height: var(--datepicker-control-height-7xl, var(--control-height-7xl));
  height: var(--datepicker-control-height-7xl, var(--control-height-7xl));
}

.--date-picker.--7xl .--date-picker-icon {
  width: var(--datepicker-icon-7xl);
  height: var(--datepicker-icon-7xl);
}

.--date-picker.--8xl {
  font-size: var(--text-8xl);
  line-height: var(--lh-8xl, 1.4);
  padding: var(--datepicker-padding-8xl, var(--padding-8xl));
  border-radius: var(--datepicker-border-radius-8xl, var(--radius-8xl));
  min-height: var(--datepicker-control-height-8xl, var(--control-height-8xl));
  height: var(--datepicker-control-height-8xl, var(--control-height-8xl));
}

.--date-picker.--8xl .--date-picker-icon {
  width: var(--datepicker-icon-8xl);
  height: var(--datepicker-icon-8xl);
}

.--date-picker.--9xl {
  font-size: var(--text-9xl);
  line-height: var(--lh-9xl, 1.4);
  padding: var(--datepicker-padding-9xl, var(--padding-9xl));
  border-radius: var(--datepicker-border-radius-9xl, var(--radius-9xl));
  min-height: var(--datepicker-control-height-9xl, var(--control-height-9xl));
  height: var(--datepicker-control-height-9xl, var(--control-height-9xl));
}

.--date-picker.--9xl .--date-picker-icon {
  width: var(--datepicker-icon-9xl);
  height: var(--datepicker-icon-9xl);
}

.--date-picker-chooser {
  z-index: 9999999999;
}

.--dependency-tree {
  --dependency-tree-node-width: 172px;
  --dependency-tree-card-padding: 0.9rem 1rem;
  --dependency-tree-title-size: 1rem;
  --dependency-tree-meta-size: 0.82rem;
  --dependency-tree-badge-size: 0.72rem;
  --dependency-tree-gap: 0.875rem;
  --dependency-tree-card-radius: 0.9rem;
  display: flex;
  flex-direction: column;
  gap: var(--dependency-tree-gap);
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

.--dependency-tree.--variant-xs {
  --dependency-tree-node-width: 120px;
  --dependency-tree-card-padding: 0.42rem 0.55rem;
  --dependency-tree-title-size: 0.72rem;
  --dependency-tree-meta-size: 0.62rem;
  --dependency-tree-badge-size: 0.58rem;
  --dependency-tree-gap: 0.52rem;
  --dependency-tree-card-radius: 0.55rem;
}

.--dependency-tree.--variant-sm {
  --dependency-tree-node-width: 140px;
  --dependency-tree-card-padding: 0.55rem 0.7rem;
  --dependency-tree-title-size: 0.82rem;
  --dependency-tree-meta-size: 0.68rem;
  --dependency-tree-badge-size: 0.62rem;
  --dependency-tree-gap: 0.62rem;
  --dependency-tree-card-radius: 0.65rem;
}

.--dependency-tree.--variant-md {
  --dependency-tree-node-width: 172px;
  --dependency-tree-card-padding: 0.75rem 0.95rem;
  --dependency-tree-title-size: 0.96rem;
  --dependency-tree-meta-size: 0.76rem;
  --dependency-tree-badge-size: 0.69rem;
  --dependency-tree-gap: 0.82rem;
  --dependency-tree-card-radius: 0.85rem;
}

.--dependency-tree.--variant-lg {
  --dependency-tree-node-width: 212px;
  --dependency-tree-card-padding: 1rem 1.15rem;
  --dependency-tree-title-size: 1.08rem;
  --dependency-tree-meta-size: 0.84rem;
  --dependency-tree-badge-size: 0.75rem;
  --dependency-tree-gap: 0.95rem;
  --dependency-tree-card-radius: 0.98rem;
}

.--dependency-tree.--variant-xl {
  --dependency-tree-node-width: 248px;
  --dependency-tree-card-padding: 1.2rem 1.35rem;
  --dependency-tree-title-size: 1.2rem;
  --dependency-tree-meta-size: 0.92rem;
  --dependency-tree-badge-size: 0.8rem;
  --dependency-tree-gap: 1.05rem;
  --dependency-tree-card-radius: 1.1rem;
}

.--dependency-tree.--mode-pyramid {
  align-items: center;
  gap: 0.66rem;
}

.--dependency-tree-row {
  --dependency-tree-row-size: 1;
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--dependency-tree-row-size), minmax(0, 1fr));
  justify-items: center;
  column-gap: var(--dependency-tree-gap);
  width: 100%;
  max-width: 100%;
  padding-top: 0.72rem;
}

.--dependency-tree-row-track {
  position: absolute;
  top: 0.24rem;
  left: calc(50% / var(--dependency-tree-row-size));
  right: calc(50% / var(--dependency-tree-row-size));
  height: 1px;
  background: color-mix(in srgb, var(--dependency-tree-line, #94a3b8) 62%, transparent);
}

.--dependency-tree-pyramid-node {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-self: center;
  width: min(100%, var(--dependency-tree-node-width));
  min-width: 0;
  --dependency-tree-dot: #64748b;
}

.--dependency-tree-pyramid-connector {
  width: 1px;
  height: 0.48rem;
  background: color-mix(in srgb, var(--dependency-tree-line, var(--dependency-tree-dot, #64748b)) 72%, transparent);
  opacity: 0.8;
}

.--dependency-tree-pyramid-dot {
  width: 0.55rem;
  height: 0.55rem;
  margin-bottom: 0.35rem;
  border-radius: 999px;
  background: var(--dependency-tree-dot, #64748b);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--dependency-tree-dot, #64748b) 16%, transparent);
}

.--dependency-tree.--mode-pyramid .--dependency-tree-card {
  padding: var(--dependency-tree-card-padding);
  border-radius: var(--dependency-tree-card-radius);
  width: 100%;
  text-align: center;
  box-shadow: 0 3px 10px color-mix(in srgb, currentColor 9%, transparent);
}

.--dependency-tree.--mode-pyramid .--dependency-tree-head {
  justify-content: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.--dependency-tree.--mode-pyramid .--dependency-tree-title {
  font-size: var(--dependency-tree-title-size);
  font-weight: 600;
}

.--dependency-tree.--mode-pyramid .--dependency-tree-badge {
  font-size: var(--dependency-tree-badge-size);
  padding: 0.25rem 0.45rem;
}

.--dependency-tree.--mode-pyramid .--dependency-tree-meta {
  display: none;
}

@media (max-width: 900px) {
  .--dependency-tree-row {
    padding-top: 0.6rem;
  }
  .--dependency-tree-pyramid-node {
    width: min(100%, max(88px, 100% / var(--dependency-tree-row-size) - 0.35rem));
  }
  .--dependency-tree-row-track {
    display: none;
  }
}
.--dependency-tree-node {
  display: grid;
  grid-template-columns: 1.25rem minmax(0, 1fr);
  gap: 0.875rem;
  align-items: start;
}

.--dependency-tree-rail {
  position: relative;
  display: flex;
  justify-content: center;
  min-height: 100%;
}

.--dependency-tree-dot {
  width: 0.75rem;
  height: 0.75rem;
  margin-top: 0.55rem;
  border-radius: 999px;
  background: var(--dependency-tree-dot, #64748b);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--dependency-tree-dot, #64748b) 16%, transparent);
  position: relative;
  z-index: 1;
}

.--dependency-tree-line {
  position: absolute;
  top: 1.1rem;
  bottom: -0.5rem;
  width: 1px;
  background: linear-gradient(to bottom, color-mix(in srgb, var(--dependency-tree-dot, #64748b) 78%, transparent), transparent);
}

.--dependency-tree-card {
  border: 1px solid color-mix(in srgb, currentColor 12%, transparent);
  border-radius: 0.9rem;
  padding: var(--dependency-tree-card-padding);
  border-radius: var(--dependency-tree-card-radius);
  background: var(--dependency-tree-card-bg, color-mix(in srgb, currentColor 3%, transparent));
  color: var(--dependency-tree-text, inherit);
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
}

.--dependency-tree-head {
  gap: 0.75rem;
}

.--dependency-tree-title {
  font-weight: 650;
  line-height: 1.25;
  font-size: var(--dependency-tree-title-size);
  word-break: break-word;
}

.--dependency-tree-badge {
  flex: 0 0 auto;
  font-size: var(--dependency-tree-badge-size);
  line-height: 1;
  padding: 0.35rem 0.55rem;
  border-radius: 999px;
  background: var(--dependency-tree-badge-bg, color-mix(in srgb, currentColor 8%, transparent));
  color: var(--dependency-tree-badge-text, inherit);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.--dependency-tree-meta {
  margin-top: 0.45rem;
  font-size: var(--dependency-tree-meta-size);
  opacity: 0.72;
  word-break: break-word;
}

.--dependency-tree-node.--is-current {
  --dependency-tree-dot: #22c55e;
}

.--dependency-tree-node.--status-root {
  --dependency-tree-dot: #2563eb;
  --dependency-tree-line: #2563eb;
}

.--dependency-tree-node.--status-merged {
  --dependency-tree-dot: #8b5cf6;
  --dependency-tree-line: #8b5cf6;
}

.--dependency-tree-node.--status-active {
  --dependency-tree-dot: #22c55e;
  --dependency-tree-line: #22c55e;
}

.--dependency-tree-node.--status-blocked {
  --dependency-tree-dot: #ef4444;
  --dependency-tree-line: #ef4444;
}

.--dependency-tree-pyramid-node.--status-root {
  --dependency-tree-dot: #2563eb;
  --dependency-tree-line: #2563eb;
}

.--dependency-tree-pyramid-node.--status-merged {
  --dependency-tree-dot: #8b5cf6;
  --dependency-tree-line: #8b5cf6;
}

.--dependency-tree-pyramid-node.--status-active {
  --dependency-tree-dot: #22c55e;
  --dependency-tree-line: #22c55e;
}

.--dependency-tree-pyramid-node.--status-blocked {
  --dependency-tree-dot: #ef4444;
  --dependency-tree-line: #ef4444;
}

.--dependency-tree-node.--is-current .--dependency-tree-card {
  border-color: color-mix(in srgb, var(--dependency-tree-dot, #22c55e) 42%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--dependency-tree-dot, #22c55e) 20%, transparent), 0 12px 30px rgba(0, 0, 0, 0.08);
}

.--dependency-tree-pyramid-node.--is-current .--dependency-tree-card {
  border-color: color-mix(in srgb, var(--dependency-tree-dot, #22c55e) 42%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--dependency-tree-dot, #22c55e) 20%, transparent), 0 10px 20px rgba(0, 0, 0, 0.08);
}

.--dependency-tree-empty {
  padding: 1rem 1.1rem;
  border-radius: 0.9rem;
  border: 1px dashed color-mix(in srgb, currentColor 18%, transparent);
  opacity: 0.7;
}

body {
  --dialog-bg: var(--surface);
  --dialog-shadow: var(--zuz-shadow);
  --dialog-radius: 10px;
  --dialog-min-width: 300px;
  --dialog-head-padding: var(--padding-lg-x);
  --dialog-title-opacity: 0.9;
  --dialog-title-font-size: 16px;
  --dialog-description-font-size: 14px;
  --dialog-title-size: 16px;
  --dialog-description-size: 14px;
  --dialog-closer-size: 24px;
  --dialog-closer-bg: var(--background);
  --dialog-closer-color: var(--text-primary);
  --dialog-closer-hover: rgba(255,255,255,0.2);
  --dialog-closer-opacity: 0.75;
  --dialog-closer-hover-opacity: 1;
  --dialog-closer-radius: 50%;
  --dialog-body: var(--dialog-bg);
  --dialog-body-padding: var(--padding-xl-x);
  --dialog-footer: var(--background);
  --dialog-footer-padding: 10px;
  --dialog-action: var(--primary);
  --dialog-action-color: var(--text-primary-inverted);
  --dialog-action-hover: var(--primary-hover);
  --dialog-action-radius: 7px;
  --dialog-action-padding: 7px 20px;
  --dialog-action-font-size: 16px;
  --dialog-action-font-weight: bold;
}

[color-scheme=dark] body {
  --dialog-closer-hover: rgba(255,255,255,0.2);
  --dialog-shadow: 0px 0px 0px 1px #1a1a1a, 0px 0px 6px #000000;
}

.--dialog {
  z-index: var(--max-z-index);
  min-width: var(--dialog-min-width) !important;
  pointer-events: auto !important;
  background: var(--dialog-bg);
  border-radius: var(--dialog-radius);
  box-shadow: var(--dialog-shadow);
  transform-origin: center !important;
  border: var(--dialog-border);
}

.--dialog .--cover {
  border-radius: var(--dialog-radius);
}

.--dialog .--cover.fillx {
  top: -40px !important;
  bottom: -70px !important;
}

.--dialog .--head {
  padding: var(--dialog-head-padding-custom, var(--dialog-head-padding));
  border: var(--dialog-head-border);
}

.--dialog .--head .--dialog-title {
  flex: 1 1;
  font-size: var(--dialog-title-size, var(--dialog-title-font-size));
  font-weight: var(--dialog-title-weight, bold);
  opacity: var(--dialog-title-opacity);
  text-align: var(--dialog-title-position);
  padding: var(--dialog-title-padding, 5px);
}

.--dialog .--head .--dialog-description {
  opacity: var(--dialog-description-opacity, 0.6);
  font-size: var(--dialog-description-size, var(--dialog-description-font-size));
  text-align: var(--dialog-title-position);
  padding: var(--dialog-description-padding, 0px 0px 5px 5px);
}

.--dialog .--head .--position-left {
  --dialog-title-position: left;
}

.--dialog .--head .--position-center {
  --dialog-title-position: center;
}

.--dialog .--head .--position-right {
  --dialog-title-position: right;
}

.--dialog .--head .--closer {
  width: var(--dialog-closer-size);
  height: var(--dialog-closer-size);
  cursor: pointer;
  opacity: var(--dialog-closer-opacity);
  background: var(--dialog-closer-bg);
  border: 0px;
  line-height: 0;
  padding: 3px;
  font-weight: normal;
  border-radius: var(--dialog-closer-radius);
  right: var(--padding-lg-x);
}

.--dialog .--head .--closer svg {
  fill: var(--dialog-closer-color);
}

.--dialog .--head .--closer:hover {
  background: var(--dialog-closer-hover);
  opacity: var(--dialog-closer-hover-opacity);
}

.--dialog .--body {
  background: var(--dialog-body);
  padding: var(--dialog-body-padding);
}

.--dialog .--body.--no-action {
  border-radius: 0px 0px var(--dialog-radius) var(--dialog-radius);
}

.--dialog .--footer {
  padding: var(--dialog-footer-padding);
  background: var(--dialog-footer);
  border-radius: 0px 0px var(--dialog-radius) var(--dialog-radius);
  gap: var(--dialog-footer-gap, 10px);
  border: var(--dialog-footer-border);
}

.--dialog .--footer .--action {
  border-radius: var(--dialog-action-radius);
  padding: var(--dialog-action-padding);
  font-size: var(--dialog-action-font-size);
  font-weight: var(--dialog-action-font-weight);
  border: 0px;
}

.--dialog .--footer .--action.--solid {
  background: var(--dialog-action);
  color: var(--dialog-action-color);
}

.--dialog .--footer .--action.--solid:hover {
  background: var(--dialog-action-hover);
}

body {
  --drawer-color: var(--surface);
  --drawer-handle-color: var(--muted);
  --drawer-radius: 0px;
  --drawer-shadow: var(--zuz-shadow);
  --drawer-close-bg: var(--manatee-100);
  --drawer-close-color: var(--manatee-800);
  --drawer-close-bg-hover: var(--manatee-900);
  --drawer-close-color-hover: #fff;
  --drawer-border-color: var(--border-primary);
  --drawer-border: 1px var(--drawer-border-color) solid;
  --drawer-close-xy: 5px;
}

[color-scheme=dark] body {
  --drawer-close-bg: #555;
  --drawer-close-bg-hover: #444;
  --drawer-close-color: #b6b6b6;
  --drawer-close-color-hover: #fff;
}

.drawer-h, .--drawer.--right, .--drawer.--left {
  min-width: min(320px, 100vw - var(--m) * 2) !important;
  max-width: min(90vw, 100vw - var(--m) * 2);
  top: calc(0px + var(--m));
  bottom: calc(0px + var(--m));
  border-radius: var(--drawer-radius-h, var(--drawer-radius));
}

.drawer-v, .--drawer.--bottom, .--drawer.--top {
  min-height: 10vh;
  max-height: 90vh;
  left: calc(0px + var(--m));
  right: calc(0px + var(--m));
  border-radius: var(--drawer-radius-v, var(--drawer-radius));
}

.--drawer {
  background: var(--drawer-color);
  border: var(--drawer-border);
  box-shadow: var(--drawer-shadow);
  z-index: var(--max-z-index);
  overflow-x: hidden;
  overflow-y: auto;
  will-change: transform, opacity;
  pointer-events: auto !important;
}

.--drawer.--left {
  left: calc(0px + var(--m));
}

.--drawer.--right {
  right: calc(0px + var(--m));
}

.--drawer.--top {
  top: calc(0px + var(--m));
}

.--drawer.--bottom {
  bottom: calc(0px + var(--m));
}

.--drawer .--handle {
  width: 100px;
  height: 6px;
  border-radius: 10px;
  background: var(--drawer-handle-color);
  margin: 12px auto 0px auto;
}

.--drawer .--close-drawer {
  background: var(--drawer-close-bg) !important;
  border-radius: 50% !important;
  width: 25px;
  height: 25px;
  aspect-ratio: 1/1;
  top: var(--drawer-close-xy);
  z-index: 10001;
  padding: 3px;
}

.--drawer .--close-drawer.--close-left {
  left: var(--drawer-close-xy);
}

.--drawer .--close-drawer.--close-right {
  right: var(--drawer-close-xy);
}

.--drawer .--close-drawer svg {
  fill: var(--drawer-close-color);
}

.--drawer .--close-drawer:hover {
  background: var(--drawer-close-bg-hover) !important;
}

.--drawer .--close-drawer:hover svg {
  fill: var(--drawer-close-color-hover);
}

:root {
  --fab-icon-color: #fff;
  --fab-position: 30px;
}

.--fab {
  z-index: var(--max-z-index);
  border-radius: 50% !important;
}

.--fab svg path {
  fill: var(--fab-icon-color);
}

.--fab.--sm {
  width: 40px;
  height: 40px;
  padding: 20px;
}

.--fab.--md {
  width: 50px;
  height: 50px;
  padding: 15px;
}

.--fab.--lg {
  width: 60px;
  height: 60px;
  padding: 20px;
}

.--fab.--bottomright {
  bottom: var(--fab-position);
  right: var(--fab-position);
}

.--fab.--bottomleft {
  bottom: var(--fab-position);
  left: var(--fab-position);
}

.--fab.--topright {
  top: var(--fab-position);
  right: var(--fab-position);
}

.--fab.--topleft {
  top: var(--fab-position);
  left: var(--fab-position);
}

body {
  --fieldset: var(--surface);
  --fieldset-border: 1px solid var(--border-primary);
  --fieldset-legend: var(--surface);
  --fieldset-legend-border: var(--fieldset-border);
}

.--fieldset {
  border: var(--fieldset-border);
  padding: 15px;
  display: flex;
  background: var(--fieldset);
}

.--fieldset .--legend.--top-start {
  top: -0.75lh;
  left: 40px;
}

.--fieldset .--legend.--top-center {
  top: -0.75lh;
  left: 50%;
  translate-x: -50%;
}

.--fieldset .--legend.--top-end {
  top: -0.75lh;
  right: 40px;
}

.--fieldset .--legend.--bottom-start {
  bottom: -0.75lh;
  left: 40px;
}

.--fieldset .--legend.--bottom-center {
  bottom: -0.75lh;
  left: 50%;
  translate-x: -50%;
}

.--fieldset .--legend.--bottom-end {
  bottom: -0.75lh;
  right: 40px;
}

.--fieldset .--legend :nth-child(1) {
  background: var(--fieldset-legend);
  border: var(--fieldset-legend-border);
}

.--fieldset.--xs {
  border-radius: var(--radius-xs);
}

.--fieldset.--xs .--legend :nth-child(1) {
  font-size: var(--text-xs);
  padding: calc(var(--padding-xs-x) / 3) var(--padding-xs-y, 5px);
  border-radius: var(--radius-xs);
}

.--fieldset.--sm {
  border-radius: var(--radius-sm);
}

.--fieldset.--sm .--legend :nth-child(1) {
  font-size: var(--text-sm);
  padding: calc(var(--padding-sm-x) / 3) var(--padding-sm-y, 5px);
  border-radius: var(--radius-sm);
}

.--fieldset.--md {
  border-radius: var(--radius-md);
}

.--fieldset.--md .--legend :nth-child(1) {
  font-size: var(--text-md);
  padding: calc(var(--padding-md-x) / 3) var(--padding-md-y, 5px);
  border-radius: var(--radius-md);
}

.--fieldset.--lg {
  border-radius: var(--radius-lg);
}

.--fieldset.--lg .--legend :nth-child(1) {
  font-size: var(--text-lg);
  padding: calc(var(--padding-lg-x) / 3) var(--padding-lg-y, 5px);
  border-radius: var(--radius-lg);
}

.--fieldset.--xl {
  border-radius: var(--radius-xl);
}

.--fieldset.--xl .--legend :nth-child(1) {
  font-size: var(--text-xl);
  padding: calc(var(--padding-xl-x) / 3) var(--padding-xl-y, 5px);
  border-radius: var(--radius-xl);
}

.--fieldset.--xxl {
  border-radius: var(--radius-xxl);
}

.--fieldset.--xxl .--legend :nth-child(1) {
  font-size: var(--text-xxl);
  padding: calc(var(--padding-xxl-x) / 3) var(--padding-xxl-y, 5px);
  border-radius: var(--radius-xxl);
}

.--fieldset.--2xl {
  border-radius: var(--radius-2xl);
}

.--fieldset.--2xl .--legend :nth-child(1) {
  font-size: var(--text-2xl);
  padding: calc(var(--padding-2xl-x) / 3) var(--padding-2xl-y, 5px);
  border-radius: var(--radius-2xl);
}

.--fieldset.--3xl {
  border-radius: var(--radius-3xl);
}

.--fieldset.--3xl .--legend :nth-child(1) {
  font-size: var(--text-3xl);
  padding: calc(var(--padding-3xl-x) / 3) var(--padding-3xl-y, 5px);
  border-radius: var(--radius-3xl);
}

.--fieldset.--4xl {
  border-radius: var(--radius-4xl);
}

.--fieldset.--4xl .--legend :nth-child(1) {
  font-size: var(--text-4xl);
  padding: calc(var(--padding-4xl-x) / 3) var(--padding-4xl-y, 5px);
  border-radius: var(--radius-4xl);
}

.--fieldset.--5xl {
  border-radius: var(--radius-5xl);
}

.--fieldset.--5xl .--legend :nth-child(1) {
  font-size: var(--text-5xl);
  padding: calc(var(--padding-5xl-x) / 3) var(--padding-5xl-y, 5px);
  border-radius: var(--radius-5xl);
}

.--fieldset.--6xl {
  border-radius: var(--radius-6xl);
}

.--fieldset.--6xl .--legend :nth-child(1) {
  font-size: var(--text-6xl);
  padding: calc(var(--padding-6xl-x) / 3) var(--padding-6xl-y, 5px);
  border-radius: var(--radius-6xl);
}

.--fieldset.--7xl {
  border-radius: var(--radius-7xl);
}

.--fieldset.--7xl .--legend :nth-child(1) {
  font-size: var(--text-7xl);
  padding: calc(var(--padding-7xl-x) / 3) var(--padding-7xl-y, 5px);
  border-radius: var(--radius-7xl);
}

.--fieldset.--8xl {
  border-radius: var(--radius-8xl);
}

.--fieldset.--8xl .--legend :nth-child(1) {
  font-size: var(--text-8xl);
  padding: calc(var(--padding-8xl-x) / 3) var(--padding-8xl-y, 5px);
  border-radius: var(--radius-8xl);
}

.--fieldset.--9xl {
  border-radius: var(--radius-9xl);
}

.--fieldset.--9xl .--legend :nth-child(1) {
  font-size: var(--text-9xl);
  padding: calc(var(--padding-9xl-x) / 3) var(--padding-9xl-y, 5px);
  border-radius: var(--radius-9xl);
}

body {
  --form-padding: 0px;
}

.--form {
  padding: var(--form-padding, 0px);
}

body {
  --input: var(--gray-200);
  --input-border: 1px var(--border-primary) solid;
  --input-color: var(--text-primary);
}

input[type=date]::-webkit-calendar-picker-indicator {
  color: var(--text-primary);
}

[color-scheme=dark] body {
  --input: var(--gray-800);
}

.--input.--xs {
  padding: var(--padding-xs);
  font-size: var(--text-xs);
  line-height: var(--lh-xs, 1.4);
}

.--input.--xs:not(.--textarea):not(.--otp) {
  min-height: var(--input-control-height-xs, var(--control-height-xs));
  height: var(--input-control-height-xs, var(--control-height-xs));
}

.--input.--xs:not(.--textarea) {
  border-radius: var(--radius-xs);
}

.--input.--xs.--textarea {
  border-radius: var(--textarea-radius, var(--radius-xs));
  resize: none;
}

.--input.--sm {
  padding: var(--padding-sm);
  font-size: var(--text-sm);
  line-height: var(--lh-sm, 1.4);
}

.--input.--sm:not(.--textarea):not(.--otp) {
  min-height: var(--input-control-height-sm, var(--control-height-sm));
  height: var(--input-control-height-sm, var(--control-height-sm));
}

.--input.--sm:not(.--textarea) {
  border-radius: var(--radius-sm);
}

.--input.--sm.--textarea {
  border-radius: var(--textarea-radius, var(--radius-sm));
  resize: none;
}

.--input.--md {
  padding: var(--padding-md);
  font-size: var(--text-md);
  line-height: var(--lh-md, 1.4);
}

.--input.--md:not(.--textarea):not(.--otp) {
  min-height: var(--input-control-height-md, var(--control-height-md));
  height: var(--input-control-height-md, var(--control-height-md));
}

.--input.--md:not(.--textarea) {
  border-radius: var(--radius-md);
}

.--input.--md.--textarea {
  border-radius: var(--textarea-radius, var(--radius-md));
  resize: none;
}

.--input.--lg {
  padding: var(--padding-lg);
  font-size: var(--text-lg);
  line-height: var(--lh-lg, 1.4);
}

.--input.--lg:not(.--textarea):not(.--otp) {
  min-height: var(--input-control-height-lg, var(--control-height-lg));
  height: var(--input-control-height-lg, var(--control-height-lg));
}

.--input.--lg:not(.--textarea) {
  border-radius: var(--radius-lg);
}

.--input.--lg.--textarea {
  border-radius: var(--textarea-radius, var(--radius-lg));
  resize: none;
}

.--input.--xl {
  padding: var(--padding-xl);
  font-size: var(--text-xl);
  line-height: var(--lh-xl, 1.4);
}

.--input.--xl:not(.--textarea):not(.--otp) {
  min-height: var(--input-control-height-xl, var(--control-height-xl));
  height: var(--input-control-height-xl, var(--control-height-xl));
}

.--input.--xl:not(.--textarea) {
  border-radius: var(--radius-xl);
}

.--input.--xl.--textarea {
  border-radius: var(--textarea-radius, var(--radius-xl));
  resize: none;
}

.--input.--xxl {
  padding: var(--padding-xxl);
  font-size: var(--text-xxl);
  line-height: var(--lh-xxl, 1.4);
}

.--input.--xxl:not(.--textarea):not(.--otp) {
  min-height: var(--input-control-height-xxl, var(--control-height-xxl));
  height: var(--input-control-height-xxl, var(--control-height-xxl));
}

.--input.--xxl:not(.--textarea) {
  border-radius: var(--radius-xxl);
}

.--input.--xxl.--textarea {
  border-radius: var(--textarea-radius, var(--radius-xxl));
  resize: none;
}

.--input.--2xl {
  padding: var(--padding-2xl);
  font-size: var(--text-2xl);
  line-height: var(--lh-2xl, 1.4);
}

.--input.--2xl:not(.--textarea):not(.--otp) {
  min-height: var(--input-control-height-2xl, var(--control-height-2xl));
  height: var(--input-control-height-2xl, var(--control-height-2xl));
}

.--input.--2xl:not(.--textarea) {
  border-radius: var(--radius-2xl);
}

.--input.--2xl.--textarea {
  border-radius: var(--textarea-radius, var(--radius-2xl));
  resize: none;
}

.--input.--3xl {
  padding: var(--padding-3xl);
  font-size: var(--text-3xl);
  line-height: var(--lh-3xl, 1.4);
}

.--input.--3xl:not(.--textarea):not(.--otp) {
  min-height: var(--input-control-height-3xl, var(--control-height-3xl));
  height: var(--input-control-height-3xl, var(--control-height-3xl));
}

.--input.--3xl:not(.--textarea) {
  border-radius: var(--radius-3xl);
}

.--input.--3xl.--textarea {
  border-radius: var(--textarea-radius, var(--radius-3xl));
  resize: none;
}

.--input.--4xl {
  padding: var(--padding-4xl);
  font-size: var(--text-4xl);
  line-height: var(--lh-4xl, 1.4);
}

.--input.--4xl:not(.--textarea):not(.--otp) {
  min-height: var(--input-control-height-4xl, var(--control-height-4xl));
  height: var(--input-control-height-4xl, var(--control-height-4xl));
}

.--input.--4xl:not(.--textarea) {
  border-radius: var(--radius-4xl);
}

.--input.--4xl.--textarea {
  border-radius: var(--textarea-radius, var(--radius-4xl));
  resize: none;
}

.--input.--5xl {
  padding: var(--padding-5xl);
  font-size: var(--text-5xl);
  line-height: var(--lh-5xl, 1.4);
}

.--input.--5xl:not(.--textarea):not(.--otp) {
  min-height: var(--input-control-height-5xl, var(--control-height-5xl));
  height: var(--input-control-height-5xl, var(--control-height-5xl));
}

.--input.--5xl:not(.--textarea) {
  border-radius: var(--radius-5xl);
}

.--input.--5xl.--textarea {
  border-radius: var(--textarea-radius, var(--radius-5xl));
  resize: none;
}

.--input.--6xl {
  padding: var(--padding-6xl);
  font-size: var(--text-6xl);
  line-height: var(--lh-6xl, 1.4);
}

.--input.--6xl:not(.--textarea):not(.--otp) {
  min-height: var(--input-control-height-6xl, var(--control-height-6xl));
  height: var(--input-control-height-6xl, var(--control-height-6xl));
}

.--input.--6xl:not(.--textarea) {
  border-radius: var(--radius-6xl);
}

.--input.--6xl.--textarea {
  border-radius: var(--textarea-radius, var(--radius-6xl));
  resize: none;
}

.--input.--7xl {
  padding: var(--padding-7xl);
  font-size: var(--text-7xl);
  line-height: var(--lh-7xl, 1.4);
}

.--input.--7xl:not(.--textarea):not(.--otp) {
  min-height: var(--input-control-height-7xl, var(--control-height-7xl));
  height: var(--input-control-height-7xl, var(--control-height-7xl));
}

.--input.--7xl:not(.--textarea) {
  border-radius: var(--radius-7xl);
}

.--input.--7xl.--textarea {
  border-radius: var(--textarea-radius, var(--radius-7xl));
  resize: none;
}

.--input.--8xl {
  padding: var(--padding-8xl);
  font-size: var(--text-8xl);
  line-height: var(--lh-8xl, 1.4);
}

.--input.--8xl:not(.--textarea):not(.--otp) {
  min-height: var(--input-control-height-8xl, var(--control-height-8xl));
  height: var(--input-control-height-8xl, var(--control-height-8xl));
}

.--input.--8xl:not(.--textarea) {
  border-radius: var(--radius-8xl);
}

.--input.--8xl.--textarea {
  border-radius: var(--textarea-radius, var(--radius-8xl));
  resize: none;
}

.--input.--9xl {
  padding: var(--padding-9xl);
  font-size: var(--text-9xl);
  line-height: var(--lh-9xl, 1.4);
}

.--input.--9xl:not(.--textarea):not(.--otp) {
  min-height: var(--input-control-height-9xl, var(--control-height-9xl));
  height: var(--input-control-height-9xl, var(--control-height-9xl));
}

.--input.--9xl:not(.--textarea) {
  border-radius: var(--radius-9xl);
}

.--input.--9xl.--textarea {
  border-radius: var(--textarea-radius, var(--radius-9xl));
  resize: none;
}

.--input {
  background: var(--input);
  border: var(--input-border);
  color: var(--input-color);
  width: 100%;
}

.--input.--otp {
  letter-spacing: 1ch;
  font-feature-settings: "tnum";
  font-variant: tabular-nums;
  font-family: monospace;
  line-height: 1;
  text-indent: 1.45ch;
  clip-path: inset(0 1ch 0 1ch);
  height: 2ch;
}

.--input:focus(:not(.--no-focus)) {
  box-shadow: 0px 0px 0px 1px var(--input-border-focus);
}

body {
  --kbd-bg: var(--slate-400);
  --kbd-color: #fff;
  --kbd-gap-xs: 1px;
  --kbd-gap-sm: 2px;
  --kbd-gap-md: 3px;
  --kbd-gap-lg: 4px;
  --kbd-gap-xl: 5px;
  --kbd-gap-xxl: 6px;
}

.--keyboard-keys {
  background: var(--kbd-bg);
  color: var(--kbd-color);
}

.--keyboard-keys.--xs {
  gap: var(--kbd-gap-xs);
  border-radius: var(--radius-xs);
  padding: calc(var(--padding-xs-x) / 2) var(--padding-xs-x);
  font-size: var(--text-xs);
}

.--keyboard-keys.--sm {
  gap: var(--kbd-gap-sm);
  border-radius: var(--radius-sm);
  padding: calc(var(--padding-sm-x) / 2) var(--padding-sm-x);
  font-size: var(--text-sm);
}

.--keyboard-keys.--md {
  gap: var(--kbd-gap-md);
  border-radius: var(--radius-md);
  padding: calc(var(--padding-md-x) / 2) var(--padding-md-x);
  font-size: var(--text-md);
}

.--keyboard-keys.--lg {
  gap: var(--kbd-gap-lg);
  border-radius: var(--radius-lg);
  padding: calc(var(--padding-lg-x) / 2) var(--padding-lg-x);
  font-size: var(--text-lg);
}

.--keyboard-keys.--xl {
  gap: var(--kbd-gap-xl);
  border-radius: var(--radius-xl);
  padding: calc(var(--padding-xl-x) / 2) var(--padding-xl-x);
  font-size: var(--text-xl);
}

.--keyboard-keys.--xxl {
  gap: var(--kbd-gap-xxl);
  border-radius: var(--radius-xxl);
  padding: calc(var(--padding-xxl-x) / 2) var(--padding-xxl-x);
  font-size: var(--text-xxl);
}

.--keyboard-keys.--2xl {
  gap: var(--kbd-gap-2xl);
  border-radius: var(--radius-2xl);
  padding: calc(var(--padding-2xl-x) / 2) var(--padding-2xl-x);
  font-size: var(--text-2xl);
}

.--keyboard-keys.--3xl {
  gap: var(--kbd-gap-3xl);
  border-radius: var(--radius-3xl);
  padding: calc(var(--padding-3xl-x) / 2) var(--padding-3xl-x);
  font-size: var(--text-3xl);
}

.--keyboard-keys.--4xl {
  gap: var(--kbd-gap-4xl);
  border-radius: var(--radius-4xl);
  padding: calc(var(--padding-4xl-x) / 2) var(--padding-4xl-x);
  font-size: var(--text-4xl);
}

.--keyboard-keys.--5xl {
  gap: var(--kbd-gap-5xl);
  border-radius: var(--radius-5xl);
  padding: calc(var(--padding-5xl-x) / 2) var(--padding-5xl-x);
  font-size: var(--text-5xl);
}

.--keyboard-keys.--6xl {
  gap: var(--kbd-gap-6xl);
  border-radius: var(--radius-6xl);
  padding: calc(var(--padding-6xl-x) / 2) var(--padding-6xl-x);
  font-size: var(--text-6xl);
}

.--keyboard-keys.--7xl {
  gap: var(--kbd-gap-7xl);
  border-radius: var(--radius-7xl);
  padding: calc(var(--padding-7xl-x) / 2) var(--padding-7xl-x);
  font-size: var(--text-7xl);
}

.--keyboard-keys.--8xl {
  gap: var(--kbd-gap-8xl);
  border-radius: var(--radius-8xl);
  padding: calc(var(--padding-8xl-x) / 2) var(--padding-8xl-x);
  font-size: var(--text-8xl);
}

.--keyboard-keys.--9xl {
  gap: var(--kbd-gap-9xl);
  border-radius: var(--radius-9xl);
  padding: calc(var(--padding-9xl-x) / 2) var(--padding-9xl-x);
  font-size: var(--text-9xl);
}

.--lightbox-overlay {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.75);
  z-index: 10000;
  padding: 24px;
}

.--lightbox-close {
  position: absolute;
  right: 18px;
  top: 18px;
  color: #fff;
  font-size: 28px;
  cursor: pointer;
  z-index: 10100;
}

.--lightbox-img {
  max-width: 90vw;
  max-height: 80vh;
  object-fit: contain;
  border-radius: 6px;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.6);
}

.--list {
  position: relative;
}

.--list.--list-style {
  padding-inline-start: 1.2rem;
}

.--list.--list-style > li {
  display: list-item;
}

.--list.--list-style.--ls-arabic-indic {
  list-style: arabic-indic !important;
}

.--list.--list-style.--ls-arabic-indic > li {
  list-style: arabic-indic !important;
}

.--list.--list-style.--ls-armenian {
  list-style: armenian !important;
}

.--list.--list-style.--ls-armenian > li {
  list-style: armenian !important;
}

.--list.--list-style.--ls-bengali {
  list-style: bengali !important;
}

.--list.--list-style.--ls-bengali > li {
  list-style: bengali !important;
}

.--list.--list-style.--ls-cambodian {
  list-style: cambodian !important;
}

.--list.--list-style.--ls-cambodian > li {
  list-style: cambodian !important;
}

.--list.--list-style.--ls-circle {
  list-style: circle !important;
}

.--list.--list-style.--ls-circle > li {
  list-style: circle !important;
}

.--list.--list-style.--ls-cjk-earthly-branch {
  list-style: cjk-earthly-branch !important;
}

.--list.--list-style.--ls-cjk-earthly-branch > li {
  list-style: cjk-earthly-branch !important;
}

.--list.--list-style.--ls-cjk-heavenly-stem {
  list-style: cjk-heavenly-stem !important;
}

.--list.--list-style.--ls-cjk-heavenly-stem > li {
  list-style: cjk-heavenly-stem !important;
}

.--list.--list-style.--ls-cjk-ideographic {
  list-style: cjk-ideographic !important;
}

.--list.--list-style.--ls-cjk-ideographic > li {
  list-style: cjk-ideographic !important;
}

.--list.--list-style.--ls-decimal {
  list-style: decimal !important;
}

.--list.--list-style.--ls-decimal > li {
  list-style: decimal !important;
}

.--list.--list-style.--ls-decimal-leading-zero {
  list-style: decimal-leading-zero !important;
}

.--list.--list-style.--ls-decimal-leading-zero > li {
  list-style: decimal-leading-zero !important;
}

.--list.--list-style.--ls-devanagari {
  list-style: devanagari !important;
}

.--list.--list-style.--ls-devanagari > li {
  list-style: devanagari !important;
}

.--list.--list-style.--ls-disc {
  list-style: disc !important;
}

.--list.--list-style.--ls-disc > li {
  list-style: disc !important;
}

.--list.--list-style.--ls-ethiopic-halehame {
  list-style: ethiopic-halehame !important;
}

.--list.--list-style.--ls-ethiopic-halehame > li {
  list-style: ethiopic-halehame !important;
}

.--list.--list-style.--ls-ethiopic-halehame-am {
  list-style: ethiopic-halehame-am !important;
}

.--list.--list-style.--ls-ethiopic-halehame-am > li {
  list-style: ethiopic-halehame-am !important;
}

.--list.--list-style.--ls-ethiopic-halehame-ti-er {
  list-style: ethiopic-halehame-ti-er !important;
}

.--list.--list-style.--ls-ethiopic-halehame-ti-er > li {
  list-style: ethiopic-halehame-ti-er !important;
}

.--list.--list-style.--ls-georgian {
  list-style: georgian !important;
}

.--list.--list-style.--ls-georgian > li {
  list-style: georgian !important;
}

.--list.--list-style.--ls-gujarati {
  list-style: gujarati !important;
}

.--list.--list-style.--ls-gujarati > li {
  list-style: gujarati !important;
}

.--list.--list-style.--ls-gurmukhi {
  list-style: gurmukhi !important;
}

.--list.--list-style.--ls-gurmukhi > li {
  list-style: gurmukhi !important;
}

.--list.--list-style.--ls-hebrew {
  list-style: hebrew !important;
}

.--list.--list-style.--ls-hebrew > li {
  list-style: hebrew !important;
}

.--list.--list-style.--ls-hiragana {
  list-style: hiragana !important;
}

.--list.--list-style.--ls-hiragana > li {
  list-style: hiragana !important;
}

.--list.--list-style.--ls-hiragana-iroha {
  list-style: hiragana-iroha !important;
}

.--list.--list-style.--ls-hiragana-iroha > li {
  list-style: hiragana-iroha !important;
}

.--list.--list-style.--ls-japanese-formal {
  list-style: japanese-formal !important;
}

.--list.--list-style.--ls-japanese-formal > li {
  list-style: japanese-formal !important;
}

.--list.--list-style.--ls-japanese-informal {
  list-style: japanese-informal !important;
}

.--list.--list-style.--ls-japanese-informal > li {
  list-style: japanese-informal !important;
}

.--list.--list-style.--ls-khmer {
  list-style: khmer !important;
}

.--list.--list-style.--ls-khmer > li {
  list-style: khmer !important;
}

.--list.--list-style.--ls-korean-hangul-formal {
  list-style: korean-hangul-formal !important;
}

.--list.--list-style.--ls-korean-hangul-formal > li {
  list-style: korean-hangul-formal !important;
}

.--list.--list-style.--ls-korean-hanja-formal {
  list-style: korean-hanja-formal !important;
}

.--list.--list-style.--ls-korean-hanja-formal > li {
  list-style: korean-hanja-formal !important;
}

.--list.--list-style.--ls-korean-hanja-informal {
  list-style: korean-hanja-informal !important;
}

.--list.--list-style.--ls-korean-hanja-informal > li {
  list-style: korean-hanja-informal !important;
}

.--list.--list-style.--ls-lower-alpha {
  list-style: lower-alpha !important;
}

.--list.--list-style.--ls-lower-alpha > li {
  list-style: lower-alpha !important;
}

.--list.--list-style.--ls-lower-greek {
  list-style: lower-greek !important;
}

.--list.--list-style.--ls-lower-greek > li {
  list-style: lower-greek !important;
}

.--list.--list-style.--ls-lower-latin {
  list-style: lower-latin !important;
}

.--list.--list-style.--ls-lower-latin > li {
  list-style: lower-latin !important;
}

.--list.--list-style.--ls-lower-roman {
  list-style: lower-roman !important;
}

.--list.--list-style.--ls-lower-roman > li {
  list-style: lower-roman !important;
}

.--list.--list-style.--ls-upper-alpha {
  list-style: upper-alpha !important;
}

.--list.--list-style.--ls-upper-alpha > li {
  list-style: upper-alpha !important;
}

.--list.--list-style.--ls-upper-latin {
  list-style: upper-latin !important;
}

.--list.--list-style.--ls-upper-latin > li {
  list-style: upper-latin !important;
}

.--list.--list-style.--ls-upper-roman {
  list-style: upper-roman !important;
}

.--list.--list-style.--ls-upper-roman > li {
  list-style: upper-roman !important;
}

.--list li {
  transition: transform var(--list-drop-highlight-duration, 560ms) var(--list-drop-highlight-curve, ease-in-out), box-shadow var(--list-drop-highlight-duration, 560ms) var(--list-drop-highlight-curve, ease-in-out), background-color var(--list-drop-highlight-duration, 560ms) var(--list-drop-highlight-curve, ease-in-out), opacity 180ms ease, margin 280ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.--list.--hoverable li:hover {
  background: var(--list-item-hover, var(--surface-hover));
}

.--list.--xs li {
  padding: var(--list-item-padding-xs);
  border-radius: var(--list-item-radius-xs);
}

.--list.--sm li {
  padding: var(--list-item-padding-sm);
  border-radius: var(--list-item-radius-sm);
}

.--list.--md li {
  padding: var(--list-item-padding-md);
  border-radius: var(--list-item-radius-md);
}

.--list.--lg li {
  padding: var(--list-item-padding-lg);
  border-radius: var(--list-item-radius-lg);
}

.--list.--xl li {
  padding: var(--list-item-padding-xl);
  border-radius: var(--list-item-radius-xl);
}

.--list.--xxl li {
  padding: var(--list-item-padding-xxl);
  border-radius: var(--list-item-radius-xxl);
}

.--list.--2xl li {
  padding: var(--list-item-padding-2xl);
  border-radius: var(--list-item-radius-2xl);
}

.--list.--3xl li {
  padding: var(--list-item-padding-3xl);
  border-radius: var(--list-item-radius-3xl);
}

.--list.--4xl li {
  padding: var(--list-item-padding-4xl);
  border-radius: var(--list-item-radius-4xl);
}

.--list.--5xl li {
  padding: var(--list-item-padding-5xl);
  border-radius: var(--list-item-radius-5xl);
}

.--list.--6xl li {
  padding: var(--list-item-padding-6xl);
  border-radius: var(--list-item-radius-6xl);
}

.--list.--7xl li {
  padding: var(--list-item-padding-7xl);
  border-radius: var(--list-item-radius-7xl);
}

.--list.--8xl li {
  padding: var(--list-item-padding-8xl);
  border-radius: var(--list-item-radius-8xl);
}

.--list.--9xl li {
  padding: var(--list-item-padding-9xl);
  border-radius: var(--list-item-radius-9xl);
}

.--list li.--is-dragging {
  transition: transform 0ms ease, box-shadow var(--list-drop-highlight-duration, 560ms) var(--list-drop-highlight-curve, ease-in-out), background-color var(--list-drop-highlight-duration, 560ms) var(--list-drop-highlight-curve, ease-in-out), opacity 180ms ease;
}

.--list li.--drag-origin-outline {
  outline: 2px dashed color-mix(in srgb, var(--accent, #4f46e5) 55%, transparent);
  outline-offset: -2px;
  opacity: 0.15;
}

.--list li.--drag-origin-placeholder {
  outline: 2px dashed color-mix(in srgb, var(--accent, #4f46e5) 65%, transparent);
  outline-offset: -1px;
  background: color-mix(in srgb, var(--accent, #4f46e5) 5%, transparent);
}

.--list li.--is-over.--can-drop {
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--accent, #4f46e5) 50%, transparent);
  background: color-mix(in srgb, var(--accent, #4f46e5) 8%, transparent);
}

.--list li.--drop-highlighted {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent, #4f46e5) 65%, transparent), 0 12px 28px -14px color-mix(in srgb, var(--accent, #4f46e5) 70%, transparent);
  background: color-mix(in srgb, var(--accent, #4f46e5) 10%, transparent);
}

.--list li.--drop-highlighted.--drop-tx-scale {
  transform: scale(1.02);
}

.--list li.--drop-highlighted.--drop-tx-slide-left {
  transform: translateX(-4px);
}

.--list li.--drop-highlighted.--drop-tx-slide-right {
  transform: translateX(4px);
}

.--list li.--drop-highlighted.--drop-tx-slide-top {
  transform: translateY(-4px);
}

.--list li.--drop-highlighted.--drop-tx-slide-bottom {
  transform: translateY(4px);
}

.--list li.--drop-highlighted.--drop-tx-fade {
  opacity: 0.92;
}

.--list li.--selected {
  background: color-mix(in srgb, var(--accent, #4f46e5) 14%, transparent);
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--accent, #4f46e5) 45%, transparent);
}

.--list .--list-clone-ghost {
  position: fixed;
  z-index: 9999;
  pointer-events: none;
  padding: var(--list-item-padding-sm);
  border-radius: 10px;
  background: color-mix(in srgb, var(--accent, #4f46e5) 12%, white);
  box-shadow: 0 12px 32px -16px rgba(15, 23, 42, 0.55);
  border: 1px solid color-mix(in srgb, var(--accent, #4f46e5) 35%, transparent);
  max-width: min(420px, 100vw - 32px);
  opacity: 0.96;
}

.--list .--list-item-icon, .--list .--list-item-action, .--list .--list-item-label {
  display: inline-flex;
  align-items: center;
}

.--list .--list-item-label {
  gap: 6px;
}

.--list li.--list-empty {
  list-style: none;
  pointer-events: none;
  color: color-mix(in srgb, currentColor 50%, transparent);
  font-size: 0.875rem;
}

:root {
  --network-manager: #111;
  --network-manager-color: #fff;
  --network-manager-radius-sm: 8px;
  --network-manager-radius-md: 10px;
  --network-manager-radius-lg: 12px;
  --network-manager-padding-sm: 6px 10px;
  --network-manager-padding-md: 8px 12px;
  --network-manager-padding-lg: 10px 14px;
  --network-manager-icon-size-sm: 18px;
  --network-manager-icon-size-md: 20px;
  --network-manager-icon-size-lg: 24px;
  --network-manager-font-size-sm: 14px;
  --network-manager-font-size-md: 16px;
  --network-manager-font-size-lg: 18px;
}

.--network-manager {
  color: var(--network-manager-color);
  z-index: var(--max-z-index);
  bottom: 50px;
  left: 50%;
}

.--network-manager.--online {
  background: var(--green-600);
}

.--network-manager.--offline {
  background: var(--red-600);
}

.--network-manager svg {
  fill: var(--network-manager-color);
}

.--network-manager.--sm {
  padding: var(--network-manager-padding-sm);
  border-radius: var(--network-manager-radius-sm);
  font-size: var(--network-manager-font-size-sm);
  gap: 6px;
}

.--network-manager.--sm .--ico {
  width: var(--network-manager-icon-size-sm);
  height: var(--network-manager-icon-size-sm);
}

.--network-manager.--md {
  padding: var(--network-manager-padding-md);
  border-radius: var(--network-manager-radius-md);
  font-size: var(--network-manager-font-size-md);
  gap: 8px;
}

.--network-manager.--md .--ico {
  width: var(--network-manager-icon-size-md);
  height: var(--network-manager-icon-size-md);
}

.--network-manager.--lg {
  padding: var(--network-manager-padding-lg);
  border-radius: var(--network-manager-radius-lg);
  font-size: var(--network-manager-font-size-lg);
  gap: 10px;
}

.--network-manager.--lg .--ico {
  width: var(--network-manager-icon-size-lg);
  height: var(--network-manager-icon-size-lg);
}

body {
  --overlay: rgba(255,255,255, 0.7);
  --overlay-blur: 5px;
}

[color-scheme=dark] body {
  --overlay: rgba(0, 0, 0, 0.7);
}

.--overlay {
  background: var(--overlay);
  z-index: var(--max-z-index);
  -webkit-backdrop-filter: blur(var(--overlay-blur));
          backdrop-filter: blur(var(--overlay-blur));
  pointer-events: auto !important;
}

body {
  --pagination: transparent;
  --pagination-padding: 10px;
  --pagination-font-size: 15px;
  --pagination-current-page-bg: var(--blue-500);
  --pagination-current-page-color: #fff;
  --pagination-disabled-page-color: var(--black-300);
  --pagination-table-button-padding: 4px 8px;
  --pagination-table-button-nav-padding: 3px;
  --pagination-table-button-size: 35px;
  --pagination-table-button-border: 1px #ddd solid;
  --pagination-table-button-color: #111;
  --pagination-table-button-hover-color: #111;
  --pagination-table-button-bg: #fff;
  --pagination-table-button-hover-bg: #eee;
  --pagination-table-gap: 1px;
  --pagination-table-radius: 5px;
  --pagination-table-icon-size: 26px;
  --pagination-dot-color: #c6c6c6;
  --pagination-dot-current-color: var(--pagination-dot-color);
  --pagination-dot-progress-color: #111;
  --pagination-dot-progress-track-color: var(--pagination-dot-color);
}

[color-scheme=dark] body {
  --pagination-current-page-bg: var(--blue-500);
  --pagination-current-page-color: #fff;
  --pagination-disabled-page-color: var(--white-300);
  --pagination-table-button-border: 1px var(--pagination-table-button-bg) solid;
  --pagination-table-button-color: #f9f9f9;
  --pagination-table-button-hover-color: #fff;
  --pagination-table-button-bg: #333;
  --pagination-table-button-hover-bg: var(--blue-500);
  --pagination-dot-color: rgba(255, 255, 255, 0.4);
  --pagination-dot-progress-color: #fff;
}

.--pagination {
  padding: var(--pagination-padding);
  background: var(--pagination);
  font-size: var(--pagination-font-size);
}

.--pagination .--button.--current-page {
  background: var(--pagination-current-page-bg) !important;
  color: var(--pagination-current-page-color) !important;
}

.--pagination .--button.--current-page:disabled {
  pointer-events: none !important;
  cursor: auto !important;
}

.--pagination .--button:disabled:not(.--current-page) {
  pointer-events: none !important;
  cursor: auto !important;
  background: rgba(0, 0, 0, 0) !important;
  color: var(--pagination-disabled-page-color) !important;
}

.--pagination.--pgt-table .--pgt-btns {
  gap: var(--pagination-table-gap);
}

.--pagination.--pgt-table .--pgt-btns.--pgt-nav {
  margin-left: 20px;
}

.--pagination.--pgt-table .--pgt-btns.--pgt-nav .--button {
  padding: var(--pagination-table-button-nav-padding);
}

.--pagination.--pgt-table .--button {
  min-width: var(--pagination-table-button-size) !important;
  height: var(--pagination-table-button-size);
  font-size: var(--pagination-font-size);
  border: var(--pagination-table-button-border);
  background: var(--pagination-table-button-bg);
  color: var(--pagination-table-button-color);
  padding: var(--pagination-table-button-padding);
}

.--pagination.--pgt-table .--button:hover {
  background: var(--pagination-table-button-hover-bg);
  color: var(--pagination-table-button-hover-color);
}

.--pagination.--pgt-table .--button:hover svg {
  fill: var(--pagination-table-button-hover-color);
}

.--pagination.--pgt-table .--button:first-child {
  border-radius: var(--pagination-table-radius) 0px 0px var(--pagination-table-radius);
}

.--pagination.--pgt-table .--button:last-child {
  border-radius: 0px var(--pagination-table-radius) var(--pagination-table-radius) 0px;
}

.--pagination.--pgt-table .--button svg {
  fill: var(--pagination-table-button-color);
  width: var(--pagination-table-icon-size);
}

.--pagination.--pgt-table .--button.--current-page {
  border: 1px var(--pagination-current-page-bg) solid !important;
}

.--pagination.--pgt-table .--button:disabled svg {
  opacity: 0.4;
}

.--pagination.--as-dots {
  --progress-track: var(--pagination-dot-progress-track-color);
  --progress-bar: var(--pagination-dot-progress-color);
}

.--pagination.--as-dots .--pagination-label, .--pagination.--as-dots .--pgt-nav, .--pagination.--as-dots .--pgt-info {
  display: none !important;
}

.--pagination.--as-dots .--pgt-btns {
  justify-content: center;
  gap: 8px;
}

.--pagination.--as-dots .--pgt-btns .--button {
  width: 8px;
  height: 8px;
  padding: 0;
  border-radius: 50%;
  background: var(--pagination-dot-color);
  color: rgba(0, 0, 0, 0);
  border: none;
  transition: background-color 0.2s ease, color 0.2s ease, opacity 0.2s ease;
}

.--pagination.--as-dots .--pgt-btns .--button.--current-page {
  background: rgba(0, 0, 0, 0) !important;
  width: 20px;
  border-radius: 10px;
}

.--pagination.--as-dots .--pgt-btns .--button:disabled:not(.--current-page) {
  background: var(--pagination-dot-current-color) !important;
}

body {
  --password-toggle-radius: var(--radius-md);
  --password-toggle: transparent;
  --password-toggle-width: 40px;
  --password-toggle-border: 0px;
  --password-toggle-padding: 6px;
  --password-toggle-size: 20px;
  --password-toggle-color: var(--text-secondary);
  --password-meter-gap: 4px;
  --password-meter-margin: 6px 0px 0px 0px;
  --password-meter-bar-height: 4px;
  --password-meter-bar-radius: 4px;
  --password-meter-label-size: 12px;
}

.--password {
  overflow: hidden;
  width: 100%;
}

.--password.--xs {
  --password-toggle-radius: var(--radius-xs);
}

.--password.--sm {
  --password-toggle-radius: var(--radius-sm);
}

.--password.--md {
  --password-toggle-radius: var(--radius-md);
}

.--password.--lg {
  --password-toggle-radius: var(--radius-lg);
}

.--password.--xl {
  --password-toggle-radius: var(--radius-xl);
}

.--password.--xxl {
  --password-toggle-radius: var(--radius-xxl);
}

.--password.--2xl {
  --password-toggle-radius: var(--radius-2xl);
}

.--password.--3xl {
  --password-toggle-radius: var(--radius-3xl);
}

.--password.--4xl {
  --password-toggle-radius: var(--radius-4xl);
}

.--password.--5xl {
  --password-toggle-radius: var(--radius-5xl);
}

.--password.--6xl {
  --password-toggle-radius: var(--radius-6xl);
}

.--password.--7xl {
  --password-toggle-radius: var(--radius-7xl);
}

.--password.--8xl {
  --password-toggle-radius: var(--radius-8xl);
}

.--password.--9xl {
  --password-toggle-radius: var(--radius-9xl);
}

.--password .--input {
  padding-right: calc(var(--password-toggle-width) + var(--padding-md-x, 8px) + 4px) !important;
}

.--password .--toggle {
  width: var(--password-toggle-width);
  background: var(--password-toggle);
  border: var(--password-toggle-border);
  padding: var(--password-toggle-padding);
  right: 2px;
  bottom: 2px;
  top: 2px;
  z-index: 1;
  border-radius: calc(var(--password-toggle-radius) - 2px);
  opacity: 0.5;
}

.--password .--toggle .b-label {
  line-height: 0 !important;
}

.--password .--toggle svg {
  width: var(--password-toggle-size);
  height: var(--password-toggle-size);
  transition: all 0.2s linear 0s;
}

.--password .--toggle svg path {
  fill: var(--password-toggle-color);
}

.--password .--toggle:hover svg {
  transform: scale(1.1);
}

.--password-meter {
  gap: var(--password-meter-gap);
  margin: var(--password-meter-margin);
}

.--password-meter .--password-bars {
  gap: var(--password-meter-gap);
  flex: 1 1;
}

.--password-meter .--password-bars .--pbar {
  flex: 2 1;
  height: var(--password-meter-bar-height);
  border-radius: var(--password-meter-bar-radius);
  background: var(--gray-300);
}

.--password-meter .--password-meter-label {
  flex: 1 1;
  margin-left: 20px;
  text-align: right;
  font-size: var(--password-meter-label-size);
  font-weight: bold;
}

.--password-meter.--pb-score-0 .--password-meter-label {
  opacity: 0;
}

.--password-meter.--pb-score-1 .--password-bars .--pbar.--pb-on, .--password-meter.--pb-score-2 .--password-bars .--pbar.--pb-on {
  background: var(--red-600);
}

.--password-meter.--pb-score-1 .--password-meter-label, .--password-meter.--pb-score-2 .--password-meter-label {
  color: var(--red-600);
}

.--password-meter.--pb-score-3 .--password-bars .--pbar.--pb-on, .--password-meter.--pb-score-4 .--password-bars .--pbar.--pb-on {
  background: var(--orange-600);
}

.--password-meter.--pb-score-3 .--password-meter-label, .--password-meter.--pb-score-4 .--password-meter-label {
  color: var(--orange-600);
}

.--password-meter.--pb-score-5 .--password-bars .--pbar.--pb-on {
  background: var(--green-600);
}

.--password-meter.--pb-score-5 .--password-meter-label {
  color: var(--green-600);
}

body {
  --phoneinput: var(--surface);
  --phoneinput-border-color: var(--border-primary);
  --phoneinput-border: 1px var(--phoneinput-border-color) solid;
}

.--phone-input {
  border: var(--phoneinput-border);
  --select-current-border-custom: 0px !important;
}

.--phone-input .--input {
  border: 0px !important;
}

.--phone-input .--input::-webkit-outer-spin-button, .--phone-input .--input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.--phone-input .--input {
  appearance: textfield;
}

.--phone-input.--xs {
  border-radius: var(--radius-xs);
  --select-radius-custom: var(--radius-xs) 0px 0px var(--radius-xs);
}

.--phone-input.--sm {
  border-radius: var(--radius-sm);
  --select-radius-custom: var(--radius-sm) 0px 0px var(--radius-sm);
}

.--phone-input.--md {
  border-radius: var(--radius-md);
  --select-radius-custom: var(--radius-md) 0px 0px var(--radius-md);
}

.--phone-input.--lg {
  border-radius: var(--radius-lg);
  --select-radius-custom: var(--radius-lg) 0px 0px var(--radius-lg);
}

.--phone-input.--xl {
  border-radius: var(--radius-xl);
  --select-radius-custom: var(--radius-xl) 0px 0px var(--radius-xl);
}

.--phone-input.--xxl {
  border-radius: var(--radius-xxl);
  --select-radius-custom: var(--radius-xxl) 0px 0px var(--radius-xxl);
}

.--phone-input.--2xl {
  border-radius: var(--radius-2xl);
  --select-radius-custom: var(--radius-2xl) 0px 0px var(--radius-2xl);
}

.--phone-input.--3xl {
  border-radius: var(--radius-3xl);
  --select-radius-custom: var(--radius-3xl) 0px 0px var(--radius-3xl);
}

.--phone-input.--4xl {
  border-radius: var(--radius-4xl);
  --select-radius-custom: var(--radius-4xl) 0px 0px var(--radius-4xl);
}

.--phone-input.--5xl {
  border-radius: var(--radius-5xl);
  --select-radius-custom: var(--radius-5xl) 0px 0px var(--radius-5xl);
}

.--phone-input.--6xl {
  border-radius: var(--radius-6xl);
  --select-radius-custom: var(--radius-6xl) 0px 0px var(--radius-6xl);
}

.--phone-input.--7xl {
  border-radius: var(--radius-7xl);
  --select-radius-custom: var(--radius-7xl) 0px 0px var(--radius-7xl);
}

.--phone-input.--8xl {
  border-radius: var(--radius-8xl);
  --select-radius-custom: var(--radius-8xl) 0px 0px var(--radius-8xl);
}

.--phone-input.--9xl {
  border-radius: var(--radius-9xl);
  --select-radius-custom: var(--radius-9xl) 0px 0px var(--radius-9xl);
}

body {
  --pin-radius: 6px;
  --pin-gap: 4px;
  --pin-shadow: inset 0px 0px 0px 2px #111;
  --pin-padding: var(--padding-md-x);
}

.--otp {
  width: 100%;
  gap: var(--pin-gap);
}

.--otp.--xs {
  --pin-radius: var(--radius-xs);
  --pin-padding: var(--pin-padding-xs, var(--padding-xs-x, var(--padding-md-x)));
}

.--otp.--sm {
  --pin-radius: var(--radius-sm);
  --pin-padding: var(--pin-padding-sm, var(--padding-sm-x, var(--padding-md-x)));
}

.--otp.--md {
  --pin-radius: var(--radius-md);
  --pin-padding: var(--pin-padding-md, var(--padding-md-x, var(--padding-md-x)));
}

.--otp.--lg {
  --pin-radius: var(--radius-lg);
  --pin-padding: var(--pin-padding-lg, var(--padding-lg-x, var(--padding-md-x)));
}

.--otp.--xl {
  --pin-radius: var(--radius-xl);
  --pin-padding: var(--pin-padding-xl, var(--padding-xl-x, var(--padding-md-x)));
}

.--otp.--xxl {
  --pin-radius: var(--radius-xxl);
  --pin-padding: var(--pin-padding-xxl, var(--padding-xxl-x, var(--padding-md-x)));
}

.--otp.--2xl {
  --pin-radius: var(--radius-2xl);
  --pin-padding: var(--pin-padding-2xl, var(--padding-2xl-x, var(--padding-md-x)));
}

.--otp.--3xl {
  --pin-radius: var(--radius-3xl);
  --pin-padding: var(--pin-padding-3xl, var(--padding-3xl-x, var(--padding-md-x)));
}

.--otp.--4xl {
  --pin-radius: var(--radius-4xl);
  --pin-padding: var(--pin-padding-4xl, var(--padding-4xl-x, var(--padding-md-x)));
}

.--otp.--5xl {
  --pin-radius: var(--radius-5xl);
  --pin-padding: var(--pin-padding-5xl, var(--padding-5xl-x, var(--padding-md-x)));
}

.--otp.--6xl {
  --pin-radius: var(--radius-6xl);
  --pin-padding: var(--pin-padding-6xl, var(--padding-6xl-x, var(--padding-md-x)));
}

.--otp.--7xl {
  --pin-radius: var(--radius-7xl);
  --pin-padding: var(--pin-padding-7xl, var(--padding-7xl-x, var(--padding-md-x)));
}

.--otp.--8xl {
  --pin-radius: var(--radius-8xl);
  --pin-padding: var(--pin-padding-8xl, var(--padding-8xl-x, var(--padding-md-x)));
}

.--otp.--9xl {
  --pin-radius: var(--radius-9xl);
  --pin-padding: var(--pin-padding-9xl, var(--padding-9xl-x, var(--padding-md-x)));
}

.--otp .--input {
  text-align: center;
  padding: var(--pin-padding) !important;
  border: var(--pin-input-border, var(--input-border)) !important;
}

.--otp .--input:not(:last-child), .--otp .--input:not(:first-child) {
  border-radius: 0px !important;
}

.--otp .--input:first-child {
  border-radius: var(--pin-radius) 0px 0px var(--pin-radius) !important;
}

.--otp .--input:last-child {
  border-radius: 0px var(--pin-radius) var(--pin-radius) 0px !important;
}

.--otp .--input:focus {
  box-shadow: var(--pin-shadow);
}

:root {
  --progress-width: 100%;
  --progress-height: 6px;
  --progress-radius: 6px;
  --progress-track: #eee;
  --progress-bar: #111;
  --progress-animation: 0.3s var(--ease) 0s;
}

.--progress {
  background: var(--progress-track);
  width: var(--progress-width);
  height: var(--progress-height);
  border-radius: var(--progress-radius);
  overflow: hidden;
}

.--progress .--bar {
  width: 0%;
  background: var(--progress-bar);
  height: var(--progress-height);
  border-radius: var(--progress-radius);
}

.--progress.--animated .--bar {
  transition: width var(--progress-animation);
}

:root {
  --radio-size: 16px;
  --radio: var(--black-900);
  --radio-fill: #fff;
  --radio-border: 1px var(--radio) solid;
  --radio-gap: 5px;
  --radio-padding: 6px;
}

.--radio {
  gap: var(--radio-gap);
  line-height: 1;
}

.--radio input[type=radio] {
  z-index: 0;
  left: 0px;
  top: 0px;
  opacity: 0;
}

.--radio .--dot {
  width: var(--radio-size);
  height: var(--radio-size);
  background: var(--radio-fill);
  border: var(--radio-border);
  border-radius: 50%;
}

.--radio .--dot .--rod {
  width: calc(var(--radio-size) - var(--radio-padding) * 1.5);
  height: calc(var(--radio-size) - var(--radio-padding) * 1.5);
  border-radius: 50%;
}

.--radio .--value {
  flex: 1 1;
}

.--radio input[type=radio]:checked ~ .--dot {
  background: var(--radio);
}

.--radio input[type=radio]:checked ~ .--dot .--rod {
  background: var(--radio-fill);
}

body {
  --scrollbar-track-size: 8px;
  --scrollbar-track: rgba(0, 0, 0, 0);
  --scrollbar-track-hover: rgba(0, 0, 0, 0.1);
  --scrollbar-thumb: rgba(0, 0, 0, 0);
  --scrollbar-thumb-hover: rgba(0, 0, 0, 0.5);
  --scrollbar-thumb-active: rgba(0, 0, 0, 1);
}

[color-scheme=dark] body {
  --scrollbar-thumb-hover: rgba(255,255,255, 0.5);
  --scrollbar-thumb-active: rgba(255,255,255, 1);
}

.--scrollview {
  width: 100%;
  height: 100%;
  overflow: hidden;
  min-height: 0;
}

.--scrollview .--scroll-content {
  width: 100%;
  height: 100%;
  padding: var(--scrollbar-content-padding);
  -webkit-overflow-scrolling: touch;
  min-height: 0;
  min-width: 0;
  scroll-snap-type: none;
  overscroll-behavior: contain;
  overflow: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.--scrollview .--scroll-content::-webkit-scrollbar {
  display: none;
}

.--scrollview .--scroll-inner {
  position: relative;
  display: flow-root;
  box-sizing: border-box;
  width: fit-content;
  min-width: 100%;
  height: fit-content;
  min-height: 100%;
  overflow: clip;
}

.--scrollview.--scrolling .--scroll-track {
  background: var(--scrollbar-track-hover) !important;
}

.--scrollview.--scrolling .--scroll-track .--scroll-thumb {
  background: var(--scrollbar-thumb-hover) !important;
}

.--scrollview.--direction-vertical .--track-x {
  display: none;
}

.--scrollview.--direction-horizontal .--track-y {
  display: none;
}

.--scrollview.--no-y .--scroll-thumb, .--scrollview.--no-x .--scroll-thumb {
  pointer-events: none;
}

.--scrollview:not(.--no-y):hover .--track-y .--scroll-thumb {
  background: var(--scrollbar-thumb-hover);
}

.--scrollview:not(.--no-y) .--track-y:hover {
  background: var(--scrollbar-track-hover);
}

.--scrollview:not(.--no-y) .--track-y .--scroll-thumb {
  cursor: pointer;
}

.--scrollview:not(.--no-x):hover .--track-x .--scroll-thumb {
  background: var(--scrollbar-thumb-hover);
}

.--scrollview:not(.--no-x) .--track-x:hover {
  background: var(--scrollbar-track-hover);
}

.--scrollview:not(.--no-x) .--track-x .--scroll-thumb {
  cursor: pointer;
}

.--scrollview .--scroll-track {
  background: var(--scrollbar-track);
  border-radius: 5px;
  transition: background 0.2s;
  z-index: 999999999;
}

.--scrollview .--scroll-track.--track-y {
  right: 0;
  top: 0;
  width: var(--scrollbar-track-size);
  height: 100%;
}

.--scrollview .--scroll-track.--track-y .--scroll-thumb {
  width: var(--scrollbar-track-size);
  top: 0;
  pointer-events: auto;
  border-radius: var(--scrollbar-thumb-radius, 20px);
}

.--scrollview .--scroll-track.--track-x {
  right: 0;
  bottom: 0;
  height: var(--scrollbar-track-size);
  width: 100%;
}

.--scrollview .--scroll-track.--track-x .--scroll-thumb {
  height: var(--scrollbar-track-size);
  bottom: 0;
  border-radius: var(--scrollbar-thumb-radius, 20px);
}

.--scrollview .--scroll-track .--scroll-thumb {
  background: var(--scrollbar-thumb);
  border-radius: 4px;
  transition: background 0.2s;
}

.--scrollview .--scroll-track .--scroll-thumb:hover {
  opacity: 1;
}

.--scrollview .--scroll-track .--scroll-thumb:active {
  cursor: grabbing;
  background: var(--scrollbar-thumb-active);
  opacity: 1;
}

body {
  --search-color: var(--surface);
  --search-send-color: var(--text-primary);
  --search-send-bg: transparent;
  --search-send-border: 0px;
  --search-send-size-xs: 14px;
  --search-send-size-sm: 16px;
  --search-send-size-md: 20px;
  --search-send-size-lg: 24px;
  --search-send-size-xl: 30px;
  --search-send-size-xxl: 36px;
  --search-border-color: var(--border-primary);
  --search-border: 1px var(--search-border-color) solid;
}

.--search {
  width: 100%;
  overflow: hidden;
  background: var(--search-color);
  border-radius: var(--search-radius);
  border: var(--search-border);
}

.--search:focus-within {
  box-shadow: 0px 0px 0px 1px var(--input-border-focus);
}

.--search .--input {
  background: rgba(0, 0, 0, 0) !important;
  color: var(--search-send-color);
  border: 0px !important;
}

.--search .--input:focus {
  box-shadow: none !important;
}

.--search .--send {
  color: var(--search-send-color) !important;
}

.--search .--send svg {
  fill: var(--search-send-color) !important;
}

.--search .--send .--send-wrap {
  padding: var(--search-send-wrapper);
}

.--search .--search-action {
  --icon-color-1: var(--text-primary);
  --icon-color-2: rgb(from var(--icon-color-1) r g b / var(--icon-alpha, 0.5));
  color: var(--search-send-color);
  font-size: 1rem;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.--search.--xs {
  --search-radius: var(--search-radius-custom, var(--radius-xs));
}

.--search.--xs .--send {
  flex-shrink: 0;
  width: calc(var(--search-send-size-xs, var(--search-send-size-md)) + var(--padding-xs-x, var(--padding-md-x)) * 2);
  height: 100%;
  background: rgba(0, 0, 0, 0);
  padding: 0px !important;
}

.--search.--xs .--send svg {
  width: var(--search-send-size-xs, var(--search-send-size-md));
  height: var(--search-send-size-xs, var(--search-send-size-md));
  display: block;
}

.--search.--xs .--keyboard-keys {
  right: var(--padding-xs-x);
}

.--search.--sm {
  --search-radius: var(--search-radius-custom, var(--radius-sm));
}

.--search.--sm .--send {
  flex-shrink: 0;
  width: calc(var(--search-send-size-sm, var(--search-send-size-md)) + var(--padding-sm-x, var(--padding-md-x)) * 2);
  height: 100%;
  background: rgba(0, 0, 0, 0);
  padding: 0px !important;
}

.--search.--sm .--send svg {
  width: var(--search-send-size-sm, var(--search-send-size-md));
  height: var(--search-send-size-sm, var(--search-send-size-md));
  display: block;
}

.--search.--sm .--keyboard-keys {
  right: var(--padding-sm-x);
}

.--search.--md {
  --search-radius: var(--search-radius-custom, var(--radius-md));
}

.--search.--md .--send {
  flex-shrink: 0;
  width: calc(var(--search-send-size-md, var(--search-send-size-md)) + var(--padding-md-x, var(--padding-md-x)) * 2);
  height: 100%;
  background: rgba(0, 0, 0, 0);
  padding: 0px !important;
}

.--search.--md .--send svg {
  width: var(--search-send-size-md, var(--search-send-size-md));
  height: var(--search-send-size-md, var(--search-send-size-md));
  display: block;
}

.--search.--md .--keyboard-keys {
  right: var(--padding-md-x);
}

.--search.--lg {
  --search-radius: var(--search-radius-custom, var(--radius-lg));
}

.--search.--lg .--send {
  flex-shrink: 0;
  width: calc(var(--search-send-size-lg, var(--search-send-size-md)) + var(--padding-lg-x, var(--padding-md-x)) * 2);
  height: 100%;
  background: rgba(0, 0, 0, 0);
  padding: 0px !important;
}

.--search.--lg .--send svg {
  width: var(--search-send-size-lg, var(--search-send-size-md));
  height: var(--search-send-size-lg, var(--search-send-size-md));
  display: block;
}

.--search.--lg .--keyboard-keys {
  right: var(--padding-lg-x);
}

.--search.--xl {
  --search-radius: var(--search-radius-custom, var(--radius-xl));
}

.--search.--xl .--send {
  flex-shrink: 0;
  width: calc(var(--search-send-size-xl, var(--search-send-size-md)) + var(--padding-xl-x, var(--padding-md-x)) * 2);
  height: 100%;
  background: rgba(0, 0, 0, 0);
  padding: 0px !important;
}

.--search.--xl .--send svg {
  width: var(--search-send-size-xl, var(--search-send-size-md));
  height: var(--search-send-size-xl, var(--search-send-size-md));
  display: block;
}

.--search.--xl .--keyboard-keys {
  right: var(--padding-xl-x);
}

.--search.--xxl {
  --search-radius: var(--search-radius-custom, var(--radius-xxl));
}

.--search.--xxl .--send {
  flex-shrink: 0;
  width: calc(var(--search-send-size-xxl, var(--search-send-size-md)) + var(--padding-xxl-x, var(--padding-md-x)) * 2);
  height: 100%;
  background: rgba(0, 0, 0, 0);
  padding: 0px !important;
}

.--search.--xxl .--send svg {
  width: var(--search-send-size-xxl, var(--search-send-size-md));
  height: var(--search-send-size-xxl, var(--search-send-size-md));
  display: block;
}

.--search.--xxl .--keyboard-keys {
  right: var(--padding-xxl-x);
}

.--search.--2xl {
  --search-radius: var(--search-radius-custom, var(--radius-2xl));
}

.--search.--2xl .--send {
  flex-shrink: 0;
  width: calc(var(--search-send-size-2xl, var(--search-send-size-md)) + var(--padding-2xl-x, var(--padding-md-x)) * 2);
  height: 100%;
  background: rgba(0, 0, 0, 0);
  padding: 0px !important;
}

.--search.--2xl .--send svg {
  width: var(--search-send-size-2xl, var(--search-send-size-md));
  height: var(--search-send-size-2xl, var(--search-send-size-md));
  display: block;
}

.--search.--2xl .--keyboard-keys {
  right: var(--padding-2xl-x);
}

.--search.--3xl {
  --search-radius: var(--search-radius-custom, var(--radius-3xl));
}

.--search.--3xl .--send {
  flex-shrink: 0;
  width: calc(var(--search-send-size-3xl, var(--search-send-size-md)) + var(--padding-3xl-x, var(--padding-md-x)) * 2);
  height: 100%;
  background: rgba(0, 0, 0, 0);
  padding: 0px !important;
}

.--search.--3xl .--send svg {
  width: var(--search-send-size-3xl, var(--search-send-size-md));
  height: var(--search-send-size-3xl, var(--search-send-size-md));
  display: block;
}

.--search.--3xl .--keyboard-keys {
  right: var(--padding-3xl-x);
}

.--search.--4xl {
  --search-radius: var(--search-radius-custom, var(--radius-4xl));
}

.--search.--4xl .--send {
  flex-shrink: 0;
  width: calc(var(--search-send-size-4xl, var(--search-send-size-md)) + var(--padding-4xl-x, var(--padding-md-x)) * 2);
  height: 100%;
  background: rgba(0, 0, 0, 0);
  padding: 0px !important;
}

.--search.--4xl .--send svg {
  width: var(--search-send-size-4xl, var(--search-send-size-md));
  height: var(--search-send-size-4xl, var(--search-send-size-md));
  display: block;
}

.--search.--4xl .--keyboard-keys {
  right: var(--padding-4xl-x);
}

.--search.--5xl {
  --search-radius: var(--search-radius-custom, var(--radius-5xl));
}

.--search.--5xl .--send {
  flex-shrink: 0;
  width: calc(var(--search-send-size-5xl, var(--search-send-size-md)) + var(--padding-5xl-x, var(--padding-md-x)) * 2);
  height: 100%;
  background: rgba(0, 0, 0, 0);
  padding: 0px !important;
}

.--search.--5xl .--send svg {
  width: var(--search-send-size-5xl, var(--search-send-size-md));
  height: var(--search-send-size-5xl, var(--search-send-size-md));
  display: block;
}

.--search.--5xl .--keyboard-keys {
  right: var(--padding-5xl-x);
}

.--search.--6xl {
  --search-radius: var(--search-radius-custom, var(--radius-6xl));
}

.--search.--6xl .--send {
  flex-shrink: 0;
  width: calc(var(--search-send-size-6xl, var(--search-send-size-md)) + var(--padding-6xl-x, var(--padding-md-x)) * 2);
  height: 100%;
  background: rgba(0, 0, 0, 0);
  padding: 0px !important;
}

.--search.--6xl .--send svg {
  width: var(--search-send-size-6xl, var(--search-send-size-md));
  height: var(--search-send-size-6xl, var(--search-send-size-md));
  display: block;
}

.--search.--6xl .--keyboard-keys {
  right: var(--padding-6xl-x);
}

.--search.--7xl {
  --search-radius: var(--search-radius-custom, var(--radius-7xl));
}

.--search.--7xl .--send {
  flex-shrink: 0;
  width: calc(var(--search-send-size-7xl, var(--search-send-size-md)) + var(--padding-7xl-x, var(--padding-md-x)) * 2);
  height: 100%;
  background: rgba(0, 0, 0, 0);
  padding: 0px !important;
}

.--search.--7xl .--send svg {
  width: var(--search-send-size-7xl, var(--search-send-size-md));
  height: var(--search-send-size-7xl, var(--search-send-size-md));
  display: block;
}

.--search.--7xl .--keyboard-keys {
  right: var(--padding-7xl-x);
}

.--search.--8xl {
  --search-radius: var(--search-radius-custom, var(--radius-8xl));
}

.--search.--8xl .--send {
  flex-shrink: 0;
  width: calc(var(--search-send-size-8xl, var(--search-send-size-md)) + var(--padding-8xl-x, var(--padding-md-x)) * 2);
  height: 100%;
  background: rgba(0, 0, 0, 0);
  padding: 0px !important;
}

.--search.--8xl .--send svg {
  width: var(--search-send-size-8xl, var(--search-send-size-md));
  height: var(--search-send-size-8xl, var(--search-send-size-md));
  display: block;
}

.--search.--8xl .--keyboard-keys {
  right: var(--padding-8xl-x);
}

.--search.--9xl {
  --search-radius: var(--search-radius-custom, var(--radius-9xl));
}

.--search.--9xl .--send {
  flex-shrink: 0;
  width: calc(var(--search-send-size-9xl, var(--search-send-size-md)) + var(--padding-9xl-x, var(--padding-md-x)) * 2);
  height: 100%;
  background: rgba(0, 0, 0, 0);
  padding: 0px !important;
}

.--search.--9xl .--send svg {
  width: var(--search-send-size-9xl, var(--search-send-size-md));
  height: var(--search-send-size-9xl, var(--search-send-size-md));
  display: block;
}

.--search.--9xl .--keyboard-keys {
  right: var(--padding-9xl-x);
}

body {
  --segmented: #eee;
  --segmented-gap: 0px;
  --segmented-border: 1px #ddd solid;
  --segment-item: transparent;
  --segment-item-border: 0px;
  --segment-item-font-weight: normal;
  --segment-item-color: #999;
  --segment-item-hover-color: #777;
  --segment-item-active-color: #111;
  --segment-tab: #fff;
  --segment-tab-border: 0px;
  --segment-tab-bottom: 0px;
  --segment-tab-radius: calc(var(--segmented-radius) - var(--segmented-padding));
  --segmented-speed: 0.5s;
  --segmented-radius-sm: 8px;
  --segmented-padding-sm: 2px;
  --segment-item-gap-sm: 6px;
  --segmented-radius-md: 8px;
  --segmented-padding-md: 2px;
  --segment-item-gap-md: 8px;
  --segmented-radius-lg: 8px;
  --segmented-padding-lg: 2px;
  --segment-item-gap-lg: 10px;
  --segment-item-padding-sm: 5px 12px;
  --segment-item-font-size-sm: 15px;
  --segment-item-radius-sm: calc(var(--segmented-radius-sm) - var(--segmented-padding-sm));
  --segment-item-svg-size-sm: 18px;
  --segment-item-padding-md: 5px 12px;
  --segment-item-font-size-md: 15px;
  --segment-item-radius-md: calc(var(--segmented-radius-md) - var(--segmented-padding-md));
  --segment-item-svg-size-md: 18px;
  --segment-item-padding-lg: 5px 12px;
  --segment-item-font-size-lg: 15px;
  --segment-item-radius-lg: calc(var(--segmented-radius-lg) - var(--segmented-padding-lg));
  --segment-item-svg-size-lg: 18px;
}

.--segmented {
  background: var(--segmented);
  border: var(--segmented-border);
  overflow: hidden;
  gap: var(--segmented-gap, 0px);
}

.--segmented .--segment-tab {
  bottom: var(--segment-tab-bottom);
  border: var(--segment-tab-border);
}

.--segmented.--sm {
  border-radius: var(--segmented-radius-sm);
  padding: var(--segmented-padding-sm);
}

.--segmented.--sm .--segment-item {
  padding: var(--segment-item-padding-sm);
  font-size: var(--segment-item-font-size-sm);
  border-radius: var(--segment-item-radius-sm);
  gap: var(--segment-item-gap-sm);
}

.--segmented.--sm .--segment-item svg {
  width: var(--segment-item-svg-size-sm);
}

.--segmented.--sm .--segment-tab {
  border-radius: calc(var(--segmented-radius-sm) - var(--segmented-padding-sm));
  transform: translateX(calc(var(--x) - var(--segmented-padding-sm)));
  top: var(--segmented-padding-sm);
}

.--segmented.--md {
  border-radius: var(--segmented-radius-md);
  padding: var(--segmented-padding-md);
}

.--segmented.--md .--segment-item {
  padding: var(--segment-item-padding-md);
  font-size: var(--segment-item-font-size-md);
  border-radius: var(--segment-item-radius-md);
  gap: var(--segment-item-gap-md);
}

.--segmented.--md .--segment-item svg {
  width: var(--segment-item-svg-size-md);
}

.--segmented.--md .--segment-tab {
  border-radius: calc(var(--segmented-radius-md) - var(--segmented-padding-md));
  transform: translateX(calc(var(--x) - var(--segmented-padding-md)));
  top: var(--segmented-padding-md);
}

.--segmented.--lg {
  border-radius: var(--segmented-radius-lg);
  padding: var(--segmented-padding-lg);
}

.--segmented.--lg .--segment-item {
  padding: var(--segment-item-padding-lg);
  font-size: var(--segment-item-font-size-lg);
  border-radius: var(--segment-item-radius-lg);
  gap: var(--segment-item-gap-lg);
}

.--segmented.--lg .--segment-item svg {
  width: var(--segment-item-svg-size-lg);
}

.--segmented.--lg .--segment-tab {
  border-radius: calc(var(--segmented-radius-lg) - var(--segmented-padding-lg));
  transform: translateX(calc(var(--x) - var(--segmented-padding-lg)));
  top: var(--segmented-padding-lg);
}

.--segmented .--segment-item {
  background: var(--segment-item);
  border: var(--segment-item-border);
  color: var(--segment-item-color);
  font-weight: var(--segment-item-font-weight);
  z-index: 1;
  flex: 1 1;
}

.--segmented .--segment-item:disabled {
  background: rgba(0, 0, 0, 0) !important;
}

.--segmented .--segment-item:hover:not(:disabled) {
  color: var(--segment-item-hover-color);
}

.--segmented .--segment-item .--segment-label {
  white-space: pre;
  transition: all var(--segmented-speed) var(--ease) 0s;
}

.--segmented .--segment-item svg react {
  fill: var(--segment-item-color);
}

.--segmented .--segment-item svg path {
  fill: var(--segment-item-color);
}

.--segmented .--segment-item svg {
  fill: var(--segment-item-color);
}

.--segmented .--segment-item.--segment-active:not(:disabled) {
  color: var(--segment-item-active-color);
}

.--segmented .--segment-item.--segment-active svg react {
  fill: var(--segment-item-active-color);
}

.--segmented .--segment-item.--segment-active svg path {
  fill: var(--segment-item-active-color);
}

.--segmented .--segment-item.--segment-active svg {
  fill: var(--segment-item-active-color);
}

.--segmented .--segment-tab:not(.--disabled) {
  background: var(--segment-tab);
}

.--segmented .--segment-tab {
  width: var(--w);
  z-index: 0;
  transition: all var(--segmented-speed) var(--ease) 0s;
}

body {
  --select: var(--surface);
  --select-border-color: var(--border-primary);
  --select-border: 1px var(--select-border-color) solid;
  --select-current-bg: var(--select);
  --select-current-hover: var(--select-hover);
  --select-current-border: var(--select-border);
  --select-current-color: var(--select-option-color);
  --select-current-disabled-bg: var(--select);
  --select-current-disabled-color: var(--select-option-color-disabled);
  --select-current-disabled-border: var(--select-border);
  --select-z-index: 1;
  --select-gap: 5px;
  --select-arrow-width: 16px;
  --select-arrow-size: 16px;
  --select-arrow-color: var(--text-primary);
  --select-hover: var(--surface-hover);
  --select-options: var(--surface);
  --select-options-max-height: 400px;
  --select-options-top: 0.1rem;
  --select-options-padding: 4px;
  --select-option-color-disabled: var(--text-primary-disabled);
  --select-option-color: var(--text-primary);
  --select-option-hover: var(--background);
  --select-option-radius: var(--select-radius);
  --select-selected: var(--background);
  --select-shadow: inherit;
  --select-search: #fff;
  --select-search-border: 1px #ddd solid;
  --select-search-padding: 4px 8px;
  --select-search-radius: 10px;
  --select-search-font-size: 15px;
  --select-search-color: var(--text-primary);
  --select-search-margin-bottom: 4px;
  --select-option-gap: 8px;
  --select-token-padding-xs: 1px 1px 1px 5px;
  --select-token-padding-sm: 1px 1px 1px 5px;
  --select-token-padding-md: 1px 1px 1px 5px;
  --select-token-padding-lg: 1px 1px 1px 5px;
  --select-token-padding-xl: 1px 1px 1px 5px;
  --select-token-padding-xxl: 1px 1px 1px 5px;
  --select-token-remove-size-xs: 14px;
  --select-token-remove-size-sm: 14px;
  --select-token-remove-size-md: 14px;
  --select-token-remove-size-lg: 14px;
  --select-token-remove-size-xl: 14px;
  --select-token-remove-size-xxl: 14px;
  --select-token-label-size-xs: 10px;
  --select-token-label-size-sm: 12px;
  --select-token-label-size-md: 13px;
  --select-token-label-size-lg: 14px;
  --select-token-label-size-xl: 15px;
  --select-token-label-size-xxl: 16px;
  --select-token: var(--select-token-custom, var(--background));
  --select-token-remove: var(--select-token-remove-custom, var(--select-arrow-color));
  --select-token-remove-hover: var(--select-token-remove-hover-custom, #bbb);
  --select-token-hover: var(--select-token-hover-custom, #bbb);
}

.--select:not(.--expanded) {
  width: fit-content;
}

.--select .--select-display.--selected {
  width: 100%;
  gap: var(--select-gap-custom, var(--select-gap));
  background: var(--select-current-bg-custom, var(--select-current-bg));
  border: var(--select-current-border-custom, var(--select-current-border));
  box-shadow: var(--select-shadow-custom, var(--select-shadow));
  color: var(--select-current-color-custom, var(--select-current-color));
  line-height: 1;
  justify-content: flex-start !important;
}

.--select .--select-display.--selected.--solid {
  --select-current-bg: var(--select);
  --select-current-hover: var(--select-hover);
  --select-current-border: var(--select-border);
  --select-current-color: var(--text-primary);
  --select-current-disabled-bg: var(--select-current-disabled-bg);
  --select-current-disabled-color: var(--select-current-disabled-color);
  --select-current-disabled-border: var(--select-border);
}

.--select .--select-display.--selected.--subtle {
  --select-current-bg: var(--surface-hover);
  --select-current-hover: var(--surface);
  --select-current-border: 1px solid var(--surface-hover);
  --select-current-color: var(--text-primary);
  --select-current-disabled-bg: var(--button-disabled);
  --select-current-disabled-color: var(--button-disabled-color);
  --select-current-disabled-border: 1px solid var(--button-disabled);
}

.--select .--select-display.--selected.--surface {
  --select-current-bg: var(--surface);
  --select-current-hover: var(--surface-hover);
  --select-current-border: 1px solid var(--border-primary);
  --select-current-color: var(--text-primary);
  --select-current-disabled-bg: var(--button-disabled);
  --select-current-disabled-color: var(--button-disabled-color);
  --select-current-disabled-border: 1px solid var(--button-disabled);
}

.--select .--select-display.--selected.--outline {
  --select-current-bg: transparent;
  --select-current-hover: var(--surface-hover);
  --select-current-border: 1px solid var(--border-primary);
  --select-current-color: var(--text-primary);
  --select-current-disabled-bg: transparent;
  --select-current-disabled-color: var(--button-disabled-color);
  --select-current-disabled-border: 1px solid var(--button-disabled-color);
}

.--select .--select-display.--selected.--ghost {
  --select-current-bg: transparent;
  --select-current-hover: var(--button-ghost-hover);
  --select-current-border: 1px solid transparent;
  --select-current-color: var(--text-primary);
  --select-current-disabled-bg: transparent;
  --select-current-disabled-color: var(--button-disabled-color);
  --select-current-disabled-border: 1px solid transparent;
}

.--select .--select-display.--selected.--plain {
  --select-current-bg: transparent;
  --select-current-hover: transparent;
  --select-current-border: 0px;
  --select-current-color: var(--text-primary);
  --select-current-disabled-bg: transparent;
  --select-current-disabled-color: var(--button-disabled-color);
  --select-current-disabled-border: 0px;
}

.--select .--select-display.--selected .--svg-arrow {
  color: var(--select-current-color);
}

.--select .--select-display.--selected .--svg-arrow .--icon {
  font-size: var(--select-arrow-size);
}

.--select .--select-display.--selected:disabled .--label {
  color: var(--select-current-disabled-color);
}

.--select .--select-display.--selected:disabled .--selected-icon {
  color: var(--select-current-disabled-color);
}

.--select .--select-display.--selected:disabled .--select-input {
  color: var(--select-current-disabled-color);
}

.--select .--select-display.--selected:disabled .--svg-arrow svg {
  fill: var(--select-current-disabled-color);
}

.--select .--select-display.--selected:disabled:hover {
  background: var(--select-current-disabled-bg);
}

.--select .--select-display.--selected:disabled {
  background: var(--select-current-disabled-bg);
  border: var(--select-current-disabled-border);
}

.--select .--select-display.--selected:hover {
  background: var(--select-current-hover);
}

.--select .--select-display.--selected .--selected-icon {
  color: var(--select-current-color);
}

.--select .--select-display.--selected .--label-wrapper, .--select .--select-display.--selected .--label {
  flex: 1 1;
  text-align: left;
  color: var(--select-current-color);
}

.--select .--select-display.--selected .--svg-arrow {
  width: var(--select-arrow-width);
}

.--select .--select-display.--selected .--svg-arrow svg {
  fill: var(--select-current-color);
}

.--select .--select-display.--selected.--editable .--label-wrapper {
  min-width: 0;
  flex-wrap: wrap;
  gap: 4px;
}

.--select .--select-display.--selected.--editable .--label-wrapper.--has-tags .--select-input {
  flex: 1 1;
  min-width: 60px !important;
}

.--select .--select-display.--selected.--editable .--select-input {
  width: 100%;
  min-width: 0;
  background: rgba(0, 0, 0, 0);
  border: 0;
  color: var(--select-current-color);
  font: inherit;
  outline: none;
  padding: 0;
}

.--select .--select-display.--selected.--editable .--select-input::placeholder {
  color: var(--select-option-color-disabled);
}

.--select .--select-display.--selected.--editable .--select-toggle {
  background: rgba(0, 0, 0, 0) !important;
  border: 0 !important;
  box-shadow: none !important;
  min-height: auto !important;
  min-width: var(--select-arrow-width) !important;
  padding: 0 !important;
}

.--select .--select-display.--selected.--editable .--select-toggle svg {
  fill: var(--select-arrow-color);
  font-size: var(--select-arrow-size);
}

.--select .--select-display.--selected.--editable .--select-toggle:hover {
  background: rgba(0, 0, 0, 0) !important;
}

.--select .--select-display.--selected .--tokens-wrap {
  gap: 4px;
}

.--select .--select-display.--selected .--tokens-wrap .--token {
  background: var(--select-token);
  gap: 2px;
  overflow: hidden;
}

.--select .--select-display.--selected .--tokens-wrap .--token:hover {
  background: var(--select-token-hover);
}

.--select .--select-display.--selected .--tokens-wrap .--token .--token-remove {
  aspect-ratio: 1/1;
  line-height: 0;
}

.--select .--select-display.--selected .--tokens-wrap .--token .--token-remove svg {
  fill: var(--select-token-remove);
}

.--select .--select-display.--selected .--tokens-wrap .--token .--token-remove:hover {
  background: var(--select-token-remove-hover);
}

.--options-list, .--select-options-list {
  -webkit-backdrop-filter: blur(10px) saturate(0);
          backdrop-filter: blur(10px) saturate(0);
  left: 0;
  top: calc(100% + var(--select-options-top));
  width: fit-content;
  min-width: anchor-size(width);
  max-height: var(--select-options-max-height);
  overflow-x: hidden;
  overflow-y: auto;
  touch-action: pan-y;
  gap: 2px;
  background: var(--select-options);
  box-shadow: var(--select-options-shadow);
  z-index: var(--max-z-index);
  scrollbar-color: var(--scrollbar-color);
  overscroll-behavior-y: contain;
  border: var(--select-border);
}

.--options-list .--select-search, .--select-options-list .--select-search {
  margin-bottom: var(--select-search-margin-bottom);
  top: 0px;
  z-index: 3;
}

.--options-list .--select-search .--input, .--select-options-list .--select-search .--input {
  background: var(--select-search);
  border: var(--select-search-border);
  padding: var(--select-search-padding);
  border-radius: var(--select-search-radius);
  font-size: var(--select-search-font-size);
  color: var(--select-search-color);
}

.--options-list .--select-options-head, .--select-options-list .--select-options-head {
  opacity: 0.5;
}

.--options-list button.--select-option-item, .--select-options-list button.--select-option-item {
  --select-option-indent: 0px;
  background: rgba(0, 0, 0, 0);
  border: 0px;
  text-align: left;
  color: var(--select-option-color);
  font-size: var(--select-text-size);
  white-space: pre;
  text-align: left !important;
  justify-content: flex-start;
  gap: var(--select-option-gap);
  width: auto;
  overflow: hidden;
  padding-inline-start: calc(var(--padding-md-x) + var(--select-option-indent)) !important;
  --icon-color-1: var(--select-option-color);
  --icon-color-2: rgb(from var(--icon-color-1) r g b / var(--icon-alpha, 0.5));
}

.--options-list button.--select-option-item:disabled, .--select-options-list button.--select-option-item:disabled {
  color: var(--text-primary-disabled);
}

.--options-list button.--select-option-item:disabled:hover, .--select-options-list button.--select-option-item:disabled:hover {
  background: rgba(0, 0, 0, 0);
}

.--options-list button.--select-option-item:disabled .--select-option-check svg, .--select-options-list button.--select-option-item:disabled .--select-option-check svg {
  opacity: 0.5;
}

.--options-list button.--select-option-item:hover, .--select-options-list button.--select-option-item:hover {
  background: var(--select-option-hover);
}

.--options-list button.--select-option-item.--selected, .--select-options-list button.--select-option-item.--selected {
  background: var(--select-selected);
}

.--options-list button.--select-option-item.--selected .--select-option-check, .--select-options-list button.--select-option-item.--selected .--select-option-check {
  background: var(--select-selected);
}

.--options-list button.--select-option-item .--option-item-meta, .--select-options-list button.--select-option-item .--option-item-meta {
  gap: 8px;
  flex: 1 1;
}

.--options-list button.--select-option-item .--option-item-meta.--is-parent, .--select-options-list button.--select-option-item .--option-item-meta.--is-parent {
  font-weight: 600;
}

.--options-list button.--select-option-item .--option-item-meta .--subtree-toggle, .--select-options-list button.--select-option-item .--option-item-meta .--subtree-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px !important;
  min-height: 18px !important;
  padding: 0 !important;
  border: 0 !important;
  background: rgba(0, 0, 0, 0) !important;
  opacity: 0.8;
  cursor: pointer;
}

.--options-list button.--select-option-item .--option-item-meta .--subtree-toggle svg, .--select-options-list button.--select-option-item .--option-item-meta .--subtree-toggle svg {
  fill: currentColor;
  width: 14px;
  height: 14px;
}

.--options-list button.--select-option-item .--option-item-meta .--subtree-toggle:hover, .--select-options-list button.--select-option-item .--option-item-meta .--subtree-toggle:hover {
  opacity: 1;
}

.--options-list button.--select-option-item .--option-item-meta .--subtree-toggle:disabled, .--select-options-list button.--select-option-item .--option-item-meta .--subtree-toggle:disabled {
  opacity: 0.5;
  cursor: default;
}

.--options-list button.--select-option-item .--option-item-meta .--subtree-toggle[aria-disabled=true], .--select-options-list button.--select-option-item .--option-item-meta .--subtree-toggle[aria-disabled=true] {
  opacity: 0.5;
  cursor: default;
}

.--options-list button.--select-option-item .--select-option-check, .--select-options-list button.--select-option-item .--select-option-check {
  padding: 4px;
  aspect-ratio: 1/1;
  background: var(--select-options);
  min-height: 24px;
  min-width: 24px;
}

.--options-list button.--select-option-item .--select-option-check svg, .--select-options-list button.--select-option-item .--select-option-check svg {
  fill: var(--text-primary);
}

.--select.--xs {
  --select-radius: var(--select-radius-custom, var(--radius-xs));
}

.--select.--xs .--select-display.--selected {
  padding: var(--padding-xs);
  border-radius: var(--select-radius-custom, var(--radius-xs));
  font-size: var(--text-xs);
  line-height: var(--lh-xs, 1.4);
  min-height: var(--select-control-height-xs, var(--control-height-xs));
  height: var(--select-control-height-xs, var(--control-height-xs));
}

.--select.--xs .--tokens-wrap .--token {
  padding: var(--select-token-padding-xs) !important;
  border-radius: var(--radius-xs) !important;
}

.--select.--xs .--tokens-wrap .--token .--token-label {
  font-size: var(--select-token-label-size-xs);
}

.--select.--xs .--tokens-wrap .--token .--token-remove {
  width: var(--select-token-remove-size-xs);
}

.--options-list.--xs, .--select-options-list.--xs {
  padding: var(--padding-xs-x);
  border-radius: calc(var(--radius-xs) / 3);
}

.--options-list.--xs .--select-options-head, .--select-options-list.--xs .--select-options-head {
  font-size: var(--text-xs) !important;
  padding: var(--padding-xs-x);
}

.--options-list.--xs button.--select-option-item, .--select-options-list.--xs button.--select-option-item {
  padding: calc(var(--padding-md-x) / 2) !important;
  padding-left: calc(var(--padding-md-x) + var(--select-option-indent)) !important;
  border-radius: var(--radius-xs) !important;
}

.--select.--sm {
  --select-radius: var(--select-radius-custom, var(--radius-sm));
}

.--select.--sm .--select-display.--selected {
  padding: var(--padding-sm);
  border-radius: var(--select-radius-custom, var(--radius-sm));
  font-size: var(--text-sm);
  line-height: var(--lh-sm, 1.4);
  min-height: var(--select-control-height-sm, var(--control-height-sm));
  height: var(--select-control-height-sm, var(--control-height-sm));
}

.--select.--sm .--tokens-wrap .--token {
  padding: var(--select-token-padding-sm) !important;
  border-radius: var(--radius-sm) !important;
}

.--select.--sm .--tokens-wrap .--token .--token-label {
  font-size: var(--select-token-label-size-sm);
}

.--select.--sm .--tokens-wrap .--token .--token-remove {
  width: var(--select-token-remove-size-sm);
}

.--options-list.--sm, .--select-options-list.--sm {
  padding: var(--padding-sm-x);
  border-radius: calc(var(--radius-sm) / 3);
}

.--options-list.--sm .--select-options-head, .--select-options-list.--sm .--select-options-head {
  font-size: var(--text-sm) !important;
  padding: var(--padding-sm-x);
}

.--options-list.--sm button.--select-option-item, .--select-options-list.--sm button.--select-option-item {
  padding: calc(var(--padding-md-x) / 2) !important;
  padding-left: calc(var(--padding-md-x) + var(--select-option-indent)) !important;
  border-radius: var(--radius-sm) !important;
}

.--select.--md {
  --select-radius: var(--select-radius-custom, var(--radius-md));
}

.--select.--md .--select-display.--selected {
  padding: var(--padding-md);
  border-radius: var(--select-radius-custom, var(--radius-md));
  font-size: var(--text-md);
  line-height: var(--lh-md, 1.4);
  min-height: var(--select-control-height-md, var(--control-height-md));
  height: var(--select-control-height-md, var(--control-height-md));
}

.--select.--md .--tokens-wrap .--token {
  padding: var(--select-token-padding-md) !important;
  border-radius: var(--radius-md) !important;
}

.--select.--md .--tokens-wrap .--token .--token-label {
  font-size: var(--select-token-label-size-md);
}

.--select.--md .--tokens-wrap .--token .--token-remove {
  width: var(--select-token-remove-size-md);
}

.--options-list.--md, .--select-options-list.--md {
  padding: var(--padding-md-x);
  border-radius: calc(var(--radius-md) / 3);
}

.--options-list.--md .--select-options-head, .--select-options-list.--md .--select-options-head {
  font-size: var(--text-md) !important;
  padding: var(--padding-md-x);
}

.--options-list.--md button.--select-option-item, .--select-options-list.--md button.--select-option-item {
  padding: calc(var(--padding-md-x) / 2) !important;
  padding-left: calc(var(--padding-md-x) + var(--select-option-indent)) !important;
  border-radius: var(--radius-md) !important;
}

.--select.--lg {
  --select-radius: var(--select-radius-custom, var(--radius-lg));
}

.--select.--lg .--select-display.--selected {
  padding: var(--padding-lg);
  border-radius: var(--select-radius-custom, var(--radius-lg));
  font-size: var(--text-lg);
  line-height: var(--lh-lg, 1.4);
  min-height: var(--select-control-height-lg, var(--control-height-lg));
  height: var(--select-control-height-lg, var(--control-height-lg));
}

.--select.--lg .--tokens-wrap .--token {
  padding: var(--select-token-padding-lg) !important;
  border-radius: var(--radius-lg) !important;
}

.--select.--lg .--tokens-wrap .--token .--token-label {
  font-size: var(--select-token-label-size-lg);
}

.--select.--lg .--tokens-wrap .--token .--token-remove {
  width: var(--select-token-remove-size-lg);
}

.--options-list.--lg, .--select-options-list.--lg {
  padding: var(--padding-lg-x);
  border-radius: calc(var(--radius-lg) / 3);
}

.--options-list.--lg .--select-options-head, .--select-options-list.--lg .--select-options-head {
  font-size: var(--text-lg) !important;
  padding: var(--padding-lg-x);
}

.--options-list.--lg button.--select-option-item, .--select-options-list.--lg button.--select-option-item {
  padding: calc(var(--padding-md-x) / 2) !important;
  padding-left: calc(var(--padding-md-x) + var(--select-option-indent)) !important;
  border-radius: var(--radius-lg) !important;
}

.--select.--xl {
  --select-radius: var(--select-radius-custom, var(--radius-xl));
}

.--select.--xl .--select-display.--selected {
  padding: var(--padding-xl);
  border-radius: var(--select-radius-custom, var(--radius-xl));
  font-size: var(--text-xl);
  line-height: var(--lh-xl, 1.4);
  min-height: var(--select-control-height-xl, var(--control-height-xl));
  height: var(--select-control-height-xl, var(--control-height-xl));
}

.--select.--xl .--tokens-wrap .--token {
  padding: var(--select-token-padding-xl) !important;
  border-radius: var(--radius-xl) !important;
}

.--select.--xl .--tokens-wrap .--token .--token-label {
  font-size: var(--select-token-label-size-xl);
}

.--select.--xl .--tokens-wrap .--token .--token-remove {
  width: var(--select-token-remove-size-xl);
}

.--options-list.--xl, .--select-options-list.--xl {
  padding: var(--padding-xl-x);
  border-radius: calc(var(--radius-xl) / 3);
}

.--options-list.--xl .--select-options-head, .--select-options-list.--xl .--select-options-head {
  font-size: var(--text-xl) !important;
  padding: var(--padding-xl-x);
}

.--options-list.--xl button.--select-option-item, .--select-options-list.--xl button.--select-option-item {
  padding: calc(var(--padding-md-x) / 2) !important;
  padding-left: calc(var(--padding-md-x) + var(--select-option-indent)) !important;
  border-radius: var(--radius-xl) !important;
}

.--select.--xxl {
  --select-radius: var(--select-radius-custom, var(--radius-xxl));
}

.--select.--xxl .--select-display.--selected {
  padding: var(--padding-xxl);
  border-radius: var(--select-radius-custom, var(--radius-xxl));
  font-size: var(--text-xxl);
  line-height: var(--lh-xxl, 1.4);
  min-height: var(--select-control-height-xxl, var(--control-height-xxl));
  height: var(--select-control-height-xxl, var(--control-height-xxl));
}

.--select.--xxl .--tokens-wrap .--token {
  padding: var(--select-token-padding-xxl) !important;
  border-radius: var(--radius-xxl) !important;
}

.--select.--xxl .--tokens-wrap .--token .--token-label {
  font-size: var(--select-token-label-size-xxl);
}

.--select.--xxl .--tokens-wrap .--token .--token-remove {
  width: var(--select-token-remove-size-xxl);
}

.--options-list.--xxl, .--select-options-list.--xxl {
  padding: var(--padding-xxl-x);
  border-radius: calc(var(--radius-xxl) / 3);
}

.--options-list.--xxl .--select-options-head, .--select-options-list.--xxl .--select-options-head {
  font-size: var(--text-xxl) !important;
  padding: var(--padding-xxl-x);
}

.--options-list.--xxl button.--select-option-item, .--select-options-list.--xxl button.--select-option-item {
  padding: calc(var(--padding-md-x) / 2) !important;
  padding-left: calc(var(--padding-md-x) + var(--select-option-indent)) !important;
  border-radius: var(--radius-xxl) !important;
}

.--select.--2xl {
  --select-radius: var(--select-radius-custom, var(--radius-2xl));
}

.--select.--2xl .--select-display.--selected {
  padding: var(--padding-2xl);
  border-radius: var(--select-radius-custom, var(--radius-2xl));
  font-size: var(--text-2xl);
  line-height: var(--lh-2xl, 1.4);
  min-height: var(--select-control-height-2xl, var(--control-height-2xl));
  height: var(--select-control-height-2xl, var(--control-height-2xl));
}

.--select.--2xl .--tokens-wrap .--token {
  padding: var(--select-token-padding-2xl) !important;
  border-radius: var(--radius-2xl) !important;
}

.--select.--2xl .--tokens-wrap .--token .--token-label {
  font-size: var(--select-token-label-size-2xl);
}

.--select.--2xl .--tokens-wrap .--token .--token-remove {
  width: var(--select-token-remove-size-2xl);
}

.--options-list.--2xl, .--select-options-list.--2xl {
  padding: var(--padding-2xl-x);
  border-radius: calc(var(--radius-2xl) / 3);
}

.--options-list.--2xl .--select-options-head, .--select-options-list.--2xl .--select-options-head {
  font-size: var(--text-2xl) !important;
  padding: var(--padding-2xl-x);
}

.--options-list.--2xl button.--select-option-item, .--select-options-list.--2xl button.--select-option-item {
  padding: calc(var(--padding-md-x) / 2) !important;
  padding-left: calc(var(--padding-md-x) + var(--select-option-indent)) !important;
  border-radius: var(--radius-2xl) !important;
}

.--select.--3xl {
  --select-radius: var(--select-radius-custom, var(--radius-3xl));
}

.--select.--3xl .--select-display.--selected {
  padding: var(--padding-3xl);
  border-radius: var(--select-radius-custom, var(--radius-3xl));
  font-size: var(--text-3xl);
  line-height: var(--lh-3xl, 1.4);
  min-height: var(--select-control-height-3xl, var(--control-height-3xl));
  height: var(--select-control-height-3xl, var(--control-height-3xl));
}

.--select.--3xl .--tokens-wrap .--token {
  padding: var(--select-token-padding-3xl) !important;
  border-radius: var(--radius-3xl) !important;
}

.--select.--3xl .--tokens-wrap .--token .--token-label {
  font-size: var(--select-token-label-size-3xl);
}

.--select.--3xl .--tokens-wrap .--token .--token-remove {
  width: var(--select-token-remove-size-3xl);
}

.--options-list.--3xl, .--select-options-list.--3xl {
  padding: var(--padding-3xl-x);
  border-radius: calc(var(--radius-3xl) / 3);
}

.--options-list.--3xl .--select-options-head, .--select-options-list.--3xl .--select-options-head {
  font-size: var(--text-3xl) !important;
  padding: var(--padding-3xl-x);
}

.--options-list.--3xl button.--select-option-item, .--select-options-list.--3xl button.--select-option-item {
  padding: calc(var(--padding-md-x) / 2) !important;
  padding-left: calc(var(--padding-md-x) + var(--select-option-indent)) !important;
  border-radius: var(--radius-3xl) !important;
}

.--select.--4xl {
  --select-radius: var(--select-radius-custom, var(--radius-4xl));
}

.--select.--4xl .--select-display.--selected {
  padding: var(--padding-4xl);
  border-radius: var(--select-radius-custom, var(--radius-4xl));
  font-size: var(--text-4xl);
  line-height: var(--lh-4xl, 1.4);
  min-height: var(--select-control-height-4xl, var(--control-height-4xl));
  height: var(--select-control-height-4xl, var(--control-height-4xl));
}

.--select.--4xl .--tokens-wrap .--token {
  padding: var(--select-token-padding-4xl) !important;
  border-radius: var(--radius-4xl) !important;
}

.--select.--4xl .--tokens-wrap .--token .--token-label {
  font-size: var(--select-token-label-size-4xl);
}

.--select.--4xl .--tokens-wrap .--token .--token-remove {
  width: var(--select-token-remove-size-4xl);
}

.--options-list.--4xl, .--select-options-list.--4xl {
  padding: var(--padding-4xl-x);
  border-radius: calc(var(--radius-4xl) / 3);
}

.--options-list.--4xl .--select-options-head, .--select-options-list.--4xl .--select-options-head {
  font-size: var(--text-4xl) !important;
  padding: var(--padding-4xl-x);
}

.--options-list.--4xl button.--select-option-item, .--select-options-list.--4xl button.--select-option-item {
  padding: calc(var(--padding-md-x) / 2) !important;
  padding-left: calc(var(--padding-md-x) + var(--select-option-indent)) !important;
  border-radius: var(--radius-4xl) !important;
}

.--select.--5xl {
  --select-radius: var(--select-radius-custom, var(--radius-5xl));
}

.--select.--5xl .--select-display.--selected {
  padding: var(--padding-5xl);
  border-radius: var(--select-radius-custom, var(--radius-5xl));
  font-size: var(--text-5xl);
  line-height: var(--lh-5xl, 1.4);
  min-height: var(--select-control-height-5xl, var(--control-height-5xl));
  height: var(--select-control-height-5xl, var(--control-height-5xl));
}

.--select.--5xl .--tokens-wrap .--token {
  padding: var(--select-token-padding-5xl) !important;
  border-radius: var(--radius-5xl) !important;
}

.--select.--5xl .--tokens-wrap .--token .--token-label {
  font-size: var(--select-token-label-size-5xl);
}

.--select.--5xl .--tokens-wrap .--token .--token-remove {
  width: var(--select-token-remove-size-5xl);
}

.--options-list.--5xl, .--select-options-list.--5xl {
  padding: var(--padding-5xl-x);
  border-radius: calc(var(--radius-5xl) / 3);
}

.--options-list.--5xl .--select-options-head, .--select-options-list.--5xl .--select-options-head {
  font-size: var(--text-5xl) !important;
  padding: var(--padding-5xl-x);
}

.--options-list.--5xl button.--select-option-item, .--select-options-list.--5xl button.--select-option-item {
  padding: calc(var(--padding-md-x) / 2) !important;
  padding-left: calc(var(--padding-md-x) + var(--select-option-indent)) !important;
  border-radius: var(--radius-5xl) !important;
}

.--select.--6xl {
  --select-radius: var(--select-radius-custom, var(--radius-6xl));
}

.--select.--6xl .--select-display.--selected {
  padding: var(--padding-6xl);
  border-radius: var(--select-radius-custom, var(--radius-6xl));
  font-size: var(--text-6xl);
  line-height: var(--lh-6xl, 1.4);
  min-height: var(--select-control-height-6xl, var(--control-height-6xl));
  height: var(--select-control-height-6xl, var(--control-height-6xl));
}

.--select.--6xl .--tokens-wrap .--token {
  padding: var(--select-token-padding-6xl) !important;
  border-radius: var(--radius-6xl) !important;
}

.--select.--6xl .--tokens-wrap .--token .--token-label {
  font-size: var(--select-token-label-size-6xl);
}

.--select.--6xl .--tokens-wrap .--token .--token-remove {
  width: var(--select-token-remove-size-6xl);
}

.--options-list.--6xl, .--select-options-list.--6xl {
  padding: var(--padding-6xl-x);
  border-radius: calc(var(--radius-6xl) / 3);
}

.--options-list.--6xl .--select-options-head, .--select-options-list.--6xl .--select-options-head {
  font-size: var(--text-6xl) !important;
  padding: var(--padding-6xl-x);
}

.--options-list.--6xl button.--select-option-item, .--select-options-list.--6xl button.--select-option-item {
  padding: calc(var(--padding-md-x) / 2) !important;
  padding-left: calc(var(--padding-md-x) + var(--select-option-indent)) !important;
  border-radius: var(--radius-6xl) !important;
}

.--select.--7xl {
  --select-radius: var(--select-radius-custom, var(--radius-7xl));
}

.--select.--7xl .--select-display.--selected {
  padding: var(--padding-7xl);
  border-radius: var(--select-radius-custom, var(--radius-7xl));
  font-size: var(--text-7xl);
  line-height: var(--lh-7xl, 1.4);
  min-height: var(--select-control-height-7xl, var(--control-height-7xl));
  height: var(--select-control-height-7xl, var(--control-height-7xl));
}

.--select.--7xl .--tokens-wrap .--token {
  padding: var(--select-token-padding-7xl) !important;
  border-radius: var(--radius-7xl) !important;
}

.--select.--7xl .--tokens-wrap .--token .--token-label {
  font-size: var(--select-token-label-size-7xl);
}

.--select.--7xl .--tokens-wrap .--token .--token-remove {
  width: var(--select-token-remove-size-7xl);
}

.--options-list.--7xl, .--select-options-list.--7xl {
  padding: var(--padding-7xl-x);
  border-radius: calc(var(--radius-7xl) / 3);
}

.--options-list.--7xl .--select-options-head, .--select-options-list.--7xl .--select-options-head {
  font-size: var(--text-7xl) !important;
  padding: var(--padding-7xl-x);
}

.--options-list.--7xl button.--select-option-item, .--select-options-list.--7xl button.--select-option-item {
  padding: calc(var(--padding-md-x) / 2) !important;
  padding-left: calc(var(--padding-md-x) + var(--select-option-indent)) !important;
  border-radius: var(--radius-7xl) !important;
}

.--select.--8xl {
  --select-radius: var(--select-radius-custom, var(--radius-8xl));
}

.--select.--8xl .--select-display.--selected {
  padding: var(--padding-8xl);
  border-radius: var(--select-radius-custom, var(--radius-8xl));
  font-size: var(--text-8xl);
  line-height: var(--lh-8xl, 1.4);
  min-height: var(--select-control-height-8xl, var(--control-height-8xl));
  height: var(--select-control-height-8xl, var(--control-height-8xl));
}

.--select.--8xl .--tokens-wrap .--token {
  padding: var(--select-token-padding-8xl) !important;
  border-radius: var(--radius-8xl) !important;
}

.--select.--8xl .--tokens-wrap .--token .--token-label {
  font-size: var(--select-token-label-size-8xl);
}

.--select.--8xl .--tokens-wrap .--token .--token-remove {
  width: var(--select-token-remove-size-8xl);
}

.--options-list.--8xl, .--select-options-list.--8xl {
  padding: var(--padding-8xl-x);
  border-radius: calc(var(--radius-8xl) / 3);
}

.--options-list.--8xl .--select-options-head, .--select-options-list.--8xl .--select-options-head {
  font-size: var(--text-8xl) !important;
  padding: var(--padding-8xl-x);
}

.--options-list.--8xl button.--select-option-item, .--select-options-list.--8xl button.--select-option-item {
  padding: calc(var(--padding-md-x) / 2) !important;
  padding-left: calc(var(--padding-md-x) + var(--select-option-indent)) !important;
  border-radius: var(--radius-8xl) !important;
}

.--select.--9xl {
  --select-radius: var(--select-radius-custom, var(--radius-9xl));
}

.--select.--9xl .--select-display.--selected {
  padding: var(--padding-9xl);
  border-radius: var(--select-radius-custom, var(--radius-9xl));
  font-size: var(--text-9xl);
  line-height: var(--lh-9xl, 1.4);
  min-height: var(--select-control-height-9xl, var(--control-height-9xl));
  height: var(--select-control-height-9xl, var(--control-height-9xl));
}

.--select.--9xl .--tokens-wrap .--token {
  padding: var(--select-token-padding-9xl) !important;
  border-radius: var(--radius-9xl) !important;
}

.--select.--9xl .--tokens-wrap .--token .--token-label {
  font-size: var(--select-token-label-size-9xl);
}

.--select.--9xl .--tokens-wrap .--token .--token-remove {
  width: var(--select-token-remove-size-9xl);
}

.--options-list.--9xl, .--select-options-list.--9xl {
  padding: var(--padding-9xl-x);
  border-radius: calc(var(--radius-9xl) / 3);
}

.--options-list.--9xl .--select-options-head, .--select-options-list.--9xl .--select-options-head {
  font-size: var(--text-9xl) !important;
  padding: var(--padding-9xl-x);
}

.--options-list.--9xl button.--select-option-item, .--select-options-list.--9xl button.--select-option-item {
  padding: calc(var(--padding-md-x) / 2) !important;
  padding-left: calc(var(--padding-md-x) + var(--select-option-indent)) !important;
  border-radius: var(--radius-9xl) !important;
}

:root {
  --sheet-bg: #fff;
  --sheet-shadow: var(--zuz-shadow);
  --sheet-body: #fff;
  --sheet-radius: 10px;
  --sheet-padding: 6px 12px;
  --sheet-head-padding: 10px;
  --sheet-body-padding: 10px;
  --sheet-footer: #ddd;
  --sheet-footer-padding: 10px;
  --sheet-action: #222;
  --sheet-action-color: #fff;
  --sheet-action-hover: #333;
  --sheet-action-radius: 7px;
  --sheet-action-padding: 7px 20px;
  --sheet-action-font-size: 16px;
  --sheet-action-font-weight: bold;
  --sheet-closer-color: #111;
  --sheet-closer-hover: rgba(255,255,255,0.2);
  --sheet-closer-opacity: 0.75;
  --sheet-closer-hover-opacity: 1;
  --sheet-font-size: 15px;
  --sheet-title-position: center;
  --sheet-title-opacity: 0.75;
  --sheet-title-font-size: 16px;
  --sheet-closer-font-size: 36px;
  --sheet-error: #ff4747;
  --sheet-warn: #ffba00;
  --sheet-success: #23ac28;
}

.--toast, .--sheet.--sheet-warn, .--sheet.--sheet-success, .--sheet.--sheet-error, .--sheet.--sheet-default {
  border-radius: var(--sheet-radius);
  padding: var(--sheet-padding);
  font-size: var(--sheet-font-size);
  white-space: pre;
}

.--sheet {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: calc(var(--max-z-index) - 1);
  transform-origin: top left;
  transition: all 0.5s cubic-bezier(0.2, -0.36, 0, 1.46) 0s;
}

.--sheet.--wobble {
  transform-origin: inherit !important;
}

.--sheet.--sheet-default {
  background: #333;
  color: #fff;
  top: 10px !important;
}

.--sheet.--sheet-error {
  background: var(--sheet-error);
  color: #fff;
  top: 10px;
}

.--sheet.--sheet-success {
  background: var(--sheet-success);
  color: #fff;
  top: 10px;
}

.--sheet.--sheet-warn {
  background: var(--sheet-warn);
  color: #111;
  top: 10px;
}

.--sheet.--sheet-form {
  position: absolute !important;
}

.--sheet.--sheet-dialog {
  background: var(--sheet-bg);
  border-radius: var(--sheet-radius);
  box-shadow: var(--sheet-shadow);
  transform-origin: top left !important;
}

.--sheet.--sheet-dialog .--cover {
  border-radius: var(--sheet-radius);
}

.--sheet.--sheet-dialog .--cover.fillx {
  top: -40px !important;
  bottom: -70px !important;
}

.--sheet .--head {
  padding: var(--sheet-head-padding);
}

.--sheet .--head .--title {
  flex: 1 1;
  font-size: var(--sheet-title-font-size);
  opacity: var(--sheet-title-opacity);
  text-align: var(--sheet-title-position);
  padding: 0px 45px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.--sheet .--head .--dot {
  flex: 1 1;
}

.--sheet .--head .--closer {
  width: 32px;
  height: 32px;
  cursor: pointer;
  font-size: var(--sheet-closer-font-size);
  color: var(--sheet-closer-color);
  background: rgba(0, 0, 0, 0);
  border: 0px;
  line-height: 0;
  padding: 0px;
  font-weight: normal;
  border-radius: 20px;
  opacity: var(--sheet-closer-opacity);
  top: 15px;
  right: 5px;
  transform: translateY(-50%);
  font-size: var(--sheet-closer-font-size);
}

.--sheet .--head .--closer:hover {
  background: var(--sheet-closer-hover);
  opacity: var(--sheet-closer-hover-opacity);
}

.--sheet .--body {
  background: var(--sheet-body);
  padding: var(--sheet-body-padding);
}

.--sheet .--body.--no-action {
  border-radius: 0px 0px var(--sheet-radius) var(--sheet-radius);
}

.--sheet .--footer {
  padding: var(--sheet-footer-padding);
  background: var(--sheet-footer);
  border-radius: 0px 0px var(--sheet-radius) var(--sheet-radius);
}

.--sheet .--footer .--action {
  background: var(--sheet-action);
  color: var(--sheet-action-color);
  border-radius: var(--sheet-action-radius);
  padding: var(--sheet-action-padding);
  font-size: var(--sheet-action-font-size);
  font-weight: var(--sheet-action-font-weight);
  border: 0px;
}

.--sheet .--footer .--action:hover {
  background: var(--sheet-action-hover);
}

.--sheet.is-visible {
  z-index: var(--max-z-index);
}

body {
  --slider-radius: 5px;
  --slider-knob-size: 12px;
  --slider-knob-width: var(--slider-knob-size);
  --slider-knob-height: var(--slider-knob-size);
  --slider-knob-color: #fff;
  --slider-knob-radius: 50%;
  --slider-knob-border: 1px #ccc solid;
  --slider-knob-shadow: 0px 0px 2px #ccc;
  --slider-track: #fff;
  --slider-track-border: 1px #ddd solid;
  --slider-ghost: #f1f1f1;
  --slider-fill: #111;
  --slider-text: rgb(0, 98, 255);
  --slider-text-size: 15px;
  --slider-text-weight: normal;
  --slider-height: 6px;
}

[color-scheme=dark] body {
  --slider-track: #3a3c3e;
  --slider-track-border: 1px #414244 solid;
  --slider-fill: #fff;
  --slider-ghost: rgba(255, 255, 255, 0.3);
  --slider-knob-border: 1px #fff solid;
}

.--slider {
  --ghost-start: 0%;
  --ghost-width: 0%;
  --mouse-x: 50%;
}

.--slider.--range {
  height: var(--slider-height);
  width: 100%;
  min-width: 100px;
}

.--slider.--number {
  width: fit-content;
  text-align: center;
}

.--slider input {
  height: 100%;
  width: 100%;
  opacity: 0;
  touch-action: none;
  z-index: 5;
}

.--slider input[type=range]:hover {
  cursor: grab;
}

.--slider input[type=range]:active {
  cursor: grabbing;
}

.--slider input[type=number] {
  cursor: ns-resize;
}

.--slider .--slider-track {
  background: var(--slider-track);
  height: 100%;
  border-radius: var(--slider-radius);
  overflow: hidden;
  border: var(--slider-track-border);
  z-index: 1;
}

.--slider .--slider-track-filled {
  background: var(--slider-fill);
  height: 100%;
  border-radius: var(--slider-radius);
  overflow: hidden;
  border: var(--slider-track-border);
  z-index: 3;
  width: calc(var(--value) * 1%);
}

.--slider .--slider-knob {
  width: var(--slider-knob-width);
  height: var(--slider-knob-height);
  top: 50%;
  left: calc(var(--value) * 1%);
  transform-origin: calc(var(--value) * 1%) center;
  transform: translate(calc(var(--value) * -1%), -50%) scale(var(--knob-scale, 1));
  transition: transform 0.1s ease-in-out;
  background: var(--slider-knob-color);
  border-radius: var(--slider-knob-radius);
  border: var(--slider-knob-border);
  box-shadow: var(--slider-knob-shadow);
  pointer-events: none;
  z-index: 4;
  corner-shape: round !important;
}

.--slider .--slider-text {
  text-decoration: none;
  color: var(--slider-text);
  cursor: ew-resize;
  text-align: center;
  -webkit-user-select: none;
          user-select: none;
  font-size: var(--slider-text-size);
  font-weight: var(--slider-text-weight);
}

.--slider.--knob-hover {
  --knob-scale: 0.5;
}

.--slider.--knob-hover .--slider-knob {
  transform: translate(calc(var(--value) * -1%), -50%) scale(0.5);
  transition: transform 0.1s ease-in-out;
}

.--slider.--knob-hover:hover .--slider-knob, .--slider.--knob-hover:active .--slider-knob {
  transform: translate(calc(var(--value) * -1%), -50%) scale(1);
}

.--slider.--knob-hover:hover, .--slider.--knob-hover:active {
  --knob-scale: 1;
}

.--slider .--slider-ghost {
  z-index: 2;
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(var(--ghost-start) * 1%);
  width: calc(var(--ghost-width) * 1%);
  background: var(--slider-ghost);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.1s;
  border-radius: var(--slider-radius);
}

.--slider:hover .--slider-ghost {
  opacity: 1;
}

body {
  --spinner-primary: #111;
  --spinner-secondary: #e0e0e0;
}

[color-scheme=dark] {
  --spinner-primary: #f6f6f6;
  --spinner-secondary: #d5d5d5;
}

.--spinner {
  corner-shape: round !important;
}

.--spinner.--simple {
  aspect-ratio: 1;
  animation: spin infinite;
  width: var(--spinner-size);
  height: var(--spinner-size);
  border: var(--spinner-width) var(--spinner-secondary) solid;
  border-radius: 50%;
  border-top-color: var(--spinner-primary);
  animation-timing-function: linear;
  animation-duration: var(--spinner-speed);
  --spinner-width: 3px;
  --spinner-speed: 0.4s;
}

.--spinner.--simple.--xs {
  --spinner-size: 12px;
}

.--spinner.--simple.--sm {
  --spinner-size: 24px;
}

.--spinner.--simple.--md {
  --spinner-width: 4px;
  --spinner-size: 36px;
}

.--spinner.--simple.--lg {
  --spinner-width: 5px;
  --spinner-size: 48px;
}

.--spinner.--simple.--xl {
  --spinner-width: 6px;
  --spinner-size: 60px;
}

.--spinner.--simple.--xxl {
  --spinner-width: 8px;
  --spinner-size: 72px;
}

.--spinner.--roller {
  --g1: var(--spinner-primary) 96%, #0000;
  --g2: var(--spinner-secondary) 96%, #0000;
  width: calc(2 * var(--R));
  aspect-ratio: 1;
  border-radius: 50%;
  display: grid;
  -webkit-mask: linear-gradient(#000 0 0);
  animation: l30 var(--spinner-speed) infinite linear;
  --spinner-speed: 1.2s;
}

.--spinner.--roller.--xs {
  --R: 6px;
}

.--spinner.--roller.--sm {
  --R: 10px;
}

.--spinner.--roller.--md {
  --R: 12px;
}

.--spinner.--roller.--lg {
  --R: 16px;
}

.--spinner.--roller.--xl {
  --R: 22px;
}

.--spinner.--roller.--xxl {
  --R: 30px;
}

.--spinner.--roller:before, .--spinner.--roller:after {
  content: "";
  grid-area: 1/1;
  width: 50%;
  background: radial-gradient(farthest-side, var(--g1)) calc(var(--R) + 0.866 * var(--R) - var(--R)) calc(var(--R) - 0.5 * var(--R) - var(--R)), radial-gradient(farthest-side, var(--g1)) calc(var(--R) + 0.866 * var(--R) - var(--R)) calc(var(--R) - 0.5 * var(--R) - var(--R)), radial-gradient(farthest-side, var(--g2)) calc(var(--R) + 0.5 * var(--R) - var(--R)) calc(var(--R) - 0.866 * var(--R) - var(--R)), radial-gradient(farthest-side, var(--g1)) 0 calc(-1 * var(--R)), radial-gradient(farthest-side, var(--g2)) calc(var(--R) - 0.5 * var(--R) - var(--R)) calc(var(--R) - 0.866 * var(--R) - var(--R)), radial-gradient(farthest-side, var(--g1)) calc(var(--R) - 0.866 * var(--R) - var(--R)) calc(var(--R) - 0.5 * var(--R) - var(--R)), radial-gradient(farthest-side, var(--g2)) calc(-1 * var(--R)) 0, radial-gradient(farthest-side, var(--g1)) calc(var(--R) - 0.866 * var(--R) - var(--R)) calc(var(--R) + 0.5 * var(--R) - var(--R));
  background-size: calc(2 * var(--R)) calc(2 * var(--R));
  background-repeat: no-repeat;
}

.--spinner.--roller:after {
  transform: rotate(180deg);
  transform-origin: right;
}

@keyframes l30 {
  100% {
    transform: rotate(-1turn);
  }
}
.--spinner.--wave {
  display: flex;
  align-items: center;
  gap: var(--spinner-gap);
}

.--spinner.--wave.--def, .--spinner.--wave.--xs {
  --spinner-radius: 2px;
  --spinner-gap: 2px;
  --spinner-wave-width: 2px;
  --spinner-wave-height: 6px;
}

.--spinner.--wave.--sm {
  --spinner-radius: 2px;
  --spinner-gap: 3px;
  --spinner-wave-width: 4px;
  --spinner-wave-height: 12px;
}

.--spinner.--wave.--md {
  --spinner-radius: 3px;
  --spinner-gap: 4px;
  --spinner-wave-width: 5px;
  --spinner-wave-height: 16px;
}

.--spinner.--wave.--lg {
  --spinner-radius: 4px;
  --spinner-gap: 6px;
  --spinner-wave-width: 7px;
  --spinner-wave-height: 24px;
}

.--spinner.--wave.--xl {
  --spinner-radius: 6px;
  --spinner-gap: 6px;
  --spinner-wave-width: 8px;
  --spinner-wave-height: 30px;
}

.--spinner.--wave .--bar {
  width: var(--spinner-wave-width);
  background: var(--spinner-primary);
  border-radius: var(--spinner-radius);
  corner-shape: round !important;
}

.--spinner.--wave .--bar.--bar1 {
  animation: spinnerWave infinite;
  animation-delay: 0.1s;
  height: var(--spinner-wave-height);
  animation-duration: 1.5s;
  animation-timing-function: ease-in-out;
}

.--spinner.--wave .--bar.--bar2 {
  animation: spinnerWave infinite;
  animation-delay: 0.2s;
  height: calc(var(--spinner-wave-height) * 1.1);
  animation-duration: 1.5s;
  animation-timing-function: ease-in-out;
}

.--spinner.--wave .--bar.--bar3 {
  animation: spinnerWave infinite;
  animation-delay: 0.3s;
  height: calc(var(--spinner-wave-height) * 1.25);
  animation-duration: 1.5s;
  animation-timing-function: ease-in-out;
}

.--stack {
  flex: 1 1;
}

body {
  --step: var(--surface);
  --step-border-width: 2px;
  --step-border-color: var(--text-primary);
  --step-border-style: solid;
  --step-line-height: 2px;
  --step-gap: 15px;
}

.--stepper {
  width: 100%;
  gap: var(--step-gap);
}

.--stepper.--xs {
  --step-size: 40px;
  --step-label-size: var(--text-xs);
}

.--stepper.--sm {
  --step-size: 40px;
  --step-label-size: var(--text-sm);
}

.--stepper.--md {
  --step-size: 40px;
  --step-label-size: var(--text-md);
}

.--stepper.--lg {
  --step-size: 40px;
  --step-label-size: var(--text-lg);
}

.--stepper.--xl {
  --step-size: 40px;
  --step-label-size: var(--text-xl);
}

.--stepper.--xxl {
  --step-size: 40px;
  --step-label-size: var(--text-xxl);
}

.--stepper.--2xl {
  --step-size: 40px;
  --step-label-size: var(--text-2xl);
}

.--stepper.--3xl {
  --step-size: 40px;
  --step-label-size: var(--text-3xl);
}

.--stepper.--4xl {
  --step-size: 40px;
  --step-label-size: var(--text-4xl);
}

.--stepper.--5xl {
  --step-size: 40px;
  --step-label-size: var(--text-5xl);
}

.--stepper.--6xl {
  --step-size: 40px;
  --step-label-size: var(--text-6xl);
}

.--stepper.--7xl {
  --step-size: 40px;
  --step-label-size: var(--text-7xl);
}

.--stepper.--8xl {
  --step-size: 40px;
  --step-label-size: var(--text-8xl);
}

.--stepper.--9xl {
  --step-size: 40px;
  --step-label-size: var(--text-9xl);
}

.--stepper .--step-item {
  opacity: 0.5;
}

.--stepper .--step-item.--current {
  opacity: 1;
}

.--stepper .--step-item:not(:last-child) {
  flex: 1 1;
}

.--stepper .--step-item .--step {
  width: var(--step-size);
  border: var(--step-border-width) var(--step-border-color) var(--step-border-style);
  border-radius: 50%;
  background: var(--step);
  aspect-ratio: 1/1;
  overflow: hidden;
  background: rgb(from var(--step-border-color) r g b/0.1);
}

.--stepper .--step-item .--step-label {
  font-size: var(--step-label-size);
}

.--stepper .--step-item .--step-line {
  height: var(--step-line-height);
  flex: 1 1;
  background: var(--step-border-color);
}

:root {
  --switch-height: 24px;
  --switch-width: 42px;
  --switch-knob-size: 20px;
  --switch-knob-left: 2px;
  --switch-knob-top: 2px;
  --switch-knob-left-on: 18px;
  --switch-checked: rgb(46, 161, 42);
  --switch-unchecked: rgb(203, 203, 203);
  --switch-knob: #fff;
  --switch-knob-shadow: #000;
  --switch-knob-shadow-size: 2px;
}

.--switch.--md {
  --switch-height: 20px;
  --switch-width: 36px;
  --switch-knob-size: 16px;
  --switch-knob-left-on: 16px;
}

.--switch.--sm {
  --switch-height: 10px;
  --switch-width: 34px;
  --switch-knob-size: 16px;
  --switch-knob-left: 0px;
  --switch-knob-top: -3px;
}

.--switch {
  height: var(--switch-height);
  width: var(--switch-width);
  min-height: var(--switch-height);
  min-width: var(--switch-width) !important;
  max-height: var(--switch-height);
  max-width: var(--switch-width);
  cursor: pointer;
}

.--switch input[type=checkbox] {
  z-index: 0;
  left: 10px;
  top: 10px;
  opacity: 0;
}

.--switch:before {
  content: "";
  position: absolute;
  height: var(--switch-height);
  width: var(--switch-width);
  background: var(--switch-unchecked);
  border-radius: 50px;
  z-index: 1;
  transition: all 0.3s linear 0s;
}

.--switch:after {
  content: "";
  position: absolute;
  width: var(--switch-knob-size);
  height: var(--switch-knob-size);
  background: var(--switch-knob);
  border-radius: 50px;
  z-index: 2;
  top: var(--switch-knob-top);
  left: var(--switch-knob-left);
  box-shadow: 0px 0px var(--switch-knob-shadow-size) var(--switch-knob-shadow);
  transition: all 0.75s var(--bounce) 0s;
}

.--switch.--disabled {
  cursor: not-allowed;
  opacity: 0.25;
}

.--switch.is-checked:before {
  box-shadow: inset 0px 0px 0px 15px var(--switch-checked);
}

.--switch.is-checked:after {
  transform: translateX(var(--switch-knob-left-on));
}

body {
  --table: transparent;
  --table-row-gap: 2px;
  --table-row-radius: 0px;
  --table-row-padding: 0px;
  --table-row-cursor: auto;
  --table-radius: 10px;
  --table-head-font-weight: bold;
  --table-head-padding: 0px;
  --table-head-font-size: 15px;
  --table-head-col-padding: 10px;
  --table-head-arrow: 14px;
  --table-head-arrow-margin: 5px;
  --table-head-arrow-color: #111;
  --table-col-padding: 10px;
  --table-col-selector-size: 40px;
  --table-border: 1px var(--border-primary) solid;
  --table-head-radius: var(--table-radius) var(--table-radius) 0px 0px;
  --table-footer-radius: 0px 0px var(--table-radius) var(--table-radius);
  --table-spinner-top: 100px;
  --table-spinner-bg: rgba(255, 255, 255, 0.5);
  --table-spinner-radius: 10px;
  --table-spinner-padding: 10px;
  --table-spinner-gap: 6px;
  --table-spinner-border: 1px #eaeaea solid;
  --table-spinner-shadow: 0px 0px 4px transparent;
  --table-loading-message-size: 15px;
  --table-row: #eee;
  --table-row-even: #f1f1f1;
  --table-row-odd: #f9f9f9;
  --table-row-hover: #fff;
}

[color-scheme=dark] body {
  --table-row: #333;
  --table-row-hover: #555;
  --table-row-even: #333;
  --table-row-odd: #444;
}

.--table {
  background: var(--table);
  gap: var(--table-row-gap);
  flex: 1 1;
  border: var(--table-border);
  border-radius: var(--table-radius);
}

.--table.--hoverable .--row:not(.--row-head):not(.--row-footer):hover {
  background: var(--table-row-hover);
}

.--table .--row {
  background: var(--table-row);
  border-radius: var(--table-row-radius);
}

.--table .--row.--row-clickable {
  cursor: pointer !important;
}

.--table .--row:not(.--row-head):not(.--row-footer) {
  padding: var(--table-row-padding);
  cursor: var(--table-row-cursor);
}

.--table .--row:not(.--row-head):not(.--row-footer) .--col {
  padding: var(--table-col-padding);
}

.--table .--row:nth-child(1) {
  border-radius: var(--table-head-radius);
}

.--table .--row:last-child {
  border-radius: var(--table-footer-radius);
}

.--table .--row:nth-child(even) {
  background: var(--table-row-even);
}

.--table .--row:nth-child(odd) {
  background: var(--table-row-odd);
}

.--table .--row.--row-head {
  font-weight: var(--table-head-font-weight);
  padding: var(--table-head-padding) !important;
  font-size: var(--table-head-font-size);
  background: var(--table-row-head);
  color: var(--table-head-color);
}

.--table .--row.--row-head .--col {
  padding: var(--table-head-col-padding);
}

.--table .--row .--col .--colv {
  flex: 1 1;
}

.--table .--row .--col .--arrow {
  width: var(--table-head-arrow);
  margin-left: var(--table-head-arrow-margin);
}

.--table .--row .--col .--arrow svg {
  fill: var(--table-head-arrow-color);
}

.--table .--row .--col.--sortable {
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
}

.--table .--row .--col.--selector {
  min-width: var(--table-col-selector-size) !important;
  max-width: var(--table-col-selector-size);
}

.--table .--table-spinner {
  position: absolute;
  top: var(--table-spinner-top);
  left: 50%;
  transform: translateX(-50%);
  background: var(--table-spinner-bg);
  border-radius: var(--table-spinner-radius);
  padding: var(--table-spinner-padding);
  gap: var(--table-spinner-gap);
  border: var(--table-spinner-border);
  box-shadow: var(--table-spinner-shadow);
  z-index: 3;
}

.--table .--table-loading-message {
  font-size: var(--table-loading-message-size);
}

body {
  --table-of-contents-color: var(--text-primary);
  --table-of-contents-color-active: var(--primary);
  --table-of-contents-dot-size: 8px;
  --table-of-contents-gap: 15px;
  --table-of-contents-title-size: var(--text-lg);
}

.--table-of-contents {
  gap: var(--table-of-contents-gap);
}

.--table-of-contents .--toc-title {
  font-size: var(--table-of-contents-title-size);
  font-weight: bold;
}

.--table-of-contents ul {
  gap: 5px;
}

.--table-of-contents ul > li {
  position: relative;
  padding: 0px !important;
}

.--table-of-contents ul > li a {
  display: inline-block;
  text-decoration: none;
  line-height: 1.2;
}

.--table-of-contents ul > li a.--toc-active {
  color: var(--table-of-contents-color-active);
  font-weight: 600;
}

.--table-of-contents ul > li:first-of-type a {
  anchor-name: --toc-active;
}

.--table-of-contents a:target, .--table-of-contents a:target-current {
  anchor-name: --toc-active;
  color: var(--primary) !important;
}

.--table-of-contents:before {
  content: "";
  width: var(--table-of-contents-dot-size);
  height: var(--table-of-contents-dot-size);
  position: absolute;
  background: var(--table-of-contents-color-active);
  position-anchor: --toc-active;
  left: anchor(left);
  top: anchor(center);
  translate: -175% -50%;
  -webkit-position-area: left;
  margin-right: 10px;
  align-self: center;
  transition: top 0.26s cubic-bezier(0.215, 0.61, 0.355, 1), left 0.26s;
  border-radius: 50%;
}

body {
  --tab-head: var(--surface);
  --tab-head-border: 0px;
  --tab-head-padding: 0px;
  --tab-line: var(--text-primary);
  --tab-line-radius: 10px;
  --tab-color: var(--text-secondary);
  --tab-color-hover: var(--text-secondary-hover);
  --tab-label-weight: bold;
  --tab-radius: 0px;
  --tab-padding: 10px 20px;
  --tab-border-width: 1px;
  --tab-border-style: solid;
  --tab-border-color: var(--surface);
  --tab-label-color: #999;
  --tab-label-active-color: #111;
  --tab-body: var(--surface);
}

.--tabview {
  min-width: 0px;
}

.--tabview .--tabview-head {
  --segmented: var(--tab-head);
  --segmented-border: var(--tab-head-border);
  --segmented-radius-sm: var(--tab-radius);
  --segmented-padding-sm: var(--tab-head-padding);
  --segment-item-color: var(--tab-color);
  --segment-item-hover-color: var(--tab-color-hover);
  --segmented-gap: 1px;
  --segment-tab: var(--tab-line);
}

.--tabview .--tabview-head .--segment-item {
  padding: var(--tab-padding) !important;
  color: var(--tab-label-color);
  background: var(--tab-background, var(--muted));
}

.--tabview .--tabview-head .--segment-item:hover {
  background: var(--tab-background-hover, var(--muted-hover));
}

.--tabview .--tabview-head .--segment-item .--segment-label {
  font-weight: var(--tab-label-weight) !important;
}

.--tabview .--tabview-head .--segment-item.--segment-active {
  color: var(--tab-label-active-color);
  background: var(--tab-background-active, var(--surface));
}

.--tabview .--tabview-head .--segment-item.--segment-active:hover {
  background: var(--tab-background-active, var(--surface));
}

.--tabview .--tabview-head .--segment-tab {
  top: 90% !important;
  border-radius: var(--tab-line-radius) !important;
  z-index: 2;
}

.--tabview.--fixed .--tabview-head .--segment-item {
  max-width: fit-content !important;
}

.--tabview .--tabview-body {
  outline: var(--tab-border-width) var(--tab-border-style) var(--tab-border-color);
  outline-offset: calc(var(--tab-border-width) * -1);
  overflow: hidden;
  border-radius: var(--tab-body-radius);
  width: 100%;
  max-width: 100%;
  min-width: 0px;
  display: block;
  position: relative;
  background: var(--tab-body);
}

.--tabview .--tabview-body .--track {
  transform-style: flat;
  will-change: transform, opacity;
  align-items: flex-start !important;
  flex-wrap: nowrap;
}

.--tabview .--tabview-body .--content {
  width: 100%;
  flex-shrink: 0;
  background: var(--tab-body, #fff);
  padding: var(--tab-body-padding);
  display: block;
  min-height: 1px;
}

[color-scheme=dark] body {
  --tab-label-color: #bcbcbc;
  --tab-label-active-color: #fff;
}

body {
  --terminal-primary: #222;
  --terminal-secondary: #333;
  --terminal-border: 1px var(--terminal-primary) solid;
  --terminal-padding: 5px;
  --terminal-radius: 5px;
  --terminal-color: #eeeeee;
  --terminal-max-height: 100px;
}

.--zuz-terminal {
  background: var(--terminal-primary);
  border: var(--terminal-border);
  font-family: monospace !important;
  border-radius: var(--terminal-radius);
}

.--zuz-terminal.--sm {
  font-size: var(--text-sm);
}

.--zuz-terminal.--md {
  font-size: var(--text-md);
}

.--zuz-terminal.--lg {
  font-size: var(--text-lg);
}

.--zuz-terminal.--xl {
  font-size: var(--text-xl);
}

.--zuz-terminal.--xxl {
  font-size: var(--text-xxl);
}

.--zuz-terminal .--terminal-log {
  flex: 1 1;
  overflow-x: hidden;
  overflow-y: auto;
  margin-bottom: 10px;
  max-height: var(--terminal-max-height);
  padding: var(--terminal-padding);
  white-space: pre-wrap;
  word-break: break-all;
  font-family: monospace;
  font-size: 14px;
  gap: 4px;
}

.--zuz-terminal .--terminal-log span {
  display: inline;
}

.--zuz-terminal .--terminal-input {
  background: var(--terminal-secondary);
  padding: 0px var(--terminal-padding);
  color: var(--terminal-color);
}

.--zuz-terminal .--zuz-term-input {
  background-color: rgba(0, 0, 0, 0) !important;
  border: 0px !important;
  outline: none;
  color: var(--terminal-color);
  font-family: monospace;
  font-size: 14px;
  flex: 1 1;
  caret-color: lime;
}

.--zuz-terminal ::-webkit-scrollbar {
  width: 6px;
}

.--zuz-terminal ::-webkit-scrollbar-thumb {
  background: hsla(0, 0%, 100%, 0.5);
  border-radius: 10px;
}

.--text-fx {
  display: flex;
  flex-wrap: wrap;
}

.--text-fx .--fx-char {
  display: inline-block;
  animation-delay: var(--delay);
  animation-duration: var(--duration);
  animation-iteration-count: var(--iteration);
  animation-fill-mode: both;
  position: relative;
}

.--fx-typewriter {
  animation-name: zuz-typewriter;
  animation-timing-function: steps(1, end);
}

.--fx-bounce {
  animation-name: zuz-bounce;
  animation-timing-function: cubic-bezier(0.28, 0.84, 0.42, 1);
}

.--fx-wave {
  animation-name: zuz-wave;
  animation-timing-function: ease-in-out;
}

@keyframes zuz-typewriter {
  0% {
    opacity: 0;
    visibility: hidden;
  }
  100% {
    opacity: var(--target-opacity, 1);
    visibility: visible;
  }
}
@keyframes zuz-bounce {
  0%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-20px) scaleY(1.1);
  }
  60% {
    transform: translateY(-15px);
  }
}
@keyframes zuz-wave {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}
.--fx-glitch::before, .--fx-glitch::after {
  content: attr(data-char);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.--fx-slide {
  animation-name: zuz-slide;
}

.--fx-fade {
  animation-name: zuz-fade;
}

.--text-fx:has(.--fx-typewriter)::after {
  content: "|";
  position: absolute;
  right: -4px;
  animation: zuz-cursor-move var(--duration) var(--delay) steps(1) both;
  opacity: 0;
}

.--fx-glitch {
  animation: zuz-glitch-main 3s infinite;
}

.--fx-glitch::before, .--fx-glitch::after {
  content: attr(data-char);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.--fx-glitch::before {
  left: 2px;
  text-shadow: -2px 0 #ff00c1;
  clip-path: inset(45% 0 45% 0);
  animation: zuz-glitch-split 2s infinite linear alternate-reverse;
}

.--fx-glitch::after {
  left: -2px;
  text-shadow: 2px 0 #00fff9;
  clip-path: inset(10% 0 85% 0);
  animation: zuz-glitch-split 3s infinite linear alternate-reverse;
}

@keyframes zuz-glitch-split {
  0% {
    clip-path: inset(10% 0 30% 0);
  }
  20% {
    clip-path: inset(60% 0 10% 0);
  }
  40% {
    clip-path: inset(20% 0 50% 0);
  }
  60% {
    clip-path: inset(80% 0 5% 0);
  }
  80% {
    clip-path: inset(30% 0 60% 0);
  }
  100% {
    clip-path: inset(50% 0 20% 0);
  }
}
@keyframes zuz-slide {
  0% {
    opacity: 0;
    transform: translateY(20px);
    filter: blur(4px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}
@keyframes zuz-fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes zuz-cursor-move {
  0% {
    opacity: 1;
  }
  99% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.--fx-reveal {
  animation-name: zuz-reveal;
  clip-path: inset(0 100% 0 0);
}

@keyframes zuz-reveal {
  to {
    clip-path: inset(0 0 0 0);
  }
}
.--fx-pop {
  animation-name: zuz-pop;
  animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@keyframes zuz-pop {
  0% {
    transform: scale(0);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
.--fx-fog {
  animation-name: zuz-fog;
}

@keyframes zuz-fog {
  0% {
    filter: blur(10px);
    letter-spacing: 10px;
    opacity: 0;
    transform: scale(1.2);
  }
  100% {
    filter: blur(0);
    letter-spacing: normal;
    opacity: 1;
    transform: scale(1);
  }
}
.--fx-glitch-v2 {
  animation: zuz-glitch-v2 0.2s infinite;
}

@keyframes zuz-glitch-v2 {
  0% {
    transform: translate(0);
    text-shadow: none;
  }
  20% {
    transform: translate(-2px, 2px);
    text-shadow: 2px 0 red;
  }
  40% {
    transform: translate(-2px, -2px);
    text-shadow: -2px 0 blue;
  }
  60% {
    transform: translate(2px, 2px);
    text-shadow: 2px 0 green;
  }
  80% {
    transform: translate(2px, -2px);
    text-shadow: -2px 0 #ff0;
  }
  100% {
    transform: translate(0);
  }
}
.--fx-shuffle {
  animation: zuz-shuffle var(--duration) var(--delay) ease-out both;
}

@keyframes zuz-shuffle {
  0% {
    opacity: 0;
    transform: translateY(5px);
    filter: blur(2px);
  }
  20% {
    content: "#";
    opacity: 1;
  }
  40% {
    content: "&";
  }
  60% {
    content: "0";
  }
  80% {
    content: "X";
  }
  100% {
    opacity: var(--target-opacity, 1);
    transform: translateY(0);
    filter: blur(0);
  }
}
body {
  --command-box: #eee;
  --command-box-width: fit-content;
  --command-box-radius: 5px;
  --command-box-padding: 10px;
  --command-box-column-count: 2;
  --command-box-column-width: 1fr;
  --command-box-gap: 10px;
  --command-box-shadow: 0px 1px 2px #dcdcdc;
  --command-box-border: 1px #c9c9c9 solid;
  --command-item: transparent;
  --command-item-text-color: #111;
  --command-item-text-size: 15px;
  --command-item-padding: 6px;
  --command-item-radius: 6px;
  --command-item-gap: 6px;
  --command-item-icon-size: 16px;
  --command-item-hover: #fff;
}

.--command-box {
  background: var(--command-box);
  border-radius: var(--command-box-radius);
  padding: var(--command-box-padding);
  grid-template-columns: repeat(var(--command-box-column-count), var(--command-box-column-width));
  gap: var(--command-box-gap);
  width: var(--command-box-width);
  border: var(--command-box-border);
  box-shadow: var(--command-box-shadow);
  z-index: 9;
  corner-shape: squircle;
}

.--command-box .--command-item {
  background: var(--command-item) !important;
  text-align: left !important;
  color: var(--command-item-text-color) !important;
  white-space: pre;
  justify-content: flex-start !important;
  font-size: var(--command-item-text-size) !important;
  padding: var(--command-item-padding) !important;
  border-radius: var(--command-item-radius) !important;
  gap: var(--command-item-gap) !important;
}

.--command-box .--command-item .--command-icon {
  font-size: var(--command-item-icon-size) !important;
}

.--command-box .--command-item:hover {
  background: var(--command-item-hover) !important;
}

:root {
  --text-wheel-speed: 2;
  --text-wheel-transition: translate calc(var(--text-wheel-speed) * 1s) var(--ease);
}

.--text-wheel {
  transform-style: flat;
}

.--text-wheel .--wheel-char {
  font-feature-settings: "tnum";
  font-variant: tabular-nums;
  overflow: hidden;
  height: 1lh;
}

.--text-wheel .--wheel-char .--wheel-char-track {
  transition: var(--text-wheel-transition);
}

.--text-wheel .--wheel-char .--wheel-char-track.--wheel-track-down {
  translate: 0 calc((10 - var(--v)) * -1lh);
}

.--text-wheel .--wheel-char .--wheel-char-track.--wheel-track-up {
  translate: 0 calc((var(--v) + 1) * -1lh);
}

.--text-wheel .--wheel-char .--wheel-char-track span {
  height: 1lh;
  transition: opacity 0.5s;
}

body {
  --snack-bg: #222;
  --snack-text-color: #fff;
  --snack-btn: #434343;
  --snack-btn-hover: #505050;
  --snack-title-opacity: 1;
  --snack-msg-opacity: 0.8;
  --snack-container-offset: 60px;
  --snack-hover-shadow: #333;
}

body .--snack {
  --progress-bar: rgba(0,0,0,0.4);
}

[color-scheme=dark] body {
  --snack-bg: #fff;
  --snack-text-color: #111;
  --snack-btn: #242222;
  --snack-btn-hover: #1d1b1b;
  --snack-hover-shadow: #555;
}

[color-scheme=dark] body .--snack {
  --progress-bar: rgba(0,0,0,0.4);
}

.--toast-container {
  padding: 20px;
  z-index: 10000;
  gap: 10px;
  width: 100%;
  max-width: 400px;
  pointer-events: none;
}

.--toast-container.--bottomcenter, .--toast-container.--bottomright, .--toast-container.--bottomleft {
  bottom: var(--snack-container-offset);
}

.--toast-container.--topcenter, .--toast-container.--bottomcenter {
  left: 50%;
  transform: translateX(-50%);
  align-items: center;
}

.--toast-container.--topleft, .--toast-container.--bottomleft {
  left: 0;
  align-items: flex-start;
}

.--toast-container.--topright, .--toast-container.--bottomright {
  right: 0;
  align-items: flex-end;
}

.--toast-container .--snack {
  background: var(--snack-bg);
  transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), translate 0.3s cubic-bezier(0.4, 0, 0.2, 1), scale 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  color: var(--snack-text-color);
  pointer-events: auto;
  max-width: 90vw;
  gap: 6px;
  overflow: hidden;
}

.--toast-container .--snack:hover {
  box-shadow: 0px 0px 0px 1px var(--snack-hover-shadow);
}

.--toast-container .--snack.--xs {
  --progress-radius: var(--radius-xs);
  border-radius: var(--radius-xs);
  padding: var(--padding-xs-x);
}

.--toast-container .--snack.--xs .--meta .--tt {
  font-size: var(--text-xs);
  font-weight: bold;
}

.--toast-container .--snack.--xs .--meta .--tm {
  font-size: calc(var(--text-xs) - 1px);
}

.--toast-container .--snack.--xs .--snack-btn {
  padding: var(--padding-xs);
  border-radius: var(--radius-xs);
}

.--toast-container .--snack.--sm {
  --progress-radius: var(--radius-sm);
  border-radius: var(--radius-sm);
  padding: var(--padding-sm-x);
}

.--toast-container .--snack.--sm .--meta .--tt {
  font-size: var(--text-sm);
  font-weight: bold;
}

.--toast-container .--snack.--sm .--meta .--tm {
  font-size: calc(var(--text-sm) - 1px);
}

.--toast-container .--snack.--sm .--snack-btn {
  padding: var(--padding-sm);
  border-radius: var(--radius-sm);
}

.--toast-container .--snack.--md {
  --progress-radius: var(--radius-md);
  border-radius: var(--radius-md);
  padding: var(--padding-md-x);
}

.--toast-container .--snack.--md .--meta .--tt {
  font-size: var(--text-md);
  font-weight: bold;
}

.--toast-container .--snack.--md .--meta .--tm {
  font-size: calc(var(--text-md) - 1px);
}

.--toast-container .--snack.--md .--snack-btn {
  padding: var(--padding-md);
  border-radius: var(--radius-md);
}

.--toast-container .--snack.--lg {
  --progress-radius: var(--radius-lg);
  border-radius: var(--radius-lg);
  padding: var(--padding-lg-x);
}

.--toast-container .--snack.--lg .--meta .--tt {
  font-size: var(--text-lg);
  font-weight: bold;
}

.--toast-container .--snack.--lg .--meta .--tm {
  font-size: calc(var(--text-lg) - 1px);
}

.--toast-container .--snack.--lg .--snack-btn {
  padding: var(--padding-lg);
  border-radius: var(--radius-lg);
}

.--toast-container .--snack.--xl {
  --progress-radius: var(--radius-xl);
  border-radius: var(--radius-xl);
  padding: var(--padding-xl-x);
}

.--toast-container .--snack.--xl .--meta .--tt {
  font-size: var(--text-xl);
  font-weight: bold;
}

.--toast-container .--snack.--xl .--meta .--tm {
  font-size: calc(var(--text-xl) - 1px);
}

.--toast-container .--snack.--xl .--snack-btn {
  padding: var(--padding-xl);
  border-radius: var(--radius-xl);
}

.--toast-container .--snack.--xxl {
  --progress-radius: var(--radius-xxl);
  border-radius: var(--radius-xxl);
  padding: var(--padding-xxl-x);
}

.--toast-container .--snack.--xxl .--meta .--tt {
  font-size: var(--text-xxl);
  font-weight: bold;
}

.--toast-container .--snack.--xxl .--meta .--tm {
  font-size: calc(var(--text-xxl) - 1px);
}

.--toast-container .--snack.--xxl .--snack-btn {
  padding: var(--padding-xxl);
  border-radius: var(--radius-xxl);
}

.--toast-container .--snack.--2xl {
  --progress-radius: var(--radius-2xl);
  border-radius: var(--radius-2xl);
  padding: var(--padding-2xl-x);
}

.--toast-container .--snack.--2xl .--meta .--tt {
  font-size: var(--text-2xl);
  font-weight: bold;
}

.--toast-container .--snack.--2xl .--meta .--tm {
  font-size: calc(var(--text-2xl) - 1px);
}

.--toast-container .--snack.--2xl .--snack-btn {
  padding: var(--padding-2xl);
  border-radius: var(--radius-2xl);
}

.--toast-container .--snack.--3xl {
  --progress-radius: var(--radius-3xl);
  border-radius: var(--radius-3xl);
  padding: var(--padding-3xl-x);
}

.--toast-container .--snack.--3xl .--meta .--tt {
  font-size: var(--text-3xl);
  font-weight: bold;
}

.--toast-container .--snack.--3xl .--meta .--tm {
  font-size: calc(var(--text-3xl) - 1px);
}

.--toast-container .--snack.--3xl .--snack-btn {
  padding: var(--padding-3xl);
  border-radius: var(--radius-3xl);
}

.--toast-container .--snack.--4xl {
  --progress-radius: var(--radius-4xl);
  border-radius: var(--radius-4xl);
  padding: var(--padding-4xl-x);
}

.--toast-container .--snack.--4xl .--meta .--tt {
  font-size: var(--text-4xl);
  font-weight: bold;
}

.--toast-container .--snack.--4xl .--meta .--tm {
  font-size: calc(var(--text-4xl) - 1px);
}

.--toast-container .--snack.--4xl .--snack-btn {
  padding: var(--padding-4xl);
  border-radius: var(--radius-4xl);
}

.--toast-container .--snack.--5xl {
  --progress-radius: var(--radius-5xl);
  border-radius: var(--radius-5xl);
  padding: var(--padding-5xl-x);
}

.--toast-container .--snack.--5xl .--meta .--tt {
  font-size: var(--text-5xl);
  font-weight: bold;
}

.--toast-container .--snack.--5xl .--meta .--tm {
  font-size: calc(var(--text-5xl) - 1px);
}

.--toast-container .--snack.--5xl .--snack-btn {
  padding: var(--padding-5xl);
  border-radius: var(--radius-5xl);
}

.--toast-container .--snack.--6xl {
  --progress-radius: var(--radius-6xl);
  border-radius: var(--radius-6xl);
  padding: var(--padding-6xl-x);
}

.--toast-container .--snack.--6xl .--meta .--tt {
  font-size: var(--text-6xl);
  font-weight: bold;
}

.--toast-container .--snack.--6xl .--meta .--tm {
  font-size: calc(var(--text-6xl) - 1px);
}

.--toast-container .--snack.--6xl .--snack-btn {
  padding: var(--padding-6xl);
  border-radius: var(--radius-6xl);
}

.--toast-container .--snack.--7xl {
  --progress-radius: var(--radius-7xl);
  border-radius: var(--radius-7xl);
  padding: var(--padding-7xl-x);
}

.--toast-container .--snack.--7xl .--meta .--tt {
  font-size: var(--text-7xl);
  font-weight: bold;
}

.--toast-container .--snack.--7xl .--meta .--tm {
  font-size: calc(var(--text-7xl) - 1px);
}

.--toast-container .--snack.--7xl .--snack-btn {
  padding: var(--padding-7xl);
  border-radius: var(--radius-7xl);
}

.--toast-container .--snack.--8xl {
  --progress-radius: var(--radius-8xl);
  border-radius: var(--radius-8xl);
  padding: var(--padding-8xl-x);
}

.--toast-container .--snack.--8xl .--meta .--tt {
  font-size: var(--text-8xl);
  font-weight: bold;
}

.--toast-container .--snack.--8xl .--meta .--tm {
  font-size: calc(var(--text-8xl) - 1px);
}

.--toast-container .--snack.--8xl .--snack-btn {
  padding: var(--padding-8xl);
  border-radius: var(--radius-8xl);
}

.--toast-container .--snack.--9xl {
  --progress-radius: var(--radius-9xl);
  border-radius: var(--radius-9xl);
  padding: var(--padding-9xl-x);
}

.--toast-container .--snack.--9xl .--meta .--tt {
  font-size: var(--text-9xl);
  font-weight: bold;
}

.--toast-container .--snack.--9xl .--meta .--tm {
  font-size: calc(var(--text-9xl) - 1px);
}

.--toast-container .--snack.--9xl .--snack-btn {
  padding: var(--padding-9xl);
  border-radius: var(--radius-9xl);
}

.--toast-container .--snack .--snack-btn {
  border: none;
  background: var(--snack-btn);
}

.--toast-container .--snack .--snack-btn:not(:disabled) {
  color: #fff;
}

.--toast-container .--snack .--snack-btn:not(:disabled):hover {
  background: var(--snack-btn-hover);
}

.--toast-container .--snack .--snack-btn:disabled {
  opacity: 0.5;
}

.--toast-container .--snack .--ico {
  width: 30px;
  height: 30px;
  background: rgba(0, 0, 0, 0.2);
  border-radius: 10px;
}

.--toast-container .--snack .--ico .--icon {
  font-size: 16px;
}

.--toast-container .--snack .--ico .--no-icon {
  width: 15px;
  height: 15px;
  background: #fff;
  border-radius: 10px;
}

.--toast-container .--snack .--meta {
  flex: 1 1;
}

.--toast-container .--snack .--meta .--tt {
  font-weight: bold;
  opacity: var(--snack-title-opacity);
}

.--toast-container .--snack .--meta .--tm {
  opacity: var(--snack-msg-opacity);
}

.--toast-container .--snack .--actions {
  margin-left: 15px;
}

.--toast-container .--snack.--success {
  background: var(--green-600);
  --snack-hover-shadow: var(--green-700);
}

.--toast-container .--snack.--error {
  background: var(--red-600);
  --snack-hover-shadow: var(--red-700);
}

.--toast-container .--snack.--warn {
  background: var(--orange-600);
  --snack-hover-shadow: var(--red-700);
}

.--toast-container .--snack.--success, .--toast-container .--snack.--error, .--toast-container .--snack.--warn {
  --snack-btn: rgba(0,0,0,0.4);
  --snack-btn-hover: rgba(0,0,0,0.6);
  --progress-bar: rgba(0,0,0,0.4);
  --snack-text-color: #fff;
}

.--toast-container .--snack {
  --progress-height: 4px;
  --progress-track: transparent;
}

.--toast-container .--snack .--progress {
  left: 0px;
  right: 0px;
  bottom: 0px;
}

body {
  --token: var(--surface);
  --token-border: 1px var(--border-primary) solid;
  --token-color: var(--text-primary);
}

.--token.--xs {
  font-size: var(--text-xs);
  line-height: var(--lh-xs, 1.4);
  border-radius: var(--radius-xs);
}

.--token.--xs .--icon {
  margin-left: var(--padding-xs-x);
}

.--token.--sm {
  font-size: var(--text-sm);
  line-height: var(--lh-sm, 1.4);
  border-radius: var(--radius-sm);
}

.--token.--sm .--icon {
  margin-left: var(--padding-sm-x);
}

.--token.--md {
  font-size: var(--text-md);
  line-height: var(--lh-md, 1.4);
  border-radius: var(--radius-md);
}

.--token.--md .--icon {
  margin-left: var(--padding-md-x);
}

.--token.--lg {
  font-size: var(--text-lg);
  line-height: var(--lh-lg, 1.4);
  border-radius: var(--radius-lg);
}

.--token.--lg .--icon {
  margin-left: var(--padding-lg-x);
}

.--token.--xl {
  font-size: var(--text-xl);
  line-height: var(--lh-xl, 1.4);
  border-radius: var(--radius-xl);
}

.--token.--xl .--icon {
  margin-left: var(--padding-xl-x);
}

.--token.--xxl {
  font-size: var(--text-xxl);
  line-height: var(--lh-xxl, 1.4);
  border-radius: var(--radius-xxl);
}

.--token.--xxl .--icon {
  margin-left: var(--padding-xxl-x);
}

.--token.--2xl {
  font-size: var(--text-2xl);
  line-height: var(--lh-2xl, 1.4);
  border-radius: var(--radius-2xl);
}

.--token.--2xl .--icon {
  margin-left: var(--padding-2xl-x);
}

.--token.--3xl {
  font-size: var(--text-3xl);
  line-height: var(--lh-3xl, 1.4);
  border-radius: var(--radius-3xl);
}

.--token.--3xl .--icon {
  margin-left: var(--padding-3xl-x);
}

.--token.--4xl {
  font-size: var(--text-4xl);
  line-height: var(--lh-4xl, 1.4);
  border-radius: var(--radius-4xl);
}

.--token.--4xl .--icon {
  margin-left: var(--padding-4xl-x);
}

.--token.--5xl {
  font-size: var(--text-5xl);
  line-height: var(--lh-5xl, 1.4);
  border-radius: var(--radius-5xl);
}

.--token.--5xl .--icon {
  margin-left: var(--padding-5xl-x);
}

.--token.--6xl {
  font-size: var(--text-6xl);
  line-height: var(--lh-6xl, 1.4);
  border-radius: var(--radius-6xl);
}

.--token.--6xl .--icon {
  margin-left: var(--padding-6xl-x);
}

.--token.--7xl {
  font-size: var(--text-7xl);
  line-height: var(--lh-7xl, 1.4);
  border-radius: var(--radius-7xl);
}

.--token.--7xl .--icon {
  margin-left: var(--padding-7xl-x);
}

.--token.--8xl {
  font-size: var(--text-8xl);
  line-height: var(--lh-8xl, 1.4);
  border-radius: var(--radius-8xl);
}

.--token.--8xl .--icon {
  margin-left: var(--padding-8xl-x);
}

.--token.--9xl {
  font-size: var(--text-9xl);
  line-height: var(--lh-9xl, 1.4);
  border-radius: var(--radius-9xl);
}

.--token.--9xl .--icon {
  margin-left: var(--padding-9xl-x);
}

.--token {
  background: var(--token);
  border: var(--token-border);
  color: var(--token-color);
  --icon-color-1: var(--token-color);
  --icon-color-2: rgb(from var(--icon-color-1) r g b / var(--icon-alpha, 0.5));
}

.--token .--token-value {
  white-space: pre;
  flex: 1 1;
}

.--token .--token-value .--value {
  white-space: pre;
}

.--token .--token-value .--sub-value {
  font-size: 70%;
  opacity: 0.5;
}

.--token .--button {
  aspect-ratio: 1/1;
  width: 20px;
  padding: 0px 3px;
}

.--token .--button svg path {
  fill: var(--token-color);
}

body {
  --tooltip: #222;
  --tooltip-color: #fafafa;
  --tooltip-font-size: 12px;
  --tooltip-font-weight: normal;
  --tooltip-radius: 20px;
  --tooltip-padding: 2px 4px;
  --tooltip-arrow-size: 10px;
}

[color-scheme=dark] body {
  --tooltip: #eaeaea;
  --tooltip-color: #111;
}

.--tooltip {
  background: var(--tooltip);
  color: var(--tooltip-color);
  font-size: var(--tooltip-font-size);
  font-weight: var(--tooltip-font-weight);
  border-radius: var(--tooltip-radius);
  padding: var(--tooltip-padding);
  z-index: var(--max-z-index);
  overflow: visible;
  pointer-events: none;
  -webkit-user-select: none;
          user-select: none;
  position-visibility: anchor-visible;
  filter: drop-shadow(1px 0px 0px var(--tooltip-border-color)) drop-shadow(-1px 0px 0px var(--tooltip-border-color)) drop-shadow(0px 1px 0px var(--tooltip-border-color)) drop-shadow(0px -1px 0px var(--tooltip-border-color));
}

.--tooltip.--xs {
  --tooltip-font-size: var(--text-xs);
  --tooltip-padding: var(--padding-xs);
}

.--tooltip.--sm {
  --tooltip-font-size: var(--text-sm);
  --tooltip-padding: var(--padding-sm);
}

.--tooltip.--md {
  --tooltip-font-size: var(--text-md);
  --tooltip-padding: var(--padding-md);
}

.--tooltip.--lg {
  --tooltip-font-size: var(--text-lg);
  --tooltip-padding: var(--padding-lg);
}

.--tooltip.--xl {
  --tooltip-font-size: var(--text-xl);
  --tooltip-padding: var(--padding-xl);
}

.--tooltip.--xxl {
  --tooltip-font-size: var(--text-xxl);
  --tooltip-padding: var(--padding-xxl);
}

.--tooltip.--2xl {
  --tooltip-font-size: var(--text-2xl);
  --tooltip-padding: var(--padding-2xl);
}

.--tooltip.--3xl {
  --tooltip-font-size: var(--text-3xl);
  --tooltip-padding: var(--padding-3xl);
}

.--tooltip.--4xl {
  --tooltip-font-size: var(--text-4xl);
  --tooltip-padding: var(--padding-4xl);
}

.--tooltip.--5xl {
  --tooltip-font-size: var(--text-5xl);
  --tooltip-padding: var(--padding-5xl);
}

.--tooltip.--6xl {
  --tooltip-font-size: var(--text-6xl);
  --tooltip-padding: var(--padding-6xl);
}

.--tooltip.--7xl {
  --tooltip-font-size: var(--text-7xl);
  --tooltip-padding: var(--padding-7xl);
}

.--tooltip.--8xl {
  --tooltip-font-size: var(--text-8xl);
  --tooltip-padding: var(--padding-8xl);
}

.--tooltip.--9xl {
  --tooltip-font-size: var(--text-9xl);
  --tooltip-padding: var(--padding-9xl);
}

.--tooltip:before {
  content: "";
  position: absolute;
  width: var(--tooltip-arrow-size);
  height: var(--tooltip-arrow-size);
  border-radius: calc(var(--tooltip-arrow-size) / 2.5);
  background: var(--tooltip);
  z-index: 0;
}

.--tooltip .--text {
  z-index: 1;
  white-space: pre;
}

.--tooltip.--top {
  bottom: anchor(top);
  left: anchor(center);
}

.--tooltip.--top:before {
  bottom: -0.2lh;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
}

.--tooltip.--bottom {
  top: anchor(bottom);
  left: anchor(center);
}

.--tooltip.--bottom:before {
  top: -0.2lh;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
}

.--tooltip.--left {
  right: anchor(left);
  top: anchor(center);
}

.--tooltip.--left:before {
  right: -0.15lh;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
}

.--tooltip.--right {
  left: anchor(right);
  top: anchor(center);
}

.--tooltip.--right:before {
  left: -0.15lh;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
}

body {
  --treenode-root-label-icon-size: var(--treenode-label-icon-size);
  --treenode-root-label-font-weight: normal;
  --treenode-root-margin: 10px;
  --treeview-gap: 6px;
  --treenode-gap: 2px;
  --treenode-arrow-btn-size: 20px;
  --treenode-arrow-btn-opacity: 1;
  --treenode-arrow-icon-size: 12px;
  --treenode-arrow-icon-color: #111;
  --treenode-label-padding: 3px 6px;
  --treenode-label-radius: 3px 6px;
  --treenode-label-hover: #f1f1f1;
  --treenode-label-bg: transparent;
  --treenode-label-selected-bg: #eee;
  --treenode-label-selected-color: #111;
  --treenode-label-icon-color: #111;
  --treenode-label-icon-size: 15px;
  --treenode-label-color: #111;
  --treenode-label-size: 15px;
  --treenode-label-gap: 6px;
  --treenode-sub-margin: 20px;
  --treenode-icon-color: #111;
}

.--treeview {
  gap: var(--treeview-gap);
  width: 100%;
}

.--treeview .--treenode.--is-root:not(:first-child) {
  margin-top: var(--treenode-root-margin);
}

.--treeview .--treenode.--is-root .--node .--node-meta .--node-icon.--icon-root {
  font-size: var(--treenode-root-label-icon-size);
}

.--treeview .--treenode.--is-root .--node .--node-label-root {
  font-weight: var(--treenode-root-label-font-weight);
}

.--treeview .--treenode .--node {
  gap: var(--treenode-gap);
}

.--treeview .--treenode .--node .--node-aro-btn {
  width: var(--treenode-arrow-btn-size);
  height: var(--treenode-arrow-btn-size);
  border: 0px;
  background: rgba(0, 0, 0, 0);
  opacity: var(--treenode-arrow-btn-opacity);
  transition: all 0.4s linear 0s;
}

.--treeview .--treenode .--node .--node-aro-btn:hover {
  opacity: 1;
}

.--treeview .--treenode .--node .--node-aro-btn:disabled {
  filter: grayscale(1);
  opacity: 0;
}

.--treeview .--treenode .--node .--node-aro-btn .--node-aro-icon {
  font-size: var(--treenode-arrow-icon-size);
  --icon-color-1: var(--treenode-icon-color);
  --icon-color-2: rgb(from var(--icon-color-1) r g b / var(--icon-alpha, 0.5));
}

.--treeview .--treenode .--node .--node-aro-btn .--node-aro-icon:not(.--skeleton) {
  color: var(--treenode-arrow-icon-color);
}

.--treeview .--treenode .--node .--node-aro-btn .--node-aro-icon:not(.--skeleton) svg {
  fill: var(--treenode-arrow-icon-color);
}

.--treeview .--treenode .--node .--node-aro-btn svg {
  fill: var(--treenode-arrow-icon-color);
}

.--treeview .--treenode .--node .--node-meta {
  background: rgba(0, 0, 0, 0);
  gap: var(--treenode-label-gap);
  border: 0px;
}

.--treeview .--treenode .--node .--node-meta .--node-icon {
  font-size: var(--treenode-label-icon-size);
  min-width: var(--treenode-label-icon-size) !important;
  --icon-color-1: var(--treenode-icon-color);
  --icon-color-2: rgb(from var(--icon-color-1) r g b / var(--icon-alpha, 0.5));
}

.--treeview .--treenode .--node .--node-meta .--node-icon:not(.--skeleton) {
  color: var(--treenode-label-icon-color);
}

.--treeview .--treenode .--node .--node-meta .--node-label {
  font-size: var(--treenode-label-size);
  padding: var(--treenode-label-padding);
  border-radius: var(--treenode-label-radius);
  cursor: pointer;
}

.--treeview .--treenode .--node .--node-meta .--node-label:not(.--skeleton) {
  background: var(--treenode-label-bg);
  color: var(--treenode-label-color);
}

.--treeview .--treenode .--node .--node-meta:hover .--node-label {
  background: var(--treenode-label-hover);
}

.--treeview .--treenode .--node.--selected .--node-meta .--node-label:not(.--skeleton) {
  background: var(--treenode-label-selected-bg);
  color: var(--treenode-label-selected-color);
}

.--treeview .--treenode .--sub-node {
  margin-top: var(--treeview-gap);
  gap: var(--treeview-gap);
  padding-left: var(--treenode-sub-margin);
}

*, *::before, *::after {
  box-sizing: border-box;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

button {
  -webkit-user-select: none;
          user-select: none;
  cursor: pointer;
}

input {
  -webkit-user-select: none;
          user-select: none;
}

input:-webkit-autofill {
  background-color: rgba(0, 0, 0, 0) !important;
  box-shadow: 0 0 0px 1000px rgba(0, 0, 0, 0) inset;
}

body {
  --background: #e6eaf2;
  --background-hover: #dde2ec;
  --surface: #fff;
  --surface-hover: #f6f6f6;
  --muted: #fff;
  --muted-hover: #f6f6f6;
  --text-primary: #111;
  --text-primary-hover: #222;
  --text-primary-disabled: #989898;
  --text-primary-inverted: #fff;
  --text-secondary: #444;
  --text-secondary-hover: #666;
  --border-primary: #ddd;
  --scrollbar-color: #777 transparent;
  --stripe-bg-a: #f5f5f5;
  --stripe-bg-b: #e0e0e0;
  --stripe-overlay-a: rgba(255, 255, 255, 0);
  --stripe-overlay-b: rgba(0, 0, 0, 0.05);
  interpolate-size: allow-keywords;
  --blueprint-base: black;
  --blueprint-color: rgba(0, 0, 0, var(--blueprint-opacity, 0.2));
  --blueprint-extension: 30px;
  --blueprint-dash-size: 5px;
  --blueprint-fade-stop: 90%;
  --skeleton-bg: #eceff4;
  --skeleton-highlight: rgba(255, 255, 255, 0.75);
  --skeleton-duration: 1.25s;
  --shimmer-angle: 20deg;
  --stripe-angle: 45deg;
}

[color-scheme=dark] body {
  --background: #131313;
  --background-hover: #222;
  --surface: #1e1f20;
  --surface-hover: #292a2c;
  --muted: #272829;
  --muted-hover: #2e2f31;
  --text-primary: #fff;
  --text-primary-inverted: #111;
  --text-primary-hover: #f6f6f6;
  --text-primary-disabled: #6d6d6d;
  --text-secondary: #e3e3e3;
  --text-secondary-hover: #d8d8d8;
  --border-primary: #333;
  --zuz-shadow: 0px 0px 0px 1px #252525, 0px 0px 6px #232323;
  --scrollbar-color: rgb(187, 187, 187) transparent;
  --stripe-bg-a: #f5f5f5;
  --stripe-bg-b: #e0e0e0;
  --stripe-overlay-a: rgba(255, 255, 255, 0.05);
  --stripe-overlay-b: rgba(0, 0, 0, 0.1);
  --blueprint-base: black;
  --blueprint-color: rgba(255, 255, 255, var(--blueprint-opacity, 0.2));
  --skeleton-bg: #2a2c2f;
  --skeleton-highlight: rgba(255, 255, 255, 0.14);
}

.--skeleton {
  position: relative;
  overflow: hidden;
  -webkit-user-select: none;
          user-select: none;
  pointer-events: none;
  color: rgba(0, 0, 0, 0) !important;
  caret-color: rgba(0, 0, 0, 0);
  border-color: rgba(0, 0, 0, 0) !important;
  box-shadow: none !important;
  background: var(--skeleton-bg) !important;
  width: var(--skeleton-width, var(--skeleton-default-size, auto));
  height: var(--skeleton-height, var(--skeleton-default-size, auto));
  border-radius: var(--skeleton-radius, inherit);
}

.--skeleton::after {
  content: "";
  position: absolute;
  top: -100%;
  bottom: -100%;
  left: -150%;
  width: 70%;
  pointer-events: none;
  background: linear-gradient(90deg, transparent 0%, var(--skeleton-highlight) 45%, transparent 100%);
  animation: shimmering var(--skeleton-duration) linear infinite;
}

.--skeleton > * {
  visibility: hidden !important;
}

.--skeleton.--skeleton-circle {
  border-radius: 9999px !important;
}

.--no-scroll {
  overflow: hidden;
}

[aria-hidden=true]:not(.monaco-editor *):not(.monaco-aria-container) {
  -webkit-user-select: none;
          user-select: none;
  pointer-events: none;
  cursor: auto;
}

body {
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius: 8px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 20px;
  --radius-xxl: 32px;
  --radius-2xl: 32px;
  --radius-3xl: 48px;
  --radius-4xl: 64px;
  --radius-5xl: 64px;
  --radius-6xl: 96px;
  --radius-7xl: 128px;
  --radius-8xl: 128px;
  --radius-9xl: 256px;
  --padding-xs: 2px 4px;
  --padding-sm: 4px 8px;
  --padding-md: 8px 12px;
  --padding-lg: 16px 32px;
  --padding-xl: 24px 48px;
  --padding-2xl: 32px 64px;
  --padding-3xl: 48px 96px;
  --padding-4xl: 64px 128px;
  --padding-5xl: 64px 128px;
  --padding-6xl: 96px 256px;
  --padding-7xl: 128px 256px;
  --padding-8xl: 128px 256px;
  --padding-9xl: 256px 512px;
  --padding-xs-x: 2px;
  --padding-sm-x: 4px;
  --padding-md-x: 8px;
  --padding-lg-x: 16px;
  --padding-xl-x: 24px;
  --padding-xs-y: 4px;
  --padding-sm-y: 8px;
  --padding-md-y: 16px;
  --padding-lg-y: 32px;
  --padding-xl-y: 48px;
  --padding: var(--padding-md);
  --gap-xs: 4px;
  --gap-sm: 8px;
  --gap-md: 16px;
  --gap-lg: 24px;
  --gap-xl: 40px;
  --gap-2xl: 64px;
  --gap-3xl: 96px;
  --gap-4xl: 128px;
  --gap-5xl: 128px;
  --gap-6xl: 256px;
  --gap-7xl: 256px;
  --gap-8xl: 256px;
  --text-xs: 12px;
  --lh-xs: 1.2;
  --text-sm: 13px;
  --lh-sm: 1.4;
  --text-md: 14px;
  --lh-md: 1.5;
  --text-lg: 18px;
  --lh-lg: 1.5;
  --text-xl: 24px;
  --lh-xl: 1.3;
  --text-xxl: 32px;
  --lh-xxl: 1.2;
  --text-2xl: 32px;
  --lh-2xl: 1.2;
  --text-3xl: 48px;
  --lh-3xl: 1.1;
  --text-4xl: 64px;
  --lh-4xl: 1.1;
  --text-5xl: 64px;
  --lh-5xl: 1.1;
  --text-6xl: 96px;
  --lh-6xl: 1.1;
  --text-7xl: 128px;
  --lh-7xl: 1.1;
  --text-8xl: 128px;
  --lh-8xl: 1.1;
  --text-9xl: 256px;
  --lh-9xl: 1.1;
  --control-height-xs: calc((var(--text-xs) * var(--lh-xs)) + (var(--padding-xs-x) * 2) + 2px);
  --control-height-sm: calc((var(--text-sm) * var(--lh-sm)) + (var(--padding-sm-x) * 2) + 2px);
  --control-height-md: calc((var(--text-md) * var(--lh-md)) + (var(--padding-md-x) * 2) + 2px);
  --control-height-lg: calc((var(--text-lg) * var(--lh-lg)) + (var(--padding-lg-x) * 2) + 2px);
  --control-height-xl: calc((var(--text-xl) * var(--lh-xl)) + (var(--padding-xl-x) * 2) + 2px);
  --control-height-xxl: calc((var(--text-xxl) * var(--lh-xxl)) + (var(--padding-xl-x) * 2) + 2px);
  --control-height-2xl: calc((var(--text-2xl) * var(--lh-2xl)) + (var(--padding-xl-x) * 2) + 2px);
  --control-height-3xl: calc((var(--text-3xl) * var(--lh-3xl)) + (var(--padding-xl-x) * 2) + 2px);
  --control-height-4xl: calc((var(--text-4xl) * var(--lh-4xl)) + (var(--padding-xl-x) * 2) + 2px);
  --control-height-5xl: calc((var(--text-5xl) * var(--lh-5xl)) + (var(--padding-xl-x) * 2) + 2px);
  --control-height-6xl: calc((var(--text-6xl) * var(--lh-6xl)) + (var(--padding-xl-x) * 2) + 2px);
  --control-height-7xl: calc((var(--text-7xl) * var(--lh-7xl)) + (var(--padding-xl-x) * 2) + 2px);
  --control-height-8xl: calc((var(--text-8xl) * var(--lh-8xl)) + (var(--padding-xl-x) * 2) + 2px);
  --control-height-9xl: calc((var(--text-9xl) * var(--lh-9xl)) + (var(--padding-xl-x) * 2) + 2px);
  --max-z-index: 2147483647;
  --zuz-shadow: 0px 0px 0px 1px #d4d4d4, 0px 0px 6px #ccc;
  --grid-line-y: rgba(71,85,105,0.22);
  --grid-line-x: rgba(148,163,184,0.16);
  --grid-size: 3em;
  --primary-25: rgb(from var(--primary) r g b / 0.25);
  --primary25: rgb(from var(--primary) r g b / 0.25);
  --surface-25: rgb(from var(--surface) r g b / 0.25);
  --surface25: rgb(from var(--surface) r g b / 0.25);
  --muted-25: rgb(from var(--muted) r g b / 0.25);
  --muted25: rgb(from var(--muted) r g b / 0.25);
  --text-primary-25: rgb(from var(--text-primary) r g b / 0.25);
  --text-primary-inverted-25: rgb(from var(--text-primary-inverted) r g b / 0.25);
  --border-primary-25: rgb(from var(--border-primary) r g b / 0.25);
  --primary-50: rgb(from var(--primary) r g b / 0.5);
  --primary50: rgb(from var(--primary) r g b / 0.5);
  --surface-50: rgb(from var(--surface) r g b / 0.5);
  --surface50: rgb(from var(--surface) r g b / 0.5);
  --muted-50: rgb(from var(--muted) r g b / 0.5);
  --muted50: rgb(from var(--muted) r g b / 0.5);
  --text-primary-50: rgb(from var(--text-primary) r g b / 0.5);
  --text-primary-inverted-50: rgb(from var(--text-primary-inverted) r g b / 0.5);
  --border-primary-50: rgb(from var(--border-primary) r g b / 0.5);
  --primary-75: rgb(from var(--primary) r g b / 0.75);
  --primary75: rgb(from var(--primary) r g b / 0.75);
  --surface-75: rgb(from var(--surface) r g b / 0.75);
  --surface75: rgb(from var(--surface) r g b / 0.75);
  --muted-75: rgb(from var(--muted) r g b / 0.75);
  --muted75: rgb(from var(--muted) r g b / 0.75);
  --text-primary-75: rgb(from var(--text-primary) r g b / 0.75);
  --text-primary-inverted-75: rgb(from var(--text-primary-inverted) r g b / 0.75);
  --border-primary-75: rgb(from var(--border-primary) r g b / 0.75);
}

[style*="--fx-x"], [style*="--fx-y"], [style*="--fx-enter-x"], [style*="--fx-enter-y"] {
  translate: calc(var(--fx-x, 0px) + var(--fx-enter-x, 0px)) calc(var(--fx-y, 0px) + var(--fx-enter-y, 0px));
}

.--has-error:not(.--select), .--with-error:not(.--select), .input-with-error {
  box-shadow: inset 0px 0px 0px 1px #ff8b8b;
}

.--select.--with-error .--select-display {
  box-shadow: 0px 0px 0px 1px #ff8b8b;
  border-radius: inherit;
}

.abc, .fixed.abc, .--abs.--abc, .--abs.abc, .abs.--abc, .abs.abc, .center-h, .--center-x, .--center-y, .center-v, .abs {
  --fx-x: 0px;
  --fx-y: 0px;
}

.abc, .fixed.abc, .--abs.--abc, .--abs.abc, .abs.--abc, .abs.abc {
  top: 50%;
  left: 50%;
  --abc-x: -50%;
  --abc-y: -50%;
  translate: calc(var(--abc-x) + var(--fx-x, 0px) + var(--fx-enter-x, 0px)) calc(var(--abc-y) + var(--fx-y, 0px) + var(--fx-enter-y, 0px));
}

.--center-x, .center-h {
  left: 50%;
  --abc-x: -50%;
  translate: calc(var(--abc-x) + var(--fx-x, 0px) + var(--fx-enter-x, 0px)) calc(var(--fx-y, 0px) + var(--fx-enter-y, 0px));
}

.--center-y, .center-v {
  top: 50%;
  --abc-y: -50%;
  translate: calc(var(--fx-x, 0px) + var(--fx-enter-x, 0px)) calc(var(--abc-y) + var(--fx-y, 0px) + var(--fx-enter-y, 0px));
}

.--sticky {
  position: sticky;
}

.--no-shrink {
  flex-shrink: 0;
}

.flex {
  display: flex;
  min-width: 0;
}

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

.flex.ass {
  align-self: flex-start;
}

.flex.asc {
  align-self: center;
}

.flex.ase {
  align-self: flex-end;
}

.flex.aic {
  align-items: center;
}

.flex.aie {
  align-items: flex-end;
}

.flex.jcc {
  justify-content: center;
}

.flex.jce {
  justify-content: flex-end;
}

.flex.jcs {
  justify-content: flex-start;
}

.flex.wrap {
  flex-wrap: wrap;
}

.--flex {
  display: flex;
  min-width: 0;
}

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

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

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

.--flex.--ass {
  align-self: flex-start;
}

.--flex.--asc {
  align-self: center;
}

.--flex.--ase {
  align-self: flex-end;
}

.--flex.--aic {
  align-items: center;
}

.--flex.--aie {
  align-items: flex-end;
}

.--flex.--aib {
  align-items: baseline;
}

.--flex.--jcc {
  justify-content: center;
}

.--flex.--jce {
  justify-content: flex-end;
}

.--flex.--jcs {
  justify-content: flex-start;
}

.--flex.--jcb {
  justify-content: space-between;
}

.--flex.--wrap {
  flex-wrap: wrap;
}

.flex-inline {
  display: inline-flex;
}

.--abs, .abs {
  position: absolute;
}

.fixed {
  position: fixed;
}

.fill {
  top: 0px;
  left: 0px;
  bottom: 0px;
  right: 0px;
  inset: 0;
}

.fillx {
  top: -10px;
  left: -10px;
  bottom: -10px;
  right: -10px;
}

.tar {
  text-align: right;
}

.tac {
  text-align: center;
}

.tal {
  text-align: left;
}

.taj {
  text-align: justify;
}

.--grid, .grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.nope {
  pointer-events: none;
}

.nous {
  -webkit-user-select: none;
          user-select: none;
}

.rel {
  position: relative;
}

.bold {
  font-weight: bold;
}

.text-wrap, .ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.no-overflow {
  overflow: hidden;
}

.w-full {
  width: 100%;
}

.h-full {
  height: 100%;
}

.dim-0 {
  opacity: 0;
}

.dim-25 {
  opacity: 0.25;
}

.dim-50 {
  opacity: 0.5;
}

.dim-75 {
  opacity: 0.75;
}

.dim-100 {
  opacity: 1;
}

.--line-clamp {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-clamp: var(--line-count, 1);
  -webkit-line-clamp: var(--line-count, 1);
}

.--is-busy {
  position: relative;
  overflow: hidden;
  z-index: 0;
}

.--is-busy::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: -50%;
  top: -50%;
  width: 200%;
  height: 200%;
  background-color: rgba(0, 0, 0, 0);
  background-repeat: no-repeat;
  background-size: 50% 50%, 50% 50%;
  background-position: 0 0, 100% 0, 100% 100%, 0 100%;
  background-image: linear-gradient(var(--primary), var(--primary));
  animation: rotate-border 2s linear infinite;
}

.--is-busy::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: 2px;
  top: 2px;
  width: calc(100% - 4px);
  height: calc(100% - 4px);
  background: inherit;
  border-radius: inherit;
}

@keyframes rotate-border {
  100% {
    transform: rotate(1turn);
  }
}
.--has-stripes {
  position: relative;
  overflow: hidden;
}

.--has-stripes.--stripes-background {
  background: repeating-linear-gradient(var(--stripe-bg-angle, var(--stripe-angle)), var(--stripe-bg-a), var(--stripe-bg-a) 10px, var(--stripe-bg-b) 10px, var(--stripe-bg-b) 20px);
  color: #999;
}

.--has-stripes.--stripes-background:disabled {
  cursor: not-allowed;
  opacity: 0.7;
  pointer-events: none;
}

.--has-stripes.--stripes-overlay::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
  pointer-events: none;
  background: repeating-linear-gradient(var(--stripe-overlay-angle, var(--stripe-angle)), var(--stripe-overlay-a), var(--stripe-overlay-a) 15px, var(--stripe-overlay-b) 15px, var(--stripe-overlay-b) 30px);
  cursor: not-allowed;
  opacity: 0.7;
  pointer-events: none;
}

.--ui-blueprint {
  pointer-events: none;
}

.--ui-blueprint > * {
  pointer-events: auto;
}

.--ui-blueprint.--ui-ext-10 {
  --blueprint-extension: 10px;
}

.--ui-blueprint.--ui-ext-20 {
  --blueprint-extension: 20px;
}

.--ui-blueprint.--ui-ext-30 {
  --blueprint-extension: 30px;
}

.--ui-blueprint.--ui-ext-40 {
  --blueprint-extension: 40px;
}

.--ui-blueprint.--ui-ext-50 {
  --blueprint-extension: 50px;
}

.--ui-blueprint {
  --all-lines: var(--blueprint-color);
  --t: var(--all-lines);
  --b: var(--all-lines);
  --l: var(--all-lines);
  --r: var(--all-lines);
}

.--ui-blueprint.--bp-top {
  --b: transparent;
  --l: transparent;
  --r: transparent;
}

.--ui-blueprint.--bp-bottom {
  --t: transparent;
  --l: transparent;
  --r: transparent;
}

.--ui-blueprint.--bp-no-top {
  --t: transparent;
}

.--ui-blueprint.--bp-no-bottom {
  --b: transparent;
}

.--ui-blueprint.--bp-no-left {
  --l: transparent;
}

.--ui-blueprint.--bp-no-right {
  --r: transparent;
}

.--ui-blueprint:before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(var(--blueprint-extension) * -1);
  right: calc(var(--blueprint-extension) * -1);
  z-index: 10;
  background-image: linear-gradient(to right, var(--t) 50%, transparent 0), linear-gradient(to right, var(--b) 50%, transparent 0);
  background-size: var(--blueprint-dash-size) 1px;
  background-repeat: repeat-x;
  background-position: top, bottom;
  -webkit-mask-image: linear-gradient(to right, transparent, var(--blueprint-base) calc(100% - var(--blueprint-fade-stop)), var(--blueprint-base) var(--blueprint-fade-stop), transparent);
          mask-image: linear-gradient(to right, transparent, var(--blueprint-base) calc(100% - var(--blueprint-fade-stop)), var(--blueprint-base) var(--blueprint-fade-stop), transparent);
}

.--ui-blueprint:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: calc(var(--blueprint-extension) * -1);
  bottom: calc(var(--blueprint-extension) * -1);
  z-index: 10;
  background-image: linear-gradient(to bottom, var(--l) 50%, transparent 0), linear-gradient(to bottom, var(--r) 50%, transparent 0);
  background-size: 1px var(--blueprint-dash-size);
  background-repeat: repeat-y;
  background-position: left, right;
  -webkit-mask-image: linear-gradient(to bottom, transparent, var(--blueprint-base) calc(100% - var(--blueprint-fade-stop)), var(--blueprint-base) var(--blueprint-fade-stop), transparent);
          mask-image: linear-gradient(to bottom, transparent, var(--blueprint-base) calc(100% - var(--blueprint-fade-stop)), var(--blueprint-base) var(--blueprint-fade-stop), transparent);
}

.--bg-grid {
  background-image: linear-gradient(var(--grid-line-y) 0.1em, transparent 0.1em), linear-gradient(90deg, var(--grid-line-x) 0.1em, transparent 0.1em);
  background-size: var(--grid-size) var(--grid-size);
}

*, *:before, *:after {
  box-sizing: border-box;
}

*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td {
  margin: 0;
  padding: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

fieldset, img {
  border: 0;
}

address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal;
  font-weight: normal;
}

ol, ul, li {
  list-style: none;
}

caption, th {
  text-align: left;
}

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal;
}

div, img, button, input, textarea, select {
  outline: none;
}

strong {
  font-weight: bold;
}

em {
  font-style: italic;
}

a img {
  border: none;
}

button {
  cursor: pointer;
}

@font-face {
  font-family: "Roboto";
  src: url("/fonts/bold.woff2") format("woff2"), url("/fonts/bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto";
  src: url("/fonts/normal.woff2") format("woff2"), url("/fonts/normal.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto";
  src: url("/fonts/black.woff2") format("woff2"), url("/fonts/black.woff") format("woff");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif Pro";
  src: url("/fonts/SourceSerifPro-ExtraLight.woff2") format("woff2");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif Pro";
  src: url("/fonts/SourceSerifPro-ExtraLightIt.woff2") format("woff2");
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif Pro";
  src: url("/fonts/SourceSerifPro-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif Pro";
  src: url("/fonts/SourceSerifPro-LightIt.woff2") format("woff2");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif Pro";
  src: url("/fonts/SourceSerifPro-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif Pro";
  src: url("/fonts/SourceSerifPro-It.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif Pro";
  src: url("/fonts/SourceSerifPro-Semibold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif Pro";
  src: url("/fonts/SourceSerifPro-SemiboldIt.woff2") format("woff2");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif Pro";
  src: url("/fonts/SourceSerifPro-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif Pro";
  src: url("/fonts/SourceSerifPro-BoldIt.woff2") format("woff2");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif Pro";
  src: url("/fonts/SourceSerifPro-Black.woff2") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif Pro";
  src: url("/fonts/SourceSerifPro-BlackIt.woff2") format("woff2");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
body {
  color-scheme: light dark;
  --secondary: #4176e6;
  --radius: 75px;
  --dialog-radius: 40px;
  --radius-md: var(--radius);
  --button-color: var(--text-btn);
  --form-padding: 10px;
  --body-padding: 6px;
  --gap: 20px;
  --grid-size: 160px;
  --sidebar-width: 220px;
  --grid-size-large: calc((100vw - var(--sidebar-width)) / 3.5);
  --text-md: 16px;
  --dialog-action-radius: 30px;
  --dialog-footer-padding: 10px 20px;
  --drawer-radius-h: 30px;
  --calendar-radius-md: 30px;
  --primary: #111;
  --primary-hover: #b2a4a4;
  --background: #f1ece8;
  --surface: #fff;
  --surface-hover: #f6f6f6;
  --muted: #fff;
  --muted-hover: #f6f6f6;
  --text-btn: #fff;
  --text-primary: #111;
  --text-primary-hover: #222;
  --text-secondary: #444;
  --text-secondary-hover: #666;
  --border-primary: #e6d8cd;
  --border-secondary: #eee;
  --cover-bg: rgba(229, 233, 239, 0.9);
  --input: var(--surface);
  --select: var(--input);
  --search-color: var(--input);
  --gradient-bg: linear-gradient(to left, #f5efeb, #faf6f3);
  --grid-item: rgba(255, 255, 255, 0.85);
  --grid-item-b: #fdf8f3;
  --icon-color-1: #4e2400;
  --icon-color-2: rgb(from var(--icon-color-1) r g b/0.5);
}

[color-scheme=dark] body {
  --primary: #fff;
  --primary-hover: #f3eded;
  --background: #131313;
  --surface: #1e1f20;
  --surface-hover: #292a2c;
  --muted: #272829;
  --muted-hover: #2e2f31;
  --text-btn: #111;
  --text-primary: #fff;
  --text-primary-hover: #f6f6f6;
  --text-secondary: #e3e3e3;
  --text-secondary-hover: #d8d8d8;
  --border-primary: #252525;
  --border-secondary: #444;
  --cover-bg: rgba(19, 19, 19, 0.9);
  --input: var(--background);
  --select: var(--input);
  --gradient-bg: linear-gradient(to left, #171717, #181818);
  --grid-item: rgba(255, 255, 255, 0.025);
  --grid-item-b: #202020;
  --icon-color-1: var(--text-primary);
  --icon-color-2: rgb(from var(--icon-color-1) r g b/0.5);
}

html, body {
  background: var(--background);
  color: var(--text-primary);
  font-size: var(--text-md);
}

a {
  color: var(--text-primary);
  -webkit-user-select: none;
          user-select: none;
}

/* Zuz Generated CSS */
.zw007vqk {
  width: 100vw;
}

.zh002jjq {
  height: 100vh;
}

.zf001np7 {
  font-weight: bold;
}

.zf00etom {
  font-size: var(--text-lg);
}

.zf001n0z {
  font-size: var(--text-sm);
}

.zc00eb01 {
  color: var(--muted);
}

.zt00kcz0 {
  text-align: center;
}

.zc00hc20 {
  color: red;
}

.zw00erzf {
  width: 500px;
}

.zp003pzj {
  padding: 20px;
}

.zb000i3h {
  border-radius: var(--radius);
}

.zd00bc0j {
  display: flex;
}

.za009bpl {
  align-items: center;
}

.zj005put {
  justify-content: center;
}

.zf00dt21 {
  flex-direction: column;
}

.zf000hmx {
  font-size: var(--text-2xl);
}

.zm00gqm3 {
  margin-top: 25px;
}

.zf003296 {
  font-size: var(--text-3xl);
}

.zm00im1j {
  margin-bottom: 10px;
}

.zp00bfua {
  padding: 50px;
}

.zf007gro {
  font-size: var(--text-md);
}

.zg00818v {
  gap: 10px;
}

.zm00c9h2 {
  margin-top: 20px;
}

.zg00bajn {
  gap: 5px;
}

.zf005oht {
  font-size: 48px;
}

.zm00l6ns {
  margin-bottom: 20px;
}

.zf00e5gc {
  font-size: 16px;
}

.zp0077xb {
  position: relative;
}

.zz0097k0 {
  z-index: 3;
}

.zw000esk {
  width: 100%;
}

.zp005x8j {
  padding: 20vh 20px 20px 20px;
}

.zf00afsr {
  font-size: 24px;
}

.zf00kfq6 {
  font-size: 18px;
}

.zh00j3hs {
  height: 10px;
}

.zp002hc0 {
  padding: 40px 25px;
}

.zz00lr8f {
  z-index: 99;
}

.zp00kixz:ph {
  padding: 20px;
}

.zh00c246 {
  height: 70px;
}

.zf0052em {
  flex: 1 1;
}

.zf00lcdz {
  font-size: var(--text-xl);
}

.zw00jica {
  width: 40px;
}

.zt00acjc {
  text-decoration: none;
}

.zg003750 {
  gap: 6px;
}

.zp00m92a {
  position: absolute;
}

.zt00e8sr {
  top: 20px;
}

.zl0004gz {
  left: 20px;
}

.zl005yjn {
  left: 50%;
  --abc-x: -50%;
  translate: calc(var(--abc-x) + var(--fx-x, 0px) + var(--fx-enter-x, 0px)) calc(var(--fx-y, 0px) + var(--fx-enter-y, 0px));
}

.zm0038ht {
  margin-right: 20px;
}

.zb00fxmq {
  background: var(--background);
}

.zz00cka9 {
  z-index: 9999;
}

.zw0026ho {
  width: 60px;
}

.zm00eu3b {
  margin-top: 30px;
}

.zp0015da {
  padding: 10px;
}

.zb009wcl {
  border-bottom: 1px var(--border-primary) solid;
}

.zb005y2z {
  background: var(--surface);
}

.zp00jm9n {
  padding-left: 6px;
}

.zl00451p {
  line-height: 1;
}

.zm00kv33 {
  min-width: 350px;
}

.zw0038r4 {
  width: var(--grid-size);
}

.za00b2rv {
  aspect-ratio: 1/1;
}

.zb00idkr {
  border-radius: 200px;
}

.zt003a1q {
  transition: all 0.1s ease-in-out 0s;
}

.zc00av3h {
  cursor: pointer;
}

.zb00lqkt:hover {
  box-shadow: 0px 0px 0px 2px var(--blue-400);
}

.zs0051x6:hover {
  scale: 1.01;
}

.zo00kzjy:hover .--ntx {
  opacity: 1;
}

.zb006nki {
  border: 2px var(--border-primary) dashed;
}

.zb00jdtw {
  border: 2px var(--border-primary) solid;
}

.zb003004 {
  background: var(--grid-item);
}

.zp001fbw {
  padding: 0px !important;
}

.zm001ci3 {
  max-width: 20px;
}

.zp0075pt {
  padding-top: 25px;
  padding-bottom: 25px;
}

.zw001e7z {
  width: 98%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.zc00kxqu {
  color: var(--text-primary) !important;
}

.zp006zxe {
  padding: 5px;
}

.zp00h5ei {
  padding: 0px 5px;
}

.zw00ed3s {
  width: 20px;
}

.zt005nyr {
  transition: all 0.15s ease-in-out 0s;
}

.zb00bk96 {
  background: var(--surface) !important;
}

.zb00fadc:hover {
  background: var(--surface-50) !important;
}

.zg00izlv {
  gap: 6px !important;
}

.zo007yoe {
  overflow: hidden;
}

.zp00ldlv {
  padding: 6px;
}

.zh00cc36 {
  height: calc(100vh - 12px);
}

.zb00e886 {
  background: var(--gradient-bg);
}

.zb00bz4b {
  border-radius: 20px;
}

.zb00ld1f {
  border: var(--border-primary) 1px solid;
}

.zh00m5bq {
  height: calc(100vh - 70px);
}

.zf005mvf {
  font-size: var(--text-4xl);
}

.zm00jzbt {
  margin-top: 50px;
}

.zw00jrxm {
  width: 400px;
}

.zp0058l6 {
  padding-left: 5px;
}

.zf004n6m {
  font-size: var(--text-xs);
}

.zm00hf05 {
  margin-top: 20px;
  margin-bottom: 20px;
}

.zb0071qb {
  border: 1px var(--border-primary) solid;
}

.zb00bxgb {
  border-radius: var(--radius-md);
}

.zb004idu {
  background: var(--input);
}

.zb00j173:hover {
  box-shadow: 0px 0px 0px 2px var(--blue-600);
}

.zb0043la {
  border-right: 1px var(--border-primary) solid;
}

.zp00874k {
  padding: 25px;
}

.zw009s18 {
  width: 600px;
}

.zm00auef {
  min-height: 100vh;
}

.zu001lhm {
  -webkit-user-select: none;
          user-select: none;
}

.zb0094yb {
  background: var(--grid-item-b);
}

.zw009wcf {
  width: 90px;
}

.zs00jw9n:hover {
  scale: 1.02;
}

.zb00hzl1 {
  borderB: 1px var(--border-primary) solid;
}

.zb003flj {
  borderT: 1px var(--border-primary) solid;
}

.zg00g0pe {
  gap: var(--gap);
}

.zb00m9lb {
  border-radius: 60px;
}

.zt00licf {
  transition: all 0.2s ease-in-out 0s;
}

.zs000qnk:hover {
  scale: 1.025;
}

.zw00hfxl {
  width: 120px;
}

.zb005fsz {
  border-top: 1px var(--border-primary) solid;
}

.zp006als {
  padding: 30px;
}

.zw003sje {
  width: calc(var(--grid-size) * 1.5px);
}

.zf0087ho {
  font-size: var(--text-5xl);
}

.zw00dbgf {
  width: 36px;
}

.zp008v81 {
  padding: 40px;
}

.zf0080dr {
  flex: 2 1;
}

.zb00506z {
  border-left: 1px var(--border-primary) solid;
}

.zp00hk6k {
  padding-left: 25px;
}

.zt00g4lu {
  top: 50%;
  left: 50%;
  --abc-x:-50%;
  --abc-y:-50%;
  translate: calc(var(--abc-x) + var(--fx-x, 0px) + var(--fx-enter-x, 0px)) calc(var(--abc-y) + var(--fx-y, 0px) + var(--fx-enter-y, 0px));
}

.zg00cidw {
  gap: 15px;
}

.zg00ebip {
  gap: 12px;
}

.zm001a6x {
  margin-bottom: 30px;
}

.zm00jb8c {
  margin-top: 35px;
}

.zt00cqk2:hover {
  text-decoration: underline;
}

.zw007g17 {
  width: 320px;
}

.zm003ut6 {
  margin-bottom: 40px;
}

.zm00caix {
  margin: 35px 0px 5px 0px;
}

.zp00lp1v {
  position: fixed;
}

.zr0038ye {
  right: 20px;
}

.zb00llv1 {
  bottom: 20px;
}

.zf00hrpy {
  font-size: 10px;
}

.zw00m2yj {
  width: 50px;
}

.zm0036pp {
  margin-bottom: 25px;
}

.zw00kb4g {
  width: 370px;
}

.zm0027e0 {
  margin: 25px 0px 5px 0px;
}

.zh00mg0w {
  height: calc(100vh - 100px);
}

.zt00f5ya {
  text-transform: capitalize;
}

.zb00jad9 {
  border-radius: var(--radius-lg);
}

.zm009out {
  margin-top: 10px;
}

.zp005mib {
  padding: 15px;
}

.zb00ejqk {
  border-radius: 30px;
}

.zt003is9 {
  top: 0px;
}

.zr00m9ac {
  right: 0px;
}

.zg009heu {
  gap: 8px;
}

.zh004c9f {
  height: 40px;
}

.zp00d17j {
  padding: 4px 6px;
}

.zb0000nm {
  border-radius: 0px 0px 0px 10px;
}

.zb00llv7 {
  border-radius: 0px 30px 0px 0px !important;
}

.zp003cke {
  padding: 4px 6px !important;
}

.zb00884x {
  background: var(--input) !important;
}

.zw007aqw {
  width: 200px;
}

.zw002op8 {
  width: 150px;
}

.zw00cap3 {
  width: 100px;
}

.zc00605n {
  color: var(--blue-600) !important;
}

.zh00fehs {
  height: 1px;
}

.zb00g2nl {
  background: var(--border-primary);
}

.zf0023g6 {
  font-size: var(--text-xl) !important;
}

.zf009xjn {
  font-weight: 900;
}

.zm00jplq {
  margin: 20px 0px 0px 0px;
}

.zc00ljq6 {
  color: var(--red-500);
}

/* Avatar renderer surfaces. Individual avatars remain available under /avatars. */
.orb-call {
  min-height: 100dvh;
  padding: 24px;
  color: #fbf8ff;
  background: radial-gradient(circle at 50% 12%, rgba(116, 105, 226, 0.22), transparent 42%), #120d20;
}

.orb-call__orb {
  width: min(74vw, 390px);
  overflow: visible;
}

.voice-orb__halo {
  fill: none;
  stroke: rgba(220, 212, 255, 0.28);
  stroke-width: 1.4;
  transition: r 0.12s ease-out;
}

.voice-orb__blob {
  transform-origin: 150px 150px;
  animation: voice-orb-morph 8s ease-in-out infinite alternate;
}

.voice-orb__blob--outer {
  fill: url(#orb-gradient);
}

.voice-orb__blob--inner {
  fill: rgba(255, 255, 255, 0.18);
  animation-delay: -3.2s;
}

.voice-orb__gradient-start {
  stop-color: #8068f8;
}

.voice-orb__gradient-mid {
  stop-color: #f36ab4;
}

.voice-orb__gradient-end {
  stop-color: #5ae4d6;
}

.voice-orb__gradient-start,
.voice-orb__gradient-mid,
.voice-orb__gradient-end {
  animation: voice-orb-colors 7s ease-in-out infinite alternate;
}

.voice-orb__gradient-mid {
  animation-delay: -2.3s;
}

.voice-orb__gradient-end {
  animation-delay: -4.6s;
}

[data-emotion=connecting] .voice-orb__gradient-start {
  stop-color: #6d8cff;
}

[data-emotion=connecting] .voice-orb__gradient-mid {
  stop-color: #b579ff;
}

[data-emotion=listening] .voice-orb__gradient-start {
  stop-color: #38d9c5;
}

[data-emotion=listening] .voice-orb__gradient-mid {
  stop-color: #55a9f7;
}

[data-emotion=thinking] .voice-orb__gradient-start {
  stop-color: #f9a95a;
}

[data-emotion=thinking] .voice-orb__gradient-mid {
  stop-color: #d37aff;
}

[data-emotion=speaking] .voice-orb__gradient-start {
  stop-color: #fb5eaa;
}

[data-emotion=speaking] .voice-orb__gradient-mid {
  stop-color: #8b75ff;
}

[data-emotion=speaking] .voice-orb__gradient-end {
  stop-color: #58e6cb;
}

[data-emotion=error] .voice-orb__gradient-start,
[data-emotion=error] .voice-orb__gradient-mid,
[data-emotion=error] .voice-orb__gradient-end {
  stop-color: #ef596b;
}

@keyframes voice-orb-morph {
  to {
    transform: rotate(14deg) scale(1.035);
  }
}
@keyframes voice-orb-colors {
  to {
    stop-color: #ffa1d2;
  }
}
@media (prefers-reduced-motion: reduce) {
  .voice-orb__blob,
  .voice-orb__gradient-start,
  .voice-orb__gradient-mid,
  .voice-orb__gradient-end {
    animation: none;
  }
}
*, body {
  font-family: "Roboto", sans-serif !important;
}

*:not(.--round) {
  corner-shape: squircle;
}

html,
body {
  max-width: 100vw;
  overflow-x: hidden;
  letter-spacing: 0.5px;
}

nextjs-portal {
  display: none;
}

.--dashboard-grid {
  --gap: 15px;
  max-width: calc(var(--grid-size) * 4 + var(--gap) * 3);
}

.--fsp {
  font-family: "Source Serif Pro", "Roboto", sans-serif !important;
  letter-spacing: -1px;
}

.--color,
a {
  color: var(--secondary);
}

.--token {
  padding-left: 5px;
}

.--module-data {
  --table-border: 0px;
}