#how {isolation:isolate;clip-path:inset(0)}
#how::before {opacity:.14;mask-image:linear-gradient(180deg,#00000018 0%,#00000066 16%,#000 38%);position:fixed;inset:0;pointer-events:none;z-index:-1;content:"";background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.58' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='2.8' intercept='-.9'/%3E%3CfeFuncG type='linear' slope='2.8' intercept='-.9'/%3E%3CfeFuncB type='linear' slope='2.8' intercept='-.9'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
#compare .cmp-scroll { overflow:visible; border-radius:0; box-shadow:none; }
#compare .cmp { display:table; width:100%; min-width:860px; table-layout:fixed; border-collapse:separate; border-spacing:0; font-size:14px; line-height:1.55; border:1px solid var(--table-line); border-radius:10px; }
#compare .cmp colgroup {display:table-column-group}
#compare .cmp col {display:table-column}
#compare .cmp thead {display:table-header-group}
#compare .cmp tbody {display:table-row-group}
#compare .cmp tr,#compare .cmp thead tr:first-child {display:table-row;padding:0;margin:0;border:0;border-radius:0;background:transparent}
#compare .cmp th,#compare .cmp td,#compare .cmp .cmp-sum td:first-child {display:table-cell;width:auto;border:0;border-radius:0;margin:0;box-shadow:none;vertical-align:top}
#compare .cmp thead tr:first-child > * {position:sticky;top:var(--head);z-index:3;background:var(--table-paper);color:var(--table-ink);padding:21px 18px 18px;border-top:3px solid transparent;border-bottom:1px solid var(--table-line);font-size:16px;box-shadow:0 2px 3px #00000006}
#compare .cmp thead tr:first-child > .mine {background:var(--table-memex);border-top-color:var(--table-accent);color:var(--table-accent)}
#compare .cmp .cmp-sum td {padding:19px 18px 23px;background:var(--table-paper);color:var(--table-soft);font-size:14px;font-weight:400;line-height:1.55;letter-spacing:0}
#compare .cmp .cmp-sum td.mine {background:var(--table-memex);color:var(--table-ink)}
#compare .cmp .cmp-group th {padding:13px 18px;background:var(--table-group);border-top:1px solid var(--table-line);border-bottom:1px solid var(--table-line);box-shadow:none}
#compare .cmp .cmp-tag {color:var(--table-soft);font-size:11px;letter-spacing:.14em;font-weight:650}
#compare .cmp tbody th[scope=row],#compare .cmp tbody td {padding:19px 18px;background:var(--table-paper);border-bottom:1px solid var(--table-line);font-size:14px;line-height:1.55;letter-spacing:0;color:var(--table-soft)}
#compare .cmp tbody th[scope=row] {background:var(--table-label);color:var(--table-ink);font-weight:650;border-right:1px solid var(--table-line)}
#compare .cmp tbody tr:nth-child(odd):not(.cmp-group) td {background:var(--table-alt)}
#compare .cmp tbody td.mine,#compare .cmp tbody:last-of-type tr:last-child td.mine {background:var(--table-memex);box-shadow:none;color:var(--table-ink);border-left:1px solid var(--table-line)}
#compare .cmp tbody tr:nth-child(odd):not(.cmp-group) td.mine {background:var(--table-memex-alt)}
#compare .cmp thead .ch-mark {filter:none}
#compare .cmp .ch-i {color:var(--table-soft)}
#compare .cmp .cmp-col {display:none}
#compare .cmp-note {color:var(--table-soft)}
#compare .cmp-mark {color:var(--table-accent)}

#compare .cmp-row-label {display:flex;align-items:flex-start;gap:9px}
#compare .cmp-row-icon {width:17px;height:17px;flex:0 0 17px;margin-top:3px;color:#52717b;stroke-width:1.65}
#compare .cmp tbody td {border-right:1px solid var(--table-line)}
#compare .cmp tbody td.mine {border-right:0;border-left:0}
#compare .cmp thead tr:first-child>th:not(.mine) {border-right:1px solid var(--table-line)}
#how {
  --ink:#ebe8df;
  --code-ink:#ebe8df;
  --code-ink-soft:#b6c1c2;
  background:
    linear-gradient(180deg,rgba(0,0,0,.7),transparent 38%),
    linear-gradient(180deg,#101617 0%,#171d1e 40%,#1d2526 100%);
  background-attachment:fixed;
}
#how::after {
  content:'';position:absolute;inset:0 0 auto;height:160px;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,#070b0c,transparent);
}

