:root {
  --bui-color-primary: #2290fd;
  --bui-color-primary-dynasty: #c52922;
  --bui-color-primary-ocean: #009ade;
  --bui-color-primary-denza: #e3c373;
  --bui-color-primary-yw: #7973c9;
  --bui-color-primary-fcb: #4582e6;
  --bui-color-danger: #e83010;
  --bui-color-warning: #fa922e;
  --bui-color-success: #16bd33;
  --bui-color-title: #1a1d25;
  --bui-color-text: #7b808d;
  --bui-color-caption: #9ba1af;
  --bui-color-disable: #c2c8d3;
  --bui-color-gray-blue-1: #000000;
  --bui-color-gray-blue-2: #1a1d25;
  --bui-color-gray-blue-3: #3e4047;
  --bui-color-gray-blue-4: #5c606a;
  --bui-color-gray-blue-5: #7b808d;
  --bui-color-gray-blue-6: #9ba1af;
  --bui-color-gray-blue-7: #c2c8d3;
  --bui-color-gray-blue-8: #ced3dc;
  --bui-color-gray-blue-9: #e2e6ed;
  --bui-color-gray-blue-10: #f5f7fa;
  --bui-color-red-1: #450e05;
  --bui-color-red-2: #6e1708;
  --bui-color-red-3: #971f0b;
  --bui-color-red-4: #bf280d;
  --bui-color-red-5: #e83010;
  --bui-color-red-6: #ec5338;
  --bui-color-red-7: #f07560;
  --bui-color-red-8: #f49888;
  --bui-color-red-9: #f7baaf;
  --bui-color-red-10: #fbddd7;
  --bui-color-yellow-1: #4d2907;
  --bui-color-yellow-2: #8a4d0d;
  --bui-color-yellow-3: #a3600f;
  --bui-color-yellow-4: #d68514;
  --bui-color-yellow-5: #4d2907;
  --bui-color-yellow-6: #fba451;
  --bui-color-yellow-7: #fcb674;
  --bui-color-yellow-8: #fdc997;
  --bui-color-yellow-9: #fddbb9;
  --bui-color-yellow-10: #feeddc;
  --bui-color-green-1: #002605;
  --bui-color-green-2: #044d0b;
  --bui-color-green-3: #0b7312;
  --bui-color-green-4: #17991b;
  --bui-color-green-5: #16bd33;
  --bui-color-green-6: #3dc855;
  --bui-color-green-7: #64d377;
  --bui-color-green-8: #8bde99;
  --bui-color-green-9: #b1e9bb;
  --bui-color-green-10: #d8f4dd;
  --bui-color-blue-1: #0a2b4b;
  --bui-color-blue-2: #104478;
  --bui-color-blue-3: #165ea4;
  --bui-color-blue-4: #1c77d1;
  --bui-color-blue-5: #2290fd;
  --bui-color-blue-6: #47a3fd;
  --bui-color-blue-7: #6cb5fe;
  --bui-color-blue-8: #91c8fe;
  --bui-color-blue-9: #91c8fe;
  --bui-color-blue-10: #daedff;
  --bui-color-black: #000000;
  --bui-color-white: #ffffff;
  --bui-color-divider: #e2e6ed;
}

.bui-color-primary {
  color: #2290fd !important;
}

.bui-color-primary-dynasty {
  color: #c52922 !important;
}

.bui-color-primary-ocean {
  color: #009ade !important;
}

.bui-color-primary-denza {
  color: #e3c373 !important;
}

.bui-color-primary-yw {
  color: #7973c9 !important;
}

.bui-color-primary-fcb {
  color: #4582e6 !important;
}

.bui-color-danger {
  color: #e83010 !important;
}

.bui-color-warning {
  color: #fa922e !important;
}

.bui-color-success {
  color: #16bd33 !important;
}

.bui-color-title {
  color: #1a1d25 !important;
}

.bui-color-text {
  color: #7b808d !important;
}

.bui-color-caption {
  color: #9ba1af !important;
}

.bui-color-disable {
  color: #c2c8d3 !important;
}

.bui-color-gray-blue-1 {
  color: #000 !important;
}

.bui-color-gray-blue-2 {
  color: #1a1d25 !important;
}

.bui-color-gray-blue-3 {
  color: #3e4047 !important;
}

.bui-color-gray-blue-4 {
  color: #5c606a !important;
}

.bui-color-gray-blue-5 {
  color: #7b808d !important;
}

.bui-color-gray-blue-6 {
  color: #9ba1af !important;
}

.bui-color-gray-blue-7 {
  color: #c2c8d3 !important;
}

.bui-color-gray-blue-8 {
  color: #ced3dc !important;
}

.bui-color-gray-blue-9 {
  color: #e2e6ed !important;
}

.bui-color-gray-blue-10 {
  color: #f5f7fa !important;
}

.bui-color-red-1 {
  color: #450e05 !important;
}

.bui-color-red-2 {
  color: #6e1708 !important;
}

.bui-color-red-3 {
  color: #971f0b !important;
}

.bui-color-red-4 {
  color: #bf280d !important;
}

.bui-color-red-5 {
  color: #e83010 !important;
}

.bui-color-red-6 {
  color: #ec5338 !important;
}

