/*! @twitter/feather-core v3.9.0 */

/*
DO NOT EDIT.
This is auto-generated with `npm run dist`.
Edit `src/js/core.js` instead.
*/

:root {
  /* Colors */
  --tw-color-blue-primary: #1da1f2;
  --tw-color-text-primary: #14171a;
  --tw-color-text-secondary: #536471;
  --tw-color-text-link: #1b95e0;
  --tw-color-gray-deep: #657786;
  --tw-color-gray-medium: #aab8c2;
  --tw-color-gray-light: #ccd6dd;
  --tw-color-gray-faded: #e6ecf0;
  --tw-color-gray-faint: #f5f8fa;
  --tw-color-red-deep: #a01744;
  --tw-color-red-medium: #e0245e;
  --tw-color-red-light: #f6809a;
  --tw-color-red-faded: #ffb8c2;
  --tw-color-orange-deep: #d82e18;
  --tw-color-orange-medium: #f45d22;
  --tw-color-orange-light: #ff8d57;
  --tw-color-orange-faded: #ffbe78;
  --tw-color-yellow-deep: #f98e00;
  --tw-color-yellow-medium: #ffad1f;
  --tw-color-yellow-light: #ffd03f;
  --tw-color-yellow-faded: #ffe76e;
  --tw-color-green-deep: #008951;
  --tw-color-green-medium: #17bf63;
  --tw-color-green-light: #68e090;
  --tw-color-green-faded: #a5f2aa;
  --tw-color-blue-deep: #005fd1;
  --tw-color-blue-medium: #1da1f2;
  --tw-color-blue-light: #71c9f8;
  --tw-color-blue-faded: #97e3ff;
  --tw-color-blue-faint: #eaf5fd;
  --tw-color-purple-deep: #4f0299;
  --tw-color-purple-medium: #794bc4;
  --tw-color-purple-light: #a37ced;
  --tw-color-purple-faded: #c7b4fa;
  /* Form controls */
  --feather-form-control-xsmall-font-size: 0.6rem;
  --feather-form-control-xsmall-height: 1rem;
  --feather-form-control-xsmall-border-radius: 0.2rem;
  --feather-form-control-xsmall-padding-x: 0.4rem;
  --feather-form-control-xsmall-adornment-margin: 0.2rem;
  --feather-form-control-small-font-size: 0.6rem;
  --feather-form-control-small-height: 1.2rem;
  --feather-form-control-small-border-radius: 0.2rem;
  --feather-form-control-small-padding-x: 0.4rem;
  --feather-form-control-small-adornment-margin: 0.2rem;
  --feather-form-control-default-font-size: 0.7rem;
  --feather-form-control-default-height: 1.6rem;
  --feather-form-control-default-border-radius: 0.2rem;
  --feather-form-control-default-padding-x: 0.6rem;
  --feather-form-control-default-adornment-margin: 0.3rem;
  --feather-form-control-large-font-size: 0.8rem;
  --feather-form-control-large-height: 2rem;
  --feather-form-control-large-border-radius: 0.2rem;
  --feather-form-control-large-padding-x: 0.8rem;
  --feather-form-control-large-adornment-margin: 0.4rem;
  /* Grid */
  --feather-grid-micro: 0.2rem;
  --feather-grid-xxsmall: 0.4rem;
  --feather-grid-xsmall: 0.6rem;
  --feather-grid-small: 0.8rem;
  --feather-grid-medium: 1rem;
  --feather-grid-large: 1.2rem;
  --feather-grid-mega: 2rem;
  --feather-grid-baseline-gap: 8px;
  --feather-grid-column-gap: 20px;
  --feather-grid-column-width: 78px;
  --feather-grid-column-count: 12;
  --feather-grid-page-width: 1156px;
  /* Layout */
  --feather-layout-navigation-bar-height-experimental: 2.8rem;
  --feather-layout-navigation-sidebar-width-experimental: 14rem;
  /* Typography */
  --feather-font-family-base: Helvetica, -apple-system, BlinkMacSystemFont,
    "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue",
    sans-serif;
  --feather-font-family-monospace: Menlo, Monaco, Consolas, "Courier New",
    monospace;
  --feather-font-size-jumbo: 1.2rem;
  --feather-line-height-jumbo: 1.6rem;
  --feather-font-size-xlarge: 1rem;
  --feather-line-height-xlarge: 1.4rem;
  --feather-font-size-large: 0.8rem;
  --feather-line-height-large: 1.2rem;
  --feather-font-size-normal: 0.7rem;
  --feather-line-height-normal: 1rem;
  --feather-font-size-small: 0.6rem;
  --feather-line-height-small: 0.8rem;
  --feather-font-weight-normal: 400;
  --feather-font-weight-bold: 700;
  /* Breakpoints - private variables for Feather use only */
  --feather-breakpoint-xsmall-experimental: 0px;
  --feather-breakpoint-small-experimental: 600px;
  --feather-breakpoint-medium-experimental: 1024px;
  --feather-breakpoint-large-experimental: 1280px;
  --feather-breakpoint-xlarge-experimental: 1920px;
}
/* Typography class names */
.feather-text-jumbo {
  font-size: 1.2rem;
  line-height: 1.6rem;
}
.feather-text-xlarge {
  font-size: 1rem;
  line-height: 1.4rem;
}
.feather-text-large {
  font-size: 0.8rem;
  line-height: 1.2rem;
}
.feather-text-normal {
  font-size: 0.7rem;
  line-height: 1rem;
}
.feather-text-small {
  font-size: 0.6rem;
  line-height: 0.8rem;
}
.feather-text-small-caps {
  font-weight: 700;
  letter-spacing: 0.025rem;
  text-transform: uppercase;
  font-size: 0.6rem;
  line-height: 0.8rem;
}
.feather-h1 {
  font-weight: 700;
  font-size: 1.2rem;
  line-height: 1.6rem;
}
.feather-h2 {
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.4rem;
}
.feather-h3 {
  font-weight: 700;
  font-size: 0.8rem;
  line-height: 1.2rem;
}
/*! Copyright 2020 Twitter Inc. All rights reserved. */
/* @generated */
/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
     ========================================================================== */
