/*--[ CSS variables ]--*/

:root {
/* Colors */
--lStatusC: #482dff;
--lHeadC: #08102b;
--lBodyC: #08102b;
--lBodyCa: #989b9f;
--lBodyB: #fdfcff;
--lLinkC: #1976d2;
--lLinkB: #1976d2;
--lIconC: #08102b;
--lIconCa: #08102b;
--lIconCs: #767676;
--lHeaderC: #343435;
--lHeaderB: #fffdfc;
--lNotifB: #e8f0fe;
--lNotifC: #01579b;
--lContentB: #fffdfc;
--lContentL: #e6e6e6;
--lMenuB: #fffdfc;
--lSrchB: #fffdfc;
--lMobB: #fffdfc;
--lMobC: #08102b;
--lFotB: #fffdfc;
--lFotC: #08102b;
--darkT: #fffdfc;
--darkTa: #989b9f;
--darkL: #8775f5;
--darkB: #1e1e1e;
--darkBa: #2d2d30;
--darkBs: #252526;

/* Font family */
--fontS: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", Segoe UI Symbol, "Noto Color Emoji";
--fontH: "Google Sans Text", var(--fontS);
--fontB: "Google Sans Text", var(--fontS);
--fontBa: "Google Sans Text", var(--fontS);
--fontC: "Google Sans Mono", monospace;

/* SVG */
--svgW: 22px;
--svgH: 22px;
--svgC: currentColor;

/* Icon */
--iconC: var(--lIconC);
--iconCa: var(--lIconCa);
--iconCs: var(--lIconCs);
--iconHr: 15px;

/* Body */
--headC: var(--lHeadC);
--bodyC: var(--lBodyC);
--bodyCa: var(--lBodyCa);
--bodyB: var(--lBodyB);

/* Link */
--linkC: var(--lLinkC);
--linkB: var(--lLinkB);

/* Button */
--linkR: 6px;

/* Header */
--headerC: var(--lHeaderC);
--headerB: var(--lHeaderB);
--headerT: 16px;
--headerW: 400;
--headerL: 1px;
--headerH: 60px;
--headerHm: 55px;
--headerHc: var(--headerH);

/* Notification */
--notifB: var(--lNotifB);
--notifC: var(--lNotifC);
--notifH: 60px;

/* Content */
--contentB: var(--lContentB);
--contentBs: #f1f1f0;
--contentBa: #f6f6f6;
--contentL: var(--lContentL);
--contentLa: #b5b5b4;
--contentW: 1280px;
--sideW: 300px;
--transB: rgba(0,0,0,.05);

/* Page */
--pageW: 780px;
--pageW: 780px;
--postT: 36px;
--postF: 16px;
--postTm: 28px;
--postFm: 15px;

/* Widget */
--widgetT: 16px;
--widgetTw: 700;
--widgetTa: 25px;
--widgetTac: #989b9f;

/* Navigation Menu */
--menuB: var(--lMenuB);
--menuC: #08102b;
--menuW: 230px;
--menuL: 1px;

/* Tabbed Menu */
--navB: var(--contentB);

/* Search */
--srchB: var(--lSrchB);
--srchDr : 20px;

/* Mobile Menu */
--mobB: var(--lMobB);
--mobC: var(--lMobC);
--mobHv: #f1f1f0;
--mobL: 1px;
--mobBr: 12px;

/* Footer */
--fotB: var(--lFotB);
--fotC: var(--lFotC);
--fotL: 1px;

/* Border radius */
--greetR: 10px;
--thumbEr: 5px;

/* Thumbnail */
--thumbR: 16 / 9;
--thumbSb: linear-gradient(90deg, rgba(255,255,255,0) 0, rgba(255,255,255,.3) 20%, rgba(255,255,255,.6) 60%, rgba(255,255,255, 0));

/* Carousel */
--sliderR: 5 / 2;

/* Syntax */
--synxB: #f6f6f6;
--synxC: #2f3337;
--synxOrange: #b75501;
--synxBlue: #015692;
--synxGreen: #54790d;
--synxRed: #f15a5a;
--synxGray: #656e77;
--synxGold: #72621d;
--synxPurple: #803378;
--synxDot1: #f1645e;
--synxDot2: #eebd3e;
--synxDot3: #3cab4e;

/* Box shadow */
--bs-1: 0 5px 35px rgb(0 0 0 / 7%);

/* Transitions */
--trans-1: all .1s ease;
--trans-2: all .2s ease;
--trans-3: all .3s ease;
--trans-4: all .4s ease;
--trans-5: all .15s cubic-bezier(0.4, 0, 0.2, 1);

/* Status bar */
--statusC: var(--lStatusC);

/* Selection */
--selectC: #fff;
--selectB: var(--linkB);

/* Scroll */
--scrollT: rgba(0,0,0,.05);
--scrollB: rgba(0,0,0,.15);
--scrollBh: rgba(0,0,0,.25);
--scrollBa: rgba(0,0,0,.25);
--scrollH: 8px;
--scrollV: var(--scrollH);
--scrollR: 2px;

/* Constants */
--white: #fffdfc;
--black: #1e1e1e;

--aInvert: 0;

/* Messages */
--m-new: 'New!';
--m-free: 'Free!';
--m-showAll: 'Show all';
--m-hideAll: 'Hide all';
}

:root.lzD.drK, :root:not(.lzD) .modI:checked ~ .mainW {
--statusC: #1e1e1e;
--bodyB: var(--darkB);
--bodyC: var(--darkT);
--headC: var(--darkT);
--linkC: var(--darkL);
--linkB: var(--darkL);
--menuB: var(--darkB);
--menuC: var(--darkT);
--headerB: var(--darkB);
--headerC: var(--darkT);
--srchB: var(--darkB);
--navB: var(--darkB);
--notifB: var(--darkBa);
--notifC: rgba(255,255,255,.9);
--fotB: var(--darkB);
--fotC: var(--darkT);
--mobB: var(--darkBa);
--mobC: var(--darkT);
--mobHv: #252526;
--contentB: #252526;
--contentBs: #303031;
--contentBa: #252526;
--contentL: #444444;
--contentLa: #696969;
--transB: rgba(255,255,255,.05);
--thumbSb: linear-gradient(90deg, rgba(0,0,0,0) 0, rgba(0,0,0,.2) 20%, rgba(0,0,0,.4) 60%, rgba(0,0,0,0));
--synxB: var(--darkBa);
--synxC: #fff;
--synxBlue: #41a2ef;
--synxGreen: #98c379;
--synxPurple: #c678dd;
--synxRed: #e06c73;
--synxGold: #bba43d;
--synxOrange: #cc6c1a;
--scrollT: rgba(255,255,255,.05);
--scrollB: rgba(255,255,255,.15);
--scrollBh: rgba(255,255,255,.25);
--scrollBa: rgba(255,255,255,.25);
--aInvert: 1;
}

:root.csN:not(.cs0) {
--linkC: var(--cs-22);
--linkB: var(--cs-22);
--selectB: var(--cs-22);
}

:root.csN:not(.cs0).drK {
--linkC: var(--cs-14);
--linkB: var(--cs-14);
}

:root.csN:not(.cs0):not(.drK) {
--statusC: var(--cs-20);
--notifB: var(--cs-2);
--notifC: var(--cs-20);
}