CSS Basics w3c

@ Rules

At-rules are instructions which can be used for a variety of purposes.

@charset:
when a style is embedded within a page it shares the character encoding of that document. When the CSS is a separate document the @charset declaration can be placed at the top of the CSS. The User Agent can read the CSS without the @charset declaration but it must be used if the style sheet contains any non-ASll characters.

A CSS style sheet is a sequence of characters from the Universal Character Set (see [ISO10646]). For transmission and storage, these characters must be encoded by a character encoding that supports the set of characters available in US-ASCII (e.g., UTF-8, ISO 8859-x, SHIFT JIS, etc.).CSS style sheet representation - w3c

@import:
you can import other style sheets into your main CSS using @import, which is placed at the top of the CSS under the @charset (if that is included).

Having separate style sheets can help you to organized your styles but you need to keep in mind that it will slow down the load time.
@import "name.css";

@media:
allows you to target different style sheets for a varity of media. Below are examples for screen and print.
@media url('name.css') screen;
@media url('name.css') print;

@page:
allows you to specify the dimensions, orientation, margins, etc. for paged media. Example:
@page { margin: 2cm; }

@font-face:
allows you to define custom fonts. When you buy fonts the vender supplies the information for the style sheet.

@namespace:
    The @namespace at-rule declares a namespace prefix and associates it with a given namespace name (a string). This namespace prefix can then be used in namespace-qualified names W3C

Any @namespace rules must come after all @import and @charset At-rules and come before all CSS rules