/**
   * 1. Correct the line height in all browsers.
   * 2. Prevent adjustments of font size after orientation changes in
   *    IE on Windows Phone and in iOS.
   */
html {
  line-height: 1.15;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}
/* Sections
     ========================================================================== */
/**
   * Remove the margin in all browsers (opinionated).
   */
body {
  margin: 0;
}
/**
   * Add the correct display in IE 9-.
   */
article,
aside,
footer,
header,
nav,
section {
  display: block;
}
/**
   * Correct the font size and margin on `h1` elements within `section` and
   * `article` contexts in Chrome, Firefox, and Safari.
   */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
/* Grouping content
     ========================================================================== */
/**
   * Add the correct display in IE 9-.
   * 1. Add the correct display in IE.
   */
figcaption,
figure,
main {
  /* 1 */
  display: block;
}
/**
   * Add the correct margin in IE 8.
   */
figure {
  margin: 1em 40px;
}
/**
   * 1. Add the correct box sizing in Firefox.
   * 2. Show the overflow in Edge and IE.
   */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
}
/**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}
/* Text-level semantics
     ========================================================================== */
/**
   * 1. Remove the gray background on active links in IE 10.
   * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
   */
a {
  background-color: transparent;
  /* 1 */
  -webkit-text-decoration-skip: objects;
  /* 2 */
}
/**
   * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
   */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
  /* 2 */
}
/**
   * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
   */
b,
strong {
  font-weight: inherit;
}
/**
   * Add the correct font weight in Chrome, Edge, and Safari.
   */
b,
strong {
  font-weight: bolder;
}
/**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}
/**
   * Add the correct font style in Android 4.3-.
   */
dfn {
  font-style: italic;
}
/**
   * Add the correct background and color in IE 9-.
   */
mark {
  background-color: #ff0;
  color: #000;
}
/**
   * Add the correct font size in all browsers.
   */
small {
  font-size: 80%;
}
/**
   * Prevent `sub` and `sup` elements from affecting the line height in
   * all browsers.
   */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
/* Embedded content
     ========================================================================== */
/**
   * Add the correct display in IE 9-.
   */
audio,
video {
  display: inline-block;
}
/**
   * Add the correct display in iOS 4-7.
   */
audio:not([controls]) {
  display: none;
  height: 0;
}
/**
   * Remove the border on images inside links in IE 10-.
   */
img {
  border-style: none;
}
/**
   * Hide the overflow in IE.
   */
svg:not(:root) {
  overflow: hidden;
}
/* Forms
     ========================================================================== */
/**
   * 1. Change the font styles in all browsers (opinionated).
   * 2. Remove the margin in Firefox and Safari.
   */
button,
input,
optgroup,
select,
textarea {
  font-family: sans-serif;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */
}
/**
   * Show the overflow in IE.
   * 1. Show the overflow in Edge.
   */
button,
input {
  /* 1 */
  overflow: visible;
}
/**
   * Remove the inheritance of text transform in Edge, Firefox, and IE.
   * 1. Remove the inheritance of text transform in Firefox.
   */
button,
select {
  /* 1 */
  text-transform: none;
}
/**
   * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
   *    controls in Android 4.
   * 2. Correct the inability to style clickable types in iOS and Safari.
   */
button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
}
/**
   * Remove the inner border and padding in Firefox.
   */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}
/**
   * Restore the focus styles unset by the previous rule.
   */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}
/**
   * Correct the padding in Firefox.
   */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}
/**
   * 1. Correct the text wrapping in Edge and IE.
   * 2. Correct the color inheritance from `fieldset` elements in IE.
   * 3. Remove the padding so developers are not caught out when they zero out
   *    `fieldset` elements in all browsers.
   */
legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */
}
/**
   * 1. Add the correct display in IE 9-.
   * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
   */
progress {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}
/**
   * Remove the default vertical scrollbar in IE.
   */
textarea {
  overflow: auto;
}
/**
   * 1. Add the correct box sizing in IE 10-.
   * 2. Remove the padding in IE 10-.
   */
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}
/**
   * Correct the cursor style of increment and decrement buttons in Chrome.
   */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
/**
   * 1. Correct the odd appearance in Chrome and Safari.
   * 2. Correct the outline style in Safari.
   */
[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}
/**
   * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
   */
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
/**
   * 1. Correct the inability to style clickable types in iOS and Safari.
   * 2. Change font properties to `inherit` in Safari.
   */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}
/* Interactive
     ========================================================================== */
/*
   * Add the correct display in IE 9-.
   * 1. Add the correct display in Edge, IE, and Firefox.
   */
