:root{--font-inter:"Inter",sans-serif;--limegreen:#1db489;--brightred:#dc414c;--facebook:#198ff5;--twitter:#1ca0f2;--instagram-start:#fdc468;--instagram-end:#df4996;--youtube:#c4032a;--toggle-bg-light:#aeb3cb;--toggle-bg-start:#378fe6;--toggle-bg-end:#3eda82;--toggle-light:#868cac;--toggle-button-light:#f0f2f9;--dark-card-hover:#343b56;--dark-bg:#1e202a;--dark-top-bg:#1f212e;--dark-card:#252a41;--dark-text1:#8b97c6;--dark-text2:#fff;--light-card-hover:#e0e1f0;--light-bg:#fff;--light-top-bg:#f5f7ff;--light-card:#f0f2fa;--light-text1:#63687e;--light-text2:#1e202a;--background:var(--light-bg);--text-color:var(--light-text2);--text-color2:var(--light-text1);--card-bg:var(--light-card);--card-hover:var(--light-card-hover);--toggle:var(--toggle-light);--toggle-bg:var(--toggle-bg-light);--toggle-button:var(--toggle-button-light)}@media (prefers-color-scheme:dark){:root{--background:var(--dark-bg);--text-color:var(--dark-text2);--text-color2:var(--dark-text1);--card-bg:var(--dark-card);--card-hover:var(--dark-card-hover);--toggle:var(--light-bg);--toggle-bg:linear-gradient(225deg,var(--toggle-bg-end) 0%,var(--toggle-bg-start) 98.02%);--toggle-button:var(--dark-bg)}}body.light{--background:var(--light-bg);--text-color:var(--light-text2);--text-color2:var(--light-text1);--card-bg:var(--light-card);--card-hover:var(--light-card-hover);--toggle:var(--toggle-light);--toggle-bg:var(--toggle-bg-light);--toggle-button:var(--toggle-button-light)}body.dark{--background:var(--dark-bg);--text-color:var(--dark-text2);--text-color2:var(--dark-text1);--card-bg:var(--dark-card);--card-hover:var(--dark-card-hover);--toggle:var(--light-bg);--toggle-bg:linear-gradient(225deg,var(--toggle-bg-end) 0%,var(--toggle-bg-start) 98.02%);--toggle-button:var(--dark-bg)}html{box-sizing:border-box;font-size:100%}*,:after,:before{box-sizing:inherit}body{background:var(--background);color:var(--text-color);font-family:var(--font-inter);margin:0;padding:0}h1,h2,h3{line-height:1.1;margin-top:0}h1{font-size:1.5rem;margin-bottom:.1875rem}@media (min-width:71.875em){h1{font-size:1.75rem}}h2{font-size:1.5rem;margin-bottom:1.5rem}a,a:active,a:visited{text-decoration:none}.container{margin:0 auto 2.25rem;max-width:69.375rem;padding:0 1.5625rem}@media (min-width:71.875em){.container{padding:0}}.attribution{display:flex;justify-content:center}.header{display:flex;flex-wrap:wrap;margin-top:2.25rem}@media (min-width:40em){.header{align-items:center;justify-content:space-between}}.header__title{width:100%}@media (min-width:40em){.header__title{width:auto}}.header__subtitle{color:var(--text-color2);font-size:.875rem;font-weight:700}.header__toggle{margin-left:auto}.toggle{border:none;display:grid;grid-template-columns:1fr 3rem;margin:0}@media (max-width:39.9375em){.toggle{justify-content:space-between;margin-top:1rem;padding:0;width:100%}}.toggle label{color:var(--toggle);font-size:.875rem;font-weight:700}.toggle label[for=dark]{line-height:1.5rem;margin-right:.8125rem}.toggle__wrapper{height:1.5rem;position:relative}.toggle input[type=radio]{height:1.5rem;margin:0 -.125rem;opacity:0;width:1.5rem}.toggle__background{background:var(--toggle-bg);border-radius:.75rem;display:block;height:100%;overflow:hidden;pointer-events:none;position:absolute;top:0;width:100%}.toggle__button{background-color:var(--toggle-button);border-radius:50%;height:1.125rem;left:.1875rem;position:absolute;right:100%;top:.1875rem;transition:all .15s ease-in-out;width:1.125rem}.toggle #light:checked~.toggle__button{left:calc(100% - 21px);right:3px}.cards{display:grid;gap:1.875rem;grid-template-columns:1fr}@media (min-width:40em){.cards{grid-template-columns:repeat(2,1fr)}}@media (min-width:71.875em){.cards{grid-template-columns:repeat(4,1fr)}}.card{background:var(--card-bg);border-radius:.3125rem;color:var(--dark-text1);cursor:pointer;overflow:hidden;padding:1.5625rem;position:relative;text-align:center}.card:hover{background:var(--card-hover)}.card--facebook{border-top:.3125rem solid var(--facebook)}.card--twitter{border-top:.3125rem solid var(--twitter)}.card--instagram{padding-top:1.875rem}.card--instagram:before{background:linear-gradient(to right,var(--instagram-start),var(--instagram-end));content:"";display:block;height:.3125rem;left:0;position:absolute;top:0;width:100%}.card--youtube{border-top:.3125rem solid var(--youtube)}.card__platform{align-items:center;display:flex;height:1.25rem;justify-content:center;margin-bottom:1.75rem;margin-top:.3125rem}.card__subtitle{font-size:.875rem;font-weight:700}.card__icon{margin-right:.75rem}.card__username{font-size:.75rem;font-weight:700}.card__followers{margin-bottom:1.5625rem}.card__count{color:var(--text-color2);font-weight:700;letter-spacing:-.125rem;line-height:1;margin-bottom:.25rem}.card__count--big{font-size:3.5rem}.card__count--small{font-size:2rem}.card__label{color:var(--text-color);font-size:.75rem;font-weight:400;letter-spacing:.3125rem;text-transform:uppercase}.card__change{align-items:center;display:flex;font-size:.75rem;font-weight:700;justify-content:center}.card__change--up{color:var(--limegreen)}.card__change--down{color:var(--brightred)}.card__change img{margin-right:.25rem}.card-grid{display:grid;gap:1.4375rem;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,auto);justify-items:start}.card-grid .card__count{margin-bottom:0}.card-grid .card__change,.card-grid .card__count{align-self:end}.card-grid .card__change,.card-grid img{justify-self:end}.card-grid img{margin-right:.25rem}
/*# sourceMappingURL=style.css.map */