+body {
+ /*** theme ***/
+ // now beware sass requires interpolation
+ // for css custom properties #{$var}
+ --mainColor: #{$main-color};
+ --mainColorLighter: #{$main-color-lighter};
+ --mainColorLightest: #{$main-color-lightest};
+ --mainHoverColor: #{$main-hover-color};
+ --mainBackgroundColor: #{$bg-color};
+ --mainForegroundColor: #{$fg-color};
+ --secondaryColor: #{$secondary-color};
+
+ --greyForegroundColor: #{$grey-foreground-color};
+ --greyBackgroundColor: #{$grey-background-color};
+
+ --menuBackgroundColor: #{$menu-background};
+ --menuForegroundColor: #{$menu-color};
+
+ --submenuBackgroundColor: #{$sub-menu-background-color};
+ --channelBackgroundColor: #{$channel-background-color};
+
+ --inputForegroundColor: #{$input-foreground-color};
+ --inputBackgroundColor: #{$input-background-color};
+ --inputPlaceholderColor: #{$input-placeholder-color};
+
+ --textareaForegroundColor: #{$textarea-foreground-color};
+ --textareaBackgroundColor: #{$textarea-background-color};
+ --markdownTextareaBackgroundColor: #{$markdown-textarea-background-color};
+
+ --actionButtonColor: #{$grey-foreground-color};
+ --supportButtonBackgroundColor: #{transparent};
+ --supportButtonColor: #{pvar(--actionButtonColor)};
+ --supportButtonHeartColor: #{$support-button-heart};
+
+ --activatedActionButtonColor: #{$activated-action-button-color};
+
+ --horizontalMarginContent: #{$not-expanded-horizontal-margins};
+ --videosHorizontalMarginContent: 6vw;
+ --mainColWidth: calc(100vw - #{$menu-width});
+
+ font-family: $main-fonts;
+ font-weight: $font-regular;
+ color: pvar(--mainForegroundColor);
+ background-color: pvar(--mainBackgroundColor);
+ font-size: 14px;
+ // On desktop browsers, make sure vertical scroll bar is always visible
+ // Allow to disable the scrollbar instead of hide it when the content fit the body
+ // And not move the content and header horizontally sticked to right when the content is updating
+ overflow-y: scroll;
+}
+
+::selection {
+ color: pvar(--mainBackgroundColor);
+ background-color: pvar(--mainHoverColor);
+}
+
+noscript,
+#incompatible-browser {
+ display: block;
+ font-size: 1.2rem;
+ max-width: 600px;
+ margin: 1rem auto;
+}
+
+strong {
+ font-weight: $font-semibold;
+}
+