details,
menu {
  display: block;
}
/*
   * Add the correct display in all browsers.
   */
summary {
  display: list-item;
}
/* Scripting
     ========================================================================== */
/**
   * Add the correct display in IE 9-.
   */
canvas {
  display: inline-block;
}
/**
   * Add the correct display in IE.
   */
template {
  display: none;
}
/* Hidden
     ========================================================================== */
/**
   * Add the correct display in IE 10-.
   */
[hidden] {
  display: none;
}
/**
   * A thin layer on top of normalize.css that provides a starting point more
   * suitable for web applications.
   */
/**
   * 1. Prevent padding and border from affecting element width
   * https://goo.gl/pYtbK7
   * 2. Change the default font family in all browsers
   */
html {
  box-sizing: border-box;
  /* 1 */
  font-family: sans-serif;
  /* 2 */
}
*,
*::before,
*::after {
  box-sizing: inherit;
}
/**
   * Removes the default spacing and border for appropriate elements.
   */
body,
blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
figure,
p,
pre {
  margin: 0;
}
button {
  background: transparent;
  border: 0;
  padding: 0;
}
/**
   * Work around a Firefox/IE bug where the transparent `button` background
   * results in a loss of the default `button` focus styles.
   */
button:focus {
  outline: 1px dotted;
  outline: 5px auto -webkit-focus-ring-color;
}
fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}
iframe {
  border: 0;
}
ol,
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
/**
   * Suppress the focus outline on elements that cannot be accessed via keyboard.
   * This prevents an unwanted focus outline from appearing around elements that
   * might still respond to pointer events.
   */
[tabindex="-1"]:focus {
  outline: none !important;
}
/**
   * Remove the outline on focused links when they are also active or hovered
   * in all browsers.
   */
a:active,
a:hover {
  outline-width: 0;
}
/**
   * Change the font styles in all browsers.
   */
button,
input,
optgroup,
select,
textarea {
  font-family: sans-serif;
  font-size: 100%;
  line-height: 1.15;
}
/**
   * Change the border, margin, and padding in all browsers.
   */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}
* {
  box-sizing: border-box;
}
*::before,
*::after {
  box-sizing: border-box;
}
button:not([disabled]) {
  cursor: pointer;
}
fieldset {
  margin: 0;
  padding: 0;
  border: 0;
}
.u-featherHiddenVisually {
  border: 0 !important;
  clip: rect(1px, 1px, 1px, 1px) !important;
  height: 1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
}
/*
  DO NOT EDIT.
  This is auto-generated with `npm run dist`.
  Edit `src/js/core.js` instead.
  */
.feather-text-jumbo {
  font-size: 1.2rem;
  line-height: 1.6rem;
}
.feather-text-xlarge {
  font-size: 1rem;
  line-height: 1.4rem;
}
.feather-text-large {
  font-size: 0.8rem;
  line-height: 1.2rem;
}
.feather-text-normal {
  font-size: 0.7rem;
  line-height: 1rem;
}
.feather-text-small {
  font-size: 0.6rem;
  line-height: 0.8rem;
}
.feather-text-small-caps {
  font-weight: 700;
  letter-spacing: 0.025rem;
  text-transform: uppercase;
  font-size: 0.6rem;
  line-height: 0.8rem;
}
/* Feather-specific icons */
.Icon--arrowRight:before {
  content: "\f114";
}
.Icon--featherAd:before {
  content: "\f407";
}
.Icon--featherAdCampaign:before {
  content: "\f405";
}
.Icon--featherAdGroup:before {
  content: "\f406";
}
.Icon--featherAudience:before {
  content: "\f408";
}
.Icon--featherCard:before {
  content: "\f204";
}
.Icon--featherCircleCheck:before {
  content: "\f043";
}
.Icon--featherCircleCheckFilled:before {
  content: "\f220";
}
.Icon--featherCircleFail:before {
  content: "\f044";
}
.Icon--featherCircleFailFilled:before {
  content: "\f222";
}
.Icon--featherClone:before {
  content: "\f214";
}
.Icon--featherCode:before {
  content: "\f410";
}
.Icon--featherCurrency:before {
  content: "\f403";
}
.Icon--featherDownload:before {
  content: "\f186";
}
.Icon--featherDraggableGrip:before {
  content: "\f206";
}
.Icon--featherFail:before {
  content: "\f182";
}
.Icon--featherFilm:before {
  content: "\f211";
}
.Icon--featherHistory:before {
  content: "\f404";
}
.Icon--featherMegaphoneStroke:before {
  content: "\f070";
}
.Icon--featherPhotoAlbum:before {
  content: "\f109";
}
.Icon--featherPreview:before {
  content: "\f216";
}
.Icon--featherReload:before {
  content: "\f303";
}
.Icon--featherSignal:before {
  content: "\f212";
}
.Icon--featherWarning:before {
  content: "\f221";
}
.Icon--featherWebsiteVisit:before {
  content: "\f213";
}
/* DEPRECATED Feather-specific icons */
/* Colors */
.Icon--featherWarning {
  color: #ffad1f;
}
.Icon--featherFail {
  color: #e0245e;
}
.Icon.Icon--featherTooltipCue {
  position: relative;
  width: 0.7rem;
  height: 0.7rem;
  background-color: #71c9f8;
  border-radius: 50%;
  vertical-align: middle;
}
h1 .Icon.Icon--featherTooltipCue,
h2 .Icon.Icon--featherTooltipCue {
  vertical-align: super;
}
.Icon.Icon--featherTooltipCue::before {
  position: absolute;
  top: 0.35rem;
  width: 100%;
  color: white;
  content: "?";
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  font-size: 0.5rem;
  font-weight: 700;
  line-height: 0;
}
.Icon.Icon--featherTooltipCue:hover,
.Icon.Icon--featherTooltipCue:focus {
  background-color: #1da1f2;
  cursor: pointer;
}
.Icon.Icon--loadingSmall {
  width: 0.7rem;
  height: 0.7rem;
  background: url(../images/spinner-rosetta-blue-14x14@2x.gif) 0 0 no-repeat;
  background-size: 0.7rem 0.7rem;
}
.Icon.Icon--loadingMedium {
  width: 1.3rem;
  height: 1.3rem;
  background: url(../images/spinner-rosetta-blue-26x26@2x.gif) 0 0 no-repeat;
  background-size: 1.3rem 1.3rem;
}
.Icon.Icon--loadingLarge {
  width: 1.6rem;
  height: 1.6rem;
  background: url(../images/spinner-rosetta-blue-32x32@2x.gif) 0 0 no-repeat;
  background-size: 1.6rem 1.6rem;
}
/* Font-based icons */
@font-face {
  font-family: "edgeicons";
  src: url("../fonts/edge-icons-Regular.eot");
  /* IE9 Compat Modes */
  src: url("../fonts/edge-icons-Regular.eot?#iefix") format("embedded-opentype"),
    /* IE8 */ url("../fonts/edge-icons-Regular.woff") format("woff"),
    /* Modern Browsers */ url("../fonts/edge-icons-Regular.ttf")
      format("truetype");
  /* Safari, Android, iOS */
}
/*
   * Reset styles for any element that may be used to display an icon (including
   * overrides of legacy CSS).
   */