.bui-color-red-7 {
  color: #f07560 !important;
}

.bui-color-red-8 {
  color: #f49888 !important;
}

.bui-color-red-9 {
  color: #f7baaf !important;
}

.bui-color-red-10 {
  color: #fbddd7 !important;
}

.bui-color-yellow-1 {
  color: #4d2907 !important;
}

.bui-color-yellow-2 {
  color: #8a4d0d !important;
}

.bui-color-yellow-3 {
  color: #a3600f !important;
}

.bui-color-yellow-4 {
  color: #d68514 !important;
}

.bui-color-yellow-5 {
  color: #4d2907 !important;
}

.bui-color-yellow-6 {
  color: #fba451 !important;
}

.bui-color-yellow-7 {
  color: #fcb674 !important;
}

.bui-color-yellow-8 {
  color: #fdc997 !important;
}

.bui-color-yellow-9 {
  color: #fddbb9 !important;
}

.bui-color-yellow-10 {
  color: #feeddc !important;
}

.bui-color-green-1 {
  color: #002605 !important;
}

.bui-color-green-2 {
  color: #044d0b !important;
}

.bui-color-green-3 {
  color: #0b7312 !important;
}

.bui-color-green-4 {
  color: #17991b !important;
}

.bui-color-green-5 {
  color: #16bd33 !important;
}

.bui-color-green-6 {
  color: #3dc855 !important;
}

.bui-color-green-7 {
  color: #64d377 !important;
}

.bui-color-green-8 {
  color: #8bde99 !important;
}

.bui-color-green-9 {
  color: #b1e9bb !important;
}

.bui-color-green-10 {
  color: #d8f4dd !important;
}

.bui-color-blue-1 {
  color: #0a2b4b !important;
}

.bui-color-blue-2 {
  color: #104478 !important;
}

.bui-color-blue-3 {
  color: #165ea4 !important;
}

.bui-color-blue-4 {
  color: #1c77d1 !important;
}

.bui-color-blue-5 {
  color: #2290fd !important;
}

.bui-color-blue-6 {
  color: #47a3fd !important;
}

.bui-color-blue-7 {
  color: #6cb5fe !important;
}

.bui-color-blue-8,
.bui-color-blue-9 {
  color: #91c8fe !important;
}

.bui-color-blue-10 {
  color: #daedff !important;
}

.bui-color-black {
  color: #000 !important;
}

.bui-color-white {
  color: #fff !important;
}

.bui-color-divider {
  color: #e2e6ed !important;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  overflow-x: hidden;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, Helvetica Neue,
    Segoe UI, Helvetica, Arial, PingFang SC, Microsoft YaHei,
    WenQuanYi Micro Hei, sans-serif;
}

body.dark {
  background-color: #000;
}

main.protocol-wrapper {
  font-size: 14px;
  color: var(--bui-color-title);
  line-height: 1.75;
  margin: 20px;
}

main.protocol-wrapper h1 {
  font-size: 20px;
  font-weight: 800;
  text-align: center;
  line-height: 32px;
  margin: 20px 0 40px;
}

main.protocol-wrapper h2,
main.protocol-wrapper h3,
main.protocol-wrapper h4 {
  font-size: 16px;
  line-height: 24px;
  padding: 12px 0;
  font-weight: 600;
}

main.protocol-wrapper p {
  letter-spacing: 0.5px;
  text-align: justify;
  word-break: break-all;
  font-size: 14px;
  color: #5c606a;
  margin-bottom: 12px;
}

main.protocol-wrapper p span {
  font-weight: 700;
}

main.protocol-wrapper a {
  color: var(--bui-color-blue-5);
  text-decoration: none;
}

main.protocol-wrapper table {
  width: 100%;
  border: 1px solid var(--bui-color-title);
  border-collapse: collapse;
  margin-bottom: 16px;
}

main.protocol-wrapper table td,
main.protocol-wrapper table th {
  border: 1px solid var(--bui-color-title);
}

main.protocol-wrapper table th {
  font-weight: 400;
}

main.protocol-wrapper table td {
  padding: 4px;
  word-break: break-all;
}

main.protocol-wrapper table td p {
  margin-bottom: 0;
}

main.protocol-wrapper ul {
  margin-bottom: 16px;
  list-style-type: none;
}

main.protocol-wrapper ul.circle {
  list-style-type: circle;
  padding-left: 16px;
}

main.protocol-wrapper ul.disc {
  list-style-type: disc;
  padding-left: 16px;
}

main.protocol-wrapper ul.square {
  list-style: square;
  padding-left: 16px;
}

body.dark main.protocol-wrapper {
  color: #fffffff2;
}

body.dark main.protocol-wrapper table {
  border: 1px solid rgba(255, 255, 255, 0.95);
}

body.dark main.protocol-wrapper table td,
body.dark main.protocol-wrapper table th {
  border: 1px solid rgba(255, 255, 255, 0.95);
}

@keyframes loading {
  0% {
    transform: rotate(0);
  }

  to {
    transform: rotate(360deg);
  }
}

.bui-button {
  width: 100%;
  height: 40px;
  border-radius: 20px;
  background-color: var(--bui-color-gray-blue-3);
  font-size: 16px;
  color: #fff;
  border: none;
}