#compare {
  --table-paper:#fffefb;
  --table-alt:#f7f8f6;
  --table-label:#f8fbfc;
  --table-line:#ccd9e0;
  --table-ink:#20303c;
  --table-soft:#607482;
  --table-group:#d8e3e9;
  --table-memex:#e4eef2;
  --table-memex-alt:#e6edf1;
  --table-accent:#1376a3;
  --table-head:#f1f0ea;
  --ink:#20303c;
  --muted:#607482;
  --accent:#1376a3;
  isolation:isolate;
  background-color:#edf4f7;
  background-image:
    radial-gradient(circle at 89% 7%,rgba(0,189,242,.14),transparent 29rem),
    radial-gradient(circle at 55% -5%,rgba(0,189,242,.075),transparent 23rem),
    radial-gradient(circle at 5% 96%,rgba(217,182,87,.16),transparent 31rem);
  background-size:auto;
}
#compare::before {
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  opacity:.28;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
}
#compare .cmp .c-label {width:18%}
#compare .cmp .c-plain,
#compare .cmp .c-plugin {width:23%}
#compare .cmp .c-memex {width:36%}
#compare .cmp thead tr:first-child > * {
  background-color:var(--table-head);
  background-image:linear-gradient(180deg,rgba(255,255,255,.55),rgba(0,0,0,.022));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.84),0 1px 0 #b7c7d0;
  border-top-color:#808080;
}
#compare .cmp thead tr:first-child > .mine {
  background-color:var(--table-head);
  color:var(--table-accent);
  border-top-color:var(--table-accent);
}
#compare .cmp-row-icon {color:var(--table-accent)}
#compare .cmp .ch-label {white-space:nowrap}
#compare .cmp .ch-label .cmp-mark {margin-left:0}
#compare .cmp thead tr:first-child > th {padding-left:12px;padding-right:12px}
#compare .cmp tbody tr:not(.cmp-group):hover > *,
#compare .cmp tbody tr:not(.cmp-group):hover > td.mine {box-shadow:inset 0 0 0 999px rgba(19,118,163,.10)}
#compare .cmp tbody tr:not(.cmp-group):hover > th[scope=row] {box-shadow:inset 3px 0 0 rgba(19,118,163,.45),inset 0 0 0 999px rgba(19,118,163,.10)}

@media (max-width:1100px) {
  #compare {
    .cmp-scroll {overflow:visible;max-height:none;overscroll-behavior:auto;border:0;border-radius:0}
    .cmp {display:block;width:100%;min-width:0;border:0;border-radius:0;background:transparent}
    .cmp colgroup {display:none}
    .cmp thead,.cmp tbody {display:block}
    .cmp thead tr:first-child,.cmp .cmp-sum td:first-child {display:none}
    .cmp tbody tr:not(.cmp-group),.cmp tr.cmp-sum {
      display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.35fr);
      margin:0 0 16px;padding:0;border:1px solid var(--table-line);border-radius:12px;
      overflow:hidden;background:var(--table-paper);box-shadow:0 3px 12px #20303c06;
    }
    .cmp tbody th[scope=row] {
      display:block;grid-column:1/-1;position:static;z-index:auto;
      padding:16px 18px;margin:0;border:0;border-bottom:1px solid var(--table-line);
      background:var(--table-head);font-size:17px;line-height:1.35;color:var(--table-ink);
    }
    .cmp tbody td,.cmp .cmp-sum td {
      display:block;min-width:0;width:auto;padding:17px 18px 20px;
      border:0;border-right:1px solid var(--table-line);font-size:14px;line-height:1.55;
      overflow-wrap:anywhere;
    }
    .cmp tbody tr:nth-child(odd):not(.cmp-group) td {background:var(--table-paper)}
    .cmp tbody td.mine,.cmp tbody tr:nth-child(odd):not(.cmp-group) td.mine,
    .cmp tbody:last-of-type tr:last-child td.mine,.cmp .cmp-sum td.mine {
      border:0;background:var(--table-memex);color:var(--table-ink);
    }
    .cmp .cmp-col {
      display:block;margin:0 0 8px;font-size:12px;line-height:1.3;font-weight:700;
      letter-spacing:0;text-transform:none;white-space:nowrap;color:var(--table-soft);
    }
    .cmp td.mine .cmp-col {color:var(--table-accent)}
    .cmp .cmp-sum td {border-top:3px solid #808080;background:var(--table-head)}
    .cmp .cmp-sum td.mine {border-top:3px solid var(--table-accent)}
    .cmp .cmp-sum .cmp-col {font-size:14px;color:var(--table-ink)}
    .cmp .cmp-sum td.mine .cmp-col {color:var(--table-accent)}
    .cmp .cmp-group {display:block;margin:32px 0 12px}
    .cmp .cmp-group th {
      display:block;margin:0;padding:12px 16px;border:0;border-radius:6px;
      background:var(--table-group);box-shadow:none;
    }
    .cmp tbody tr:not(.cmp-group):hover > *,.cmp tbody tr:not(.cmp-group):hover > td.mine {box-shadow:none}
    .cmp tbody tr:not(.cmp-group):hover > th[scope=row] {box-shadow:none}
    .cmp-note {margin-top:22px;overflow-wrap:anywhere}
  }
}

@media (max-width:640px) {
  #compare {
    .cmp tbody tr:not(.cmp-group),.cmp tr.cmp-sum {grid-template-columns:minmax(0,1fr)}
    .cmp tbody th[scope=row] {padding:15px 16px;font-size:16px}
    .cmp tbody td,.cmp .cmp-sum td {padding:14px 16px 16px;border-right:0;border-bottom:1px solid var(--table-line)}
    .cmp tbody td.mine,.cmp tbody tr:nth-child(odd):not(.cmp-group) td.mine,
    .cmp tbody:last-of-type tr:last-child td.mine,.cmp .cmp-sum td.mine {
      border-left:3px solid var(--table-accent);padding-left:13px;border-bottom:0;
    }
    .cmp .cmp-sum td {border-top:0;border-left:3px solid #808080;padding-left:13px}
    .cmp .cmp-sum td.mine {border-top:0}
    .cmp .cmp-col {margin-bottom:5px}
    .cmp .cmp-group {margin-top:28px}
  }
}