.Icon {
  background: transparent;
  display: inline-block;
  font-style: normal;
  vertical-align: baseline;
  position: relative;
}
/**
   * A pseudo-element is used to display the icon's glyph. If an icon needs to be
   * "stacked" to achieve multiple colors you may use both :before and :after
   * psuedo-elements.
   */
.Icon:after,
.Icon:before {
  display: block;
  font-family: "edgeicons";
  font-weight: normal;
  font-style: normal;
  text-align: center;
  /* Make sure we get the best rendering for the icons on webkit */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
/**
   * Icon sizes & spacing
   */
.Icon--smallest {
  font-size: 0.6rem;
  line-height: 0.6rem;
}
.Icon--small {
  font-size: 0.8rem;
  line-height: 0.75rem;
}
.Icon--medium {
  font-size: 0.9rem;
  line-height: 0.9rem;
}
.Icon--large {
  font-size: 1.05rem;
  line-height: 1;
}
.Icon--extraLarge {
  font-size: 1.6rem;
  line-height: 1;
}
/**
   * Individual icons
   * Keep this list alphabetized
   */
.Icon--add:before {
  content: "\f183";
}
.Icon--addLight:before {
  content: "\f198";
}
/* Lighter version of the add icon */
.Icon--analytics:before {
  content: "\f200";
}
.Icon--arrowDown:before {
  content: "\f174";
}
.Icon--arrowLeft:before {
  content: "\f114";
  /*@replace: initial*/
  transform: scaleX(-1);
}
.Icon--arrowUp:before {
  content: "\f188";
}
.Icon--atSymbol:before {
  content: "\f050";
}
.Icon--attachFile:before {
  content: "\f088";
}
.Icon--audioBadge:before {
  content: "\f311";
}
.Icon--audioMuted:before {
  content: "\f306";
}
.Icon--audioUnmuted:before {
  content: "\f305";
}
.Icon--balloon:before {
  content: "\f092";
}
.Icon--bird:before {
  content: "\f179";
}
/* TODO: combine with Icon--logo */
.Icon--bookmark:before {
  content: "\f155";
}
.Icon--calendar:before {
  content: "\f203";
}
.Icon--camera:before {
  content: "\f027";
}
.Icon--cameraPlus:before {
  content: "\f111";
}
.Icon--cameraVideo:before {
  content: "\f030";
}
.Icon--cards:before {
  content: "\f402";
}
.Icon--caretDown:before {
  content: "\f181";
}
.Icon--caretLeft:before {
  /*@replace: "\f173"*/
  content: "\f172";
}
.Icon--caretLeftLight:before {
  content: "\f193";
}
.Icon--caretRight:before {
  /*@replace: "\f172"*/
  content: "\f173";
}
.Icon--caretRightLight:before {
  content: "\f194";
}
.Icon--caretUp:before {
  content: "\f181";
  transform: scaleY(-1);
}
.Icon--cart:before {
  content: "\f095";
}
.Icon--check:before {
  content: "\f170";
}
.Icon--checkLight:before {
  content: "\f197";
}
/* Lighter version of the check icon */
.Icon--chevronDown:before {
  content: "\f202";
}
.Icon--chevronUp:before {
  content: "\f201";
}
.Icon--circleActiveAnalytics:before {
  content: "\f516";
}
.Icon--circleActiveBird:before {
  content: "\f520";
}
.Icon--circleActiveDm:before {
  content: "\f517";
}
.Icon--circleActiveHeart:before {
  content: "\f514";
}
.Icon--circleActiveList:before {
  content: "\f518";
}
.Icon--circleActiveMe:before {
  content: "\f519";
}
.Icon--circleActiveMore:before {
  content: "\f515";
}
.Icon--circleActiveRetweet:before {
  content: "\f512";
}
.Icon--circleActiveStar:before {
  content: "\f513";
}
.Icon--circleError:before {
  content: "\f042";
}
.Icon--circleMe:before {
  content: "\f519";
}
.Icon--circleReply:before {
  content: "\f511";
}
.Icon--clock:before {
  content: "\f177";
}
.Icon--close:before {
  content: "\f045";
}
.Icon--cog:before {
  content: "\f059";
}
.Icon--cogWithCaret:before {
  content: "\f124";
}
.Icon--collapseTweets:before {
  content: "\f051";
}
.Icon--collections:before {
  content: "\f008";
}
.Icon--conversation:before {
  content: "\f157";
}
.Icon--cover:before {
  content: "\f163";
}
.Icon--createMoment:before {
  content: "\f162";
}
.Icon--creditCard:before {
  content: "\f401";
}
.Icon--crescent:before {
  content: "\f066";
}
.Icon--crescentFilled:before {
  content: "\f567";
}
.Icon--crop:before {
  content: "\f190";
}
.Icon--cvv:before {
  content: "\f402";
}
.Icon--delete:before {
  content: "\f154";
}
.Icon--deskBell:before {
  content: "\f090";
}
.Icon--desktop:before {
  content: "\f087";
}
.Icon--device:before {
  content: "\f085";
}
.Icon--discover:before {
  content: "\f052";
}
/* TODO: rename to Icon--hashtag */
.Icon--dm:before {
  content: "\f054";
}
.Icon--dmCompose:before {
  content: "\f035";
}
.Icon--dots:before {
  content: "\f150";
}
.Icon--dotsVertical:before {
  content: "\f149";
}
.Icon--download:before {
  content: "\f186";
}
.Icon--editPencil:before {
  content: "\f112";
}
.Icon--envelope:before {
  content: "\f187";
}
.Icon--fail:before {
  content: "\f000";
}
/* TODO: DESIGN-993 – create a dedicated fail icon */
.Icon--filter:before {
  content: "\f138";
}
.Icon--follow:before {
  content: "\f175";
}
.Icon--follower:before {
  content: "\f002";
}
/* TODO: rename to Icon--followBadge */
.Icon--following:before {
  content: "\f176";
}
.Icon--geo:before {
  content: "\f031";
}
.Icon--geoBadge:before {
  content: "\f010";
}
.Icon--gif:before {
  content: "\f028";
}
.Icon--gifBadge:before {
  content: "\f309";
}
.Icon--grid:before {
  content: "\f046";
}
.Icon--handset:before {
  content: "\f091";
}
.Icon--heart:before {
  content: "\f148";
}
.Icon--heartBadge:before {
  content: "\f015";
}
.Icon--home:before {
  content: "\f053";
}
.Icon--homeFilled:before {
  content: "\f553";
}
.Icon--horizontalBarChart:before {
  content: "\f048";
}
.Icon--info:before {
  content: "\f209";
}
.Icon--imageCrop:before {
  content: "\f158";
}
.Icon--laptop:before {
  content: "\f084";
}
.Icon--lifeline:before {
  content: "\f026";
}
.Icon--lifelineBadge:before {
  content: "\f000";
}
.Icon--lightBulbOn:before {
  content: "\f066";
}
.Icon--lightBulbOff:before {
  content: "\f567";
}
.Icon--lightning:before {
  content: "\f160";
}
.Icon--lightningBadge:before {
  content: "\f161";
}
.Icon--lightningFilled:before {
  content: "\f017";
}
.Icon--list:before {
  content: "\f094";
}
.Icon--listBadge:before {
  content: "\f012";
}
.Icon--logo:before {
  content: "\f179";
}
/* TODO: combine with Icon--bird */
.Icon--magicrecs:before {
  content: "\f014";
}
.Icon--markAllRead:before {
  content: "\f036";
}
.Icon--me:before {
  content: "\f056";
}
/* TODO: rename to Icon--profile */
.Icon--meFilled:before {
  content: "\f002";
}
/* TODO: rename to Icon--profileFilled */
.Icon--media:before {
  content: "\f109";
}
.Icon--mediaCollapse:before {
  content: "\f335";
}
.Icon--mediaDocking:before {
  content: "\f336";
}
.Icon--mediaExpand:before {
  content: "\f334";
}
.Icon--menu:before {
  content: "\f093";
}
.Icon--message:before {
  content: "\f054";
}
/* TODO: combine with Icon--dm */
.Icon--moderator:before {
  content: "\f089";
}
.Icon--muted:before {
  content: "\f101";
}
.Icon--newsBadge:before {
  content: "\f009";
}
.Icon--notifications:before {
  content: "\f055";
}
.Icon--notificationsFilled:before {
  content: "\f019";
}
.Icon--notificationsDisabled:before {
  content: "\f037";
}
.Icon--paintbrush:before {
  content: "\f159";
}
.Icon--pause:before {
  content: "\f302";
}
.Icon--periscopeBadge:before {
  content: "\f320";
}
.Icon--person:before {
  content: "\f056";
}
.Icon--people:before {
  content: "\f178";
}
.Icon--pinned:before {
  content: "\f003";
}
.Icon--play:before {
  content: "\f301";
}
.Icon--poll:before {
  content: "\f034";
}
.Icon--pollBar:before {
  content: "\f199";
}
.Icon--promoted:before {
  content: "\f004";
}
.Icon--promotedStroked:before {
  content: "\f504";
}
.Icon--promotedTrend:before {
  content: "\f011";
}
.Icon--promoteMode:before {
  content: "\f409";
}
.Icon--protected:before {
  content: "\f096";
}
.Icon--refresh:before {
  content: "\f189";
}
.Icon--reply:before {
  content: "\f151";
}
.Icon--report:before {
  content: "\e609";
}
.Icon--retweet:before {
  content: "\f152";
}
.Icon--retweeted:before {
  content: "\f006";
}
/* TODO: rename to Icon--retweetBadge */
.Icon--search:before {
  content: "\f058";
}
.Icon--share:before {
  content: "\f185";
}
.Icon--smileRating1:before {
  content: "\f430";
}
.Icon--smileRating1Fill:before {
  content: "\f431";
}
.Icon--smileRating2:before {
  content: "\f432";
}
.Icon--smileRating2Fill:before {
  content: "\f433";
}
.Icon--smileRating3:before {
  content: "\f434";
}
.Icon--smileRating3Fill:before {
  content: "\f435";
}
.Icon--smileRating4:before {
  content: "\f436";
}
.Icon--smileRating4Fill:before {
  content: "\f437";
}
.Icon--smileRating5:before {
  content: "\f438";
}
.Icon--smileRating5Fill:before {
  content: "\f439";
}
.Icon--smiley:before {
  content: "\f033";
}
.Icon--snapReelBadge:before {
  content: "\f312";
}
.Icon--soundOff:before {
  content: "\f306";
}
.Icon--soundOn:before {
  content: "\f305";
}
.Icon--stickerBadge:before {
  content: "\f047";
}
.Icon--summary:before {
  content: "\f156";
}
.Icon--tablet:before {
  content: "\f086";
}
.Icon--top:before {
  content: "\f007";
}
.Icon--translator:before {
  content: "\f089";
}
.Icon--truck:before {
  content: "\f400";
}
.Icon--tweet:before {
  content: "\f029";
}
/* TODO: rename to Icon--compose */
.Icon--unfollow:before {
  content: "\f097";
}
.Icon--unmuted:before {
  content: "\f101";
}
.Icon--url:before {
  content: "\f098";
}
.Icon--vineBadge:before {
  content: "\f310";
}
.Icon--visibilityFollowers:before {
  content: "\f103";
}
.Icon--visibilityFollowing:before {
  content: "\f105";
}
.Icon--visibilityMutual:before {
  content: "\f104";
}
.Icon--visibilityOnlyMe:before {
  content: "\f106";
}
.Icon--visibilityPublic:before {
  content: "\f102";
}
.Icon--warning:before {
  content: "\f182";
}
/**
   * Stacked verified icon
   *
   * The :before pseudo-element is the white fill that ensures the tick mark
   * remains white. The :after pseudo-element is the actual verified icon. The
   * reason why the white fill is positioned absolutely is because we want the
   * verified icon to be what gives the element width and height, not the fill.
   */
.Icon--verified:before {
  content: "\f032";
  font-size: 0.6em;
  left: 20%;
  line-height: 1;
  position: absolute;
  top: 25%;
}
.Icon--verified:after {
  content: "\f099";
  line-height: 1;
  position: relative;
}
/**
   * Stacked play icon
   *
   * The :before pseudo-element is the background fill color of the button. The
   * :after pseudo-element is the play icon with ring. The reason why the
   * background fill is positioned absolutely is because we want the play icon to
   * be what gives the element width and height.
   */
.Icon--playButton:before {
  content: "\f032";
  line-height: 1;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0.8;
}
.Icon--playButton:after {
  content: "\f040";
  line-height: 1;
  position: relative;
}
/**
   * 1. The protected glyph is a bit small relative to the verified glyph. Resize
   *    so that they take up the same visual space when placed next to each other.
   */
.Icon--protected {
  font-size: 1.1em;
  /* 1 */
  padding-left: 1px;
  /* 1 */
}
/* Colors */
.Icon--fail {
  color: #e0245e;
}
.Icon--follower,
.Icon--magicrecs,
.Icon--colorLightning,
.Icon--colorFollower {
  color: #1da1f2;
}
.Icon--lifelineBadge {
  color: #d82e18;
}
.Icon--listBadge:before {
  color: #657786;
}
.Icon--muted {
  color: #e0245e;
}
.Icon--promoted {
  color: #657786;
}
.Icon--promotedTrend {
  color: #ffad1f;
}
.Icon--protected {
  color: #14171a;
}
.Icon--retweeted,
.Icon--colorRetweeted {
  color: #17bf63;
}
.Icon--smiley {
  color: #aab8c2;
}
.Icon--top {
  color: #1da1f2;
}
.Icon--translator {
  color: #1da1f2;
}
.Icon--moderator {
  color: #ffad1f;
}
.Icon--unmuted {
  color: #ccd6dd;
}
.Icon--verified {
  color: #1da1f2;
}
.Icon--verified:before {
  color: white;
}
.Icon--circleActiveMe,
.Icon--circleActiveBird {
  color: #1da1f2;
}
.Icon--colorHeart,
.Icon--circleActiveHeart,
.Icon--heartBadge {
  color: #e0245e;
}
.Icon--circleActiveRetweet {
  color: #17bf63;
}
.Icon--circleActiveList {
  color: #657786;
}
.Icon--playButton {
  color: #1da1f2;
}
.Icon--playButton:after {
  color: white;
}
.Icon--white {
  color: white;
}
/**
   * Inverted Color Scheme
   *
   * Icon colors for placement on dark backgrounds
   */
.Icon--inverted.Icon--verified {
  color: white;
}
.Icon--inverted.Icon--verified:before {
  color: #14171a;
}
/* Body text */
html {
  font-size: 20px;
}
body {
  color: #14171a;
  font-family: Helvetica, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  font-size: 0.7rem;
  line-height: 1rem;
}
a {
  color: #1b95e0;
  text-decoration: none;
}
a:hover,
a:focus {
  color: #1b95e0;
  text-decoration: underline;
}
p {
  margin: 0 0 0.4rem;
}
ul,
ol {
  margin: 0.4rem 0;
  padding-left: 1.2rem;
  list-style: disc;
}
ol {
  list-style: decimal;
}
code,
kbd,
pre,
samp {
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
}
button {
  font-family: Helvetica, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  line-height: inherit;
}
/* Headings */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: Helvetica, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}
h1 {
  font-weight: 700;
  font-size: 1.2rem;
  line-height: 1.6rem;
  letter-spacing: -0.05rem;
}
h2 {
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.4rem;
}
h3 {
  font-weight: 700;
  font-size: 0.8rem;
  line-height: 1.2rem;
}
h4,
h5,
h6 {
  font-size: 0.7rem;
  line-height: 1rem;
  font-weight: 700;
}
/* Icons */
.Icon::after,
.Icon::before {
  -moz-osx-font-smoothing: auto;
  -webkit-font-smoothing: subpixel-antialiased;
}
.Icon.Icon--medium::after,
.Icon.Icon--large::after,
.Icon.Icon--extraLarge::after,
.Icon.Icon--medium::before,
.Icon.Icon--large::before,
.Icon.Icon--extraLarge::before {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
}
.Icon.Icon--verified::after,
.Icon.Icon--verified::before {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
}
/*! Copyright 2020 Twitter Inc. All rights reserved. */
/* @generated */
.Checkbox-input:checked + .Checkbox-uiWrapper .Checkbox-ui::after {
  display: block;
  font-family: "edgeicons";
  font-weight: normal;
  font-style: normal;
  text-align: center; /* Make sure we get the best rendering for the icons on webkit */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.Checkbox-input:checked + .Checkbox-uiWrapper .Checkbox-ui::after {
  content: "\f170";
}
.Checkbox {
  width: 0.8rem;
  height: 0.8rem;
  display: inline-flex;
  position: relative;
  z-index: 0;
  flex: 0 0 auto;
}
.Checkbox-input {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0;
  cursor: pointer;
  z-index: 1;
}
.Checkbox-input:disabled {
  cursor: default;
}
.Checkbox-uiWrapper {
  transition: box-shadow 0.15s ease-in-out;
  display: flex;
  padding: 0.4rem;
  margin: -0.4rem;
  border-radius: 9999px;
  position: relative;
  z-index: 0;
}
.Checkbox-uiWrapper:focus {
  outline: none;
}
.Checkbox-uiWrapper:-moz-focusring,
.Checkbox-uiWrapper[type="button"]:-moz-focusring,
.Checkbox-uiWrapper[type="reset"]:-moz-focusring,
.Checkbox-uiWrapper[type="submit"]:-moz-focusring {
  outline: none;
}
.Checkbox-ui {
  position: relative;
  width: 0.8rem;
  height: 0.8rem;
  background-color: white;
  border: 1px solid #657786;
  border-radius: 0.2rem;
}
.Checkbox-ui::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  color: white;
  text-align: center;
  line-height: calc(0.8rem - (2 * 1px));
}
/* States > Focus */
.Checkbox-input.is-keyboardFocus + .Checkbox-uiWrapper {
  box-shadow: 0 0 0 1px #aab8c2 inset;
  transition: box-shadow 0.15s ease-in-out;
  background-color: rgba(170, 184, 194, 0.15);
}
.Checkbox-input:checked.is-keyboardFocus + .Checkbox-uiWrapper,
.Checkbox--indeterminate
  .Checkbox-input.is-keyboardFocus
  + .Checkbox-uiWrapper {
  box-shadow: 0 0 0 1px #1da1f2 inset;
  transition: box-shadow 0.15s ease-in-out;
  background-color: rgba(29, 161, 242, 0.15);
}
/* States > Hover */
.Checkbox:hover
  .Checkbox-input:not(:disabled):not(:active)
  + .Checkbox-uiWrapper {
  background-color: rgba(170, 184, 194, 0.15);
}
.Checkbox:hover
  .Checkbox-input:not(:disabled):not(:active):checked
  + .Checkbox-uiWrapper,
.Checkbox--indeterminate:hover
  .Checkbox-input:not(:disabled):not(:active)
  + .Checkbox-uiWrapper {
  background-color: rgba(29, 161, 242, 0.15);
}
/* States > Active */
.Checkbox:active .Checkbox-input:not(:disabled) + .Checkbox-uiWrapper {
  background-color: rgba(170, 184, 194, 0.25);
}
.Checkbox:active .Checkbox-input:not(:disabled):checked + .Checkbox-uiWrapper,
.Checkbox--indeterminate:active
  .Checkbox-input:not(:disabled)
  + .Checkbox-uiWrapper {
  background-color: rgba(29, 161, 242, 0.25);
}
/* States > Checked, indeterminate */
.Checkbox--indeterminate .Checkbox-uiWrapper .Checkbox-ui,
.Checkbox-input:checked + .Checkbox-uiWrapper .Checkbox-ui {
  background-color: #1da1f2;
  border-color: #1da1f2;
}
.Checkbox--indeterminate .Checkbox-uiWrapper .Checkbox-ui::after {
  content: "–";
  transform: translateY(-0.025rem);
}
.Checkbox-input:checked + .Checkbox-uiWrapper .Checkbox-ui::after {
  font-size: 0.6rem;
  transform: translateY(-0.025rem);
}
/* States > Disabled */
.Checkbox-input:disabled + .Checkbox-uiWrapper .Checkbox-ui {
  background-color: #f5f8fa;
  border-color: #ccd6dd;
}
.Checkbox-input:checked:disabled + .Checkbox-uiWrapper .Checkbox-ui,
.Checkbox--indeterminate
  .Checkbox-input:disabled
  + .Checkbox-uiWrapper
  .Checkbox-ui {
  background-color: #ccd6dd;
  border-color: #ccd6dd;
}

/*! Copyright 2020 Twitter Inc. All rights reserved. */
/* @generated */
.IconButton {
  transition: box-shadow 0.15s ease-in-out;
  color: #1da1f2;
  width: 2rem;
  height: 2rem;
  font-size: 1.1rem;
  border-radius: 9999px;
  line-height: 1;
  transition-property: background, box-shadow, color;
  vertical-align: top;
}
.IconButton:focus {
  outline: none;
}
.IconButton:-moz-focusring,
.IconButton[type="button"]:-moz-focusring,
.IconButton[type="reset"]:-moz-focusring,
.IconButton[type="submit"]:-moz-focusring {
  outline: none;
}
.IconButton:hover {
  background: rgba(29, 161, 242, 0.15);
}
.IconButton:focus:not(.is-mouseFocus) {
  box-shadow: 0 0 0 2px white, 0 0 0 4px #71c9f8;
}
.u-featherBackgroundDark .IconButton:focus:not(.is-mouseFocus) {
  box-shadow: 0 0 0 2px black, 0 0 0 4px #71c9f8;
}
.IconButton:active {
  background: rgba(29, 161, 242, 0.25);
}
.IconButton:active:focus:not(.is-mouseFocus) {
  box-shadow: 0 0 0 2px white, 0 0 0 4px #1da1f2;
}
.u-featherBackgroundDark .IconButton:active:focus:not(.is-mouseFocus) {
  box-shadow: 0 0 0 2px black, 0 0 0 4px #1da1f2;
}
.IconButton[disabled] {
  cursor: default;
  opacity: 0.5;
  background: transparent;
}
h1 .IconButton,
h2 .IconButton,
h3 .IconButton {
  vertical-align: baseline;
}
.IconButton .Icon {
  transform: translateX(0.5px);
  pointer-events: none;
}
/* Appearances */
.IconButton--danger {
  color: #e0245e;
}
.IconButton--danger:hover {
  background: rgba(224, 36, 94, 0.15);
}
.IconButton--danger:focus:not(.is-mouseFocus) {
  box-shadow: 0 0 0 2px white, 0 0 0 4px #71c9f8;
}
.u-featherBackgroundDark .IconButton--danger:focus:not(.is-mouseFocus) {
  box-shadow: 0 0 0 2px black, 0 0 0 4px #71c9f8;
}
.IconButton--danger:active {
  background: rgba(224, 36, 94, 0.25);
}
.IconButton--danger:active:focus:not(.is-mouseFocus) {
  box-shadow: 0 0 0 2px white, 0 0 0 4px #1da1f2;
}
.u-featherBackgroundDark .IconButton--danger:active:focus:not(.is-mouseFocus) {
  box-shadow: 0 0 0 2px black, 0 0 0 4px #1da1f2;
}
.IconButton--tertiary {
  color: #657786;
}
.IconButton--tertiary:hover {
  background: rgba(170, 184, 194, 0.15);
}
.IconButton--tertiary:focus:not(.is-mouseFocus) {
  box-shadow: 0 0 0 2px white, 0 0 0 4px #71c9f8;
}
.u-featherBackgroundDark .IconButton--tertiary:focus:not(.is-mouseFocus) {
  box-shadow: 0 0 0 2px black, 0 0 0 4px #71c9f8;
}
.IconButton--tertiary:active {
  background: rgba(170, 184, 194, 0.25);
}
.IconButton--tertiary:active:focus:not(.is-mouseFocus) {
  box-shadow: 0 0 0 2px white, 0 0 0 4px #1da1f2;
}
.u-featherBackgroundDark
  .IconButton--tertiary:active:focus:not(.is-mouseFocus) {
  box-shadow: 0 0 0 2px black, 0 0 0 4px #1da1f2;
}
/* States */
/* Sizes */
.IconButton--small {
  width: 1rem;
  height: 1rem;
  font-size: 0.7rem;
}
/* Icon-specific styles */
.IconButton--infoIcon .Icon {
  transform: none;
}
h1 .IconButton--infoIcon .Icon,
h3 .IconButton--infoIcon .Icon {
  transform: translateX(0.5px);
}
