// out: ../Default.qss
// -----------------------------------------------------------------------------
// DEFAULT
// -----------------------------------------------------------------------------
// This is the default theme. All other themes derive from this.
// -----------------------------------------------------------------------------
// Include All
@import 'main';
// Resource Location
@img-url: 'imgs/white';
@bg: #484848;
@accent: darken(@bg, 11);
@text-color: rgb(230, 230, 230);
@text-color-disabled: fade(@text-color, 40);
@hl-bg-color: rgb(83, 133, 166);
@hl-bg-color-disabled: darken(desaturate(@hl-bg-color, 15), 15);
@hl-text-color: rgb(255, 255, 255);
@hl-bg-color-secondary: rgba(255, 255, 255, 0.10);
@hl-text-color-secondary: @text-color;
@dock-bg-color: darken(@bg, 16);
@dock-placeholder-color: #f55454;
@dialogButtonFrame-bg-color: darken(@bg, 4);
@tooltip-bg-color: #292B2D;
@tooltip-border-color: #CFD1D4;
@tooltip-text-color: #CFD2D4;
@label-title: rgb(159, 218, 255);
@label-error: rgb(255, 0, 0);
@lock-color: #C34040;
// -----------------------------------------------------------------------------
// Tabs
// -----------------------------------------------------------------------------
@tabbar-bg-color: darken(@bg, 6);
// Tabs
@tab-bg-color: @tabbar-bg-color;
@tab-text-color: mix(@tab-bg-color, @text-color, 40);
@tab-border-color: darken(@accent, 2);
@tab-bg-color-hover: lighten(@tab-bg-color, 5);
@tab-border-color-hover: @tab-bg-color-hover;
@tab-text-color-hover: @tab-text-color;
@tab-bg-color-selected: @bg;
@tab-border-color-selected: @tab-bg-color-selected;
@tab-text-color-selected: #fff;
// -----------------------------------------------------------------------------
// Topbar & Workspaces
// -----------------------------------------------------------------------------
// Topbar
@topbar-bg-color: @bg;
@topbar-border-color: @accent;
// Workspace Tabs
@rooms-tab-bg-color: @tab-bg-color;
@rooms-tab-text-color: @tab-text-color;
@rooms-tab-bg-color-hover: @tab-bg-color-hover;
@rooms-tab-bg-color-selected: @hl-bg-color;
@rooms-tab-text-color-selected: @hl-text-color;
@rooms-tab-border-color-selected: @rooms-tab-bg-color-selected;
// -----------------------------------------------------------------------------
// Menu
// -----------------------------------------------------------------------------
@menu-text-color: @text-color;
@menu-bg-color: @bg;
@menu-border-color: @accent;
@menu-separator-color: @menu-border-color;
@menu-item-bg-color-selected: @hl-bg-color;
@menu-item-text-color-selected: @hl-text-color;
@menu-checkbox-text-color-selected: @text-color;
@menu-icon-checked-bg-color: @toolbutton-bg-color-checked;
@menu-icon-checked-border-color: @toolbutton-border-color-checked;
// -----------------------------------------------------------------------------
// Scrollbars
// -----------------------------------------------------------------------------
// Container
@scrollbar-bg-color: darken(@bg, 8);
// Handle
@scrollbar-handle-border-size: 0;
@scrollbar-handle-radius: 4;
@scrollbar-handle-margin: 3;
@scrollbar-handle-bg-color: lighten(@bg, 8);
@scrollbar-handle-border-color: @scrollbar-handle-bg-color;
@scrollbar-handle-bg-color-hover: lighten(@scrollbar-handle-bg-color, 8);
@scrollbar-handle-border-color-hover: @scrollbar-handle-bg-color-hover;
@scrollbar-handle-bg-color-pressed: lighten(@scrollbar-handle-bg-color-hover, 8);
@scrollbar-handle-border-color-pressed: @scrollbar-handle-bg-color-pressed;
// -----------------------------------------------------------------------------
// Palette Window
// -----------------------------------------------------------------------------
// All views (except list)
@palette-SelectedBorderColor: rgb(255, 255, 255);
@palette-NumpadShortcutBgColor: rgba(0, 0, 0, 0.3);
@palette-NumpadShortcutBorderColor: rgb(141, 141, 141);
// List view
@palette-SeparatorColor: @accent;
@palette-SelectedCellColor: @hl-bg-color;
@palette-CurrentCellColor: fade(@hl-bg-color, 50);
@palette-ListNumpadShortcutBorderColor: rgb(175, 175, 175);
// StyleChooserPage Chips
@palette-CommonChipBoxColor: black;
@palette-PinnedChipBoxColor: rgb(160, 160, 160);
@palette-SolidChipBoxColor: rgb(228, 16, 0);
@palette-SelectedChipBoxColor: white;
@palette-SelectedChipBox2Color: rgb(199, 202, 50);
// -----------------------------------------------------------------------------
// Button
// -----------------------------------------------------------------------------
@button-bg-color: lighten(@bg, 11);
@button-border-color: @bg;
@button-border-width: 1;
@button-text-color: lighten(@text-color, 5);
@button-bg-color-hover: lighten(@button-bg-color, 5);
@button-border-color-hover: @button-border-color;
@button-text-color-hover: @button-text-color;
@button-bg-color-pressed: darken(@button-bg-color, 22);
@button-border-color-pressed: darken(@button-bg-color-pressed, 2);
@button-text-color-pressed: @button-text-color;
@button-bg-color-checked: darken(@button-bg-color-pressed, 0);
@button-border-color-checked: darken(@button-bg-color-checked, 2);
@button-text-color-checked: @button-text-color;
@button-bg-color-checked-hover: lighten(@button-bg-color-checked, 8);
@button-border-color-checked-hover: darken(@button-bg-color-checked-hover, 5);
@button-bg-color-checked-hover-pressed: darken(@button-bg-color-checked-hover, 5);
@button-bg-color-focus: @hl-bg-color;
@button-border-color-focus: @button-dialog-border-color;
@button-text-color-focus: lighten(@button-text-color, 10);
@button-bg-color-focus-hover: lighten(@button-bg-color-focus, 8);
@button-bg-color-disabled: lighten(@bg, 5);
@button-border-color-disabled: @button-border-color;
@button-text-color-disabled: @text-color-disabled;
// For QDialogs
@button-dialog-border-color: @dialogButtonFrame-bg-color;
// Scrollable Buttons
@scrollable-button-bg-color: @button-bg-color;
@scrollable-button-bg-color-hover: @button-bg-color-hover;
@scrollable-button-bg-color-pressed: @button-bg-color-pressed;
@scrollable-button-border-color: @button-border-color;
// -----------------------------------------------------------------------------
// Tool Buttons
// -----------------------------------------------------------------------------
// Main
@toolbutton-border-size: 1;
@toolbutton-bg-color: transparent;
@toolbutton-border-color: @toolbutton-bg-color;
@toolbutton-text-color: @button-text-color;
@toolbutton-bg-color-hover: @button-bg-color-hover;
@toolbutton-border-color-hover: @toolbutton-bg-color-hover;
@toolbutton-text-color-hover: @button-text-color-hover;
@toolbutton-bg-color-pressed: @button-bg-color-pressed;
@toolbutton-border-color-pressed: @button-border-color-pressed;
@toolbutton-text-color-pressed: @button-text-color-pressed;
@toolbutton-bg-color-checked: @hl-bg-color;
@toolbutton-border-color-checked: @toolbutton-bg-color-checked;
@toolbutton-text-color-checked: @hl-text-color;
@toolbutton-bg-color-checked-hover: lighten(@toolbutton-bg-color-checked, 8);
@toolbutton-border-color-checked-hover: @toolbutton-bg-color-checked-hover;
@toolbutton-bg-color-disabled: fade(@hl-bg-color, 40);
@toolbutton-border-color-disabled: @toolbutton-bg-color-disabled;
// Lock
@toolbutton-lock-bg-color-checked: @lock-color;
@toolbutton-lock-border-color-checked: @toolbutton-lock-bg-color-checked;
@toolbutton-lock-bg-color-checked-hover: lighten(@toolbutton-lock-bg-color-checked, 15);
@toolbutton-lock-border-color-checked-hover: @toolbutton-lock-bg-color-checked-hover;
// -----------------------------------------------------------------------------
// ComboBox
// -----------------------------------------------------------------------------
@combobox-dropdown-border-size: 0;
@combobox-dropdown-border-radius: 1;
@combobox-dropdown-border-color: @button-bg-color;
@combobox-dropdown-border-color-hover: @button-bg-color-hover;
// For :editable ComboBox with LineEdit
@combobox-dropdown-bg-color-hover-editable: @button-bg-color-hover;
@combobox-dropdown-bg-color-disabled-editable: @button-bg-color-disabled;
// -----------------------------------------------------------------------------
// Textfield
// -----------------------------------------------------------------------------
@input-bg-color: darken(@bg, 10);
@input-border-color: darken(@input-bg-color, 1);
@input-border-radius: 2;
@input-text-color: @text-color;
@input-bg-color-focus: @input-bg-color;
@input-border-color-focus: @hl-bg-color;
@input-text-color-focus: @input-text-color;
@input-bg-color-disabled: mix(@input-bg-color, @bg, 50);
@input-border-color-disabled: mix(@input-border-color, @bg, 50);
@input-text-color-disabled: @text-color-disabled;
// Text Selection
@input-selection-text-color: @hl-text-color;
@input-selection-bg-color: @hl-bg-color;
// -----------------------------------------------------------------------------
// CheckBox
// -----------------------------------------------------------------------------
@checkbox-size: 9;
@checkbox-bg-color: @input-bg-color;
@checkbox-border-color: @input-border-color;
@checkbox-border-radius: 2;
@checkbox-bg-color-hover: @checkbox-bg-color;
@checkbox-border-color-hover: lighten(@bg, 50);
@checkbox-text-color-hover: lighten(@text-color, 25);
@checkbox-bg-color-checked: @hl-bg-color;
@checkbox-border-color-checked: @checkbox-bg-color-checked;
@checkbox-bg-color-checked-hover: @checkbox-bg-color-checked;
@checkbox-border-color-checked-hover: @checkbox-border-color-hover;
@checkbox-bg-color-disabled: @input-bg-color-disabled;
@checkbox-border-color-disabled: @checkbox-bg-color-disabled;
@checkbox-bg-color-checked-disabled: lighten(@bg, 10);
@checkbox-border-color-checked-disabled: @checkbox-bg-color-checked-disabled;
@checkbox-img: 'checkmark.svg';
@checkbox-img-disabled: 'checkmark_disabled.svg';
@checkbox-partially-img: 'checkpartially.svg';
@checkbox-partially-img-disabled: 'checkpartially_disabled.svg';
// For RadioButton
@radiobutton-img-unchecked: 'radiobutton_unchecked.svg';
@radiobutton-img-unchecked-hover: 'radiobutton_unchecked_hover.svg';
@radiobutton-img-unchecked-disabled: 'radiobutton_unchecked_disabled.svg';
@radiobutton-img-checked: 'radiobutton_checked.svg';
@radiobutton-img-checked-disabled: 'radiobutton_checked_disabled.svg';
// -----------------------------------------------------------------------------
// Slider
// -----------------------------------------------------------------------------
// Single
@slider-groove-img: 'slider-groove.svg';
@slider-groove-img-disabled: 'slider-groove_disabled.svg';
@slider-handle-margin: -2 -1;
@slider-handle-width: 10;
@slider-handle-img: 'slider-handle.svg';
@slider-handle-img-disabled: 'slider-handle_disabled.svg';
@slider-v-handle-margin: -1 -2;
@slider-v-handle-img: 'slider-v-handle.svg';
@slider-v-handle-img-disabled: 'slider-v-handle_disabled.svg';
// This one is used only for #ViewerFpsSlider
@slider-handle-bg-color: lighten(@bg, 35);
@slider-handle-border-color: @slider-handle-bg-color;
// DoublePairField, IntPairField
@slider-groove-color: darken(@bg, 11);
@slider-left-handle: @slider-handle-img;
@slider-right-handle: @slider-handle-img;
@slider-left-handle-disabled: @slider-handle-img-disabled;
@slider-right-handle-disabled: @slider-handle-img-disabled;
// -----------------------------------------------------------------------------
// Custom Panel Widgets
// -----------------------------------------------------------------------------
@customPanel-Scroller-border-color: darken(@text-color, 35);
@customPanel-Scroller-bg-color: darken(@bg, 8);
// -----------------------------------------------------------------------------
// Titlebars
// -----------------------------------------------------------------------------
@title-bg-color: @tabbar-bg-color;
@title-text-color: lighten(@bg, 30);
@title-text-color-active: #fff;
@title-active-border-pixmap: 'none';
@title-border-width: 1px;
@title-border-color: @accent;
// Title pane icon colors
@title-button-rollover-color: @button-bg-color-hover;
@title-button-pressed-color: @hl-bg-color;
@title-button-freeze-color: @lock-color;
@title-button-preview-color: #1baf7e;
@title-close-over-color: @lock-color;
// -----------------------------------------------------------------------------
// File Browser / Trees
// -----------------------------------------------------------------------------
// Filebrowser window color
@filebrowser-bg-color: @bg;
// Trees
@tree-bg-color: darken(@bg, 10);
@tree-bg-color-alt: lighten(@tree-bg-color, 3);
@prefs-tree-bg-color: darken(@bg, 8);
// All Panes
@browser-folder-text-color: @label-title;
@browser-folder-text-color-selected: @hl-text-color;
@browser-selected-item-bg-color: @hl-bg-color;
// Left Pane
@browser-listview-bg-color: @tree-bg-color;
@browser-listview-bg-color-alt: @browser-listview-bg-color;
// Right Pane: Order Column
@browser-itemview-col-color: darken(@bg, 5);
@browser-itemview-col-color-sorted: @browser-itemview-col-color;
@browser-itemview-col-text-color: @text-color;
@browser-itemview-col-border-color: @accent;
@browser-itemview-col-relief-color: @browser-itemview-col-color;
// Right Pane: BG
@browser-itemview-bg-color: darken(@bg, 5);
@browser-itemview-bg-color-alt: lighten(@browser-itemview-bg-color, 3);
// -----------------------------------------------------------------------------
// Viewer Window
// -----------------------------------------------------------------------------
// FlipSlider
@flipmarker-img: 'flipmarker.svg';
@flipslider-img: 'flipslider.svg';
@flipslider-base-color: darken(@bg, 10);
@flipslider-notstarted-color: rgba(205, 101, 101, 0.78);
@flipslider-started-color: rgb(26, 188, 63);
@flipslider-finished-color: @flipslider-base-color;
// Ruler
@viewer-ruler-bg-color: @bg;
@viewer-ruler-scale-color: fade(@text-color, 70);
@viewer-ruler-ToolOptionValues-color: darken(@bg, 50);
@viewer-ruler-border-color: fade(@accent, 70);
@viewer-ruler-handle-color: lighten(saturate(@hl-bg-color, 35), 15);
@viewer-ruler-handle-drag-color: yellow;
// -----------------------------------------------------------------------------
// Progress Bar
// -----------------------------------------------------------------------------
@progressbar-bg-color: darken(@bg, 10);
@progressbar-border-color: @accent;
@progressbar-chunk-bg-color: rgb(21, 161, 54);
@progressbar-chunk-border-color: @accent;
// -----------------------------------------------------------------------------
// XSheet
// -----------------------------------------------------------------------------
// XSheet Context Menus
@xsheet-menu-preview-color: #E6E678;
@xsheet-menu-lock-color: #F5F5F5;
@xsheet-menu-camstand-color: #FFA480;
@xsheet-menu-text-color: #000;
// XSheet Notes
@xsheet-notes-text-color: #000;
// XSheet Spreadsheet Viewer
@xsheet-text-color: @text-color;
@xsheet-error-text-color: rgb(255, 123, 123);
@xsheet-selected-text-color: @text-color;
@xsheet-currentFrame-text-color: @text-color;
@xsheet-bg-color: darken(@bg, 3);
@xsheet-empty-bg-color: @bg;
@xsheet-LightLine-color: rgba(0, 0, 0, 0.2);
@xsheet-MarkerLine-color: rgba(255, 255, 255, 0.15);
@xsheet-SecMarkerLine-color: rgba(255, 255, 255, 0.25);
@xsheet-SelectedMarkerLine-color: @xsheet-MarkerLine-color;
@xsheet-VerticalLine-color: rgba(0, 0, 0, 0.3);
@xsheet-VerticalLineHead-color: darken(@bg, 13);
@xsheet-PreviewFrameText-color: @label-title;
@xsheet-CurrentRowBG-color: fade(@hl-bg-color, 70);
@xsheet-OnionSkinAreaBG-color: darken(@bg, 6);
@xsheet-EmptyColumnHead-color: @bg;
@xsheet-ColumnHeadPastelizer-color: rgba(0, 0, 0, 0);
@xsheet-SelectedColumnHead-color: fade(tint(@cellHighlightTintColor, 80), 30);
@xsheet-PlayRange-Color: @bg;
@xsheet-LightBG-color: lighten(@bg, 65.8824);
@xsheet-DarkBG-color: lighten(@bg, 60.0000);
@xsheet-DarkLine-color: lighten(@bg, 30.5882);
@xsheet-ColumnIconLine-color: @accent;
@xsheet-CellArea-bg-color-focus: rgb(0, 0, 0);
@xsheet-CellFocus-color: #000;
@xsheet-FoldedColumnBG-color: lighten(@bg, 10);
@xsheet-FoldedColumnLine-color: darken(@bg, 5);
@xsheet-CurrentTimeIndicator-color: rgb(255, 0, 0);
// Level Type Colors Adjustment
@columnBorderDesaturation: 0;
@columnBorderDarkness: 10;
@cellHighlightLightness: -20;
@cellHighlightDesaturation: 8;
@cellHighlightTintColor: @hl-bg-color;
@cellHighlightTintAmount: 77;
@xsheet-EmptyCell-color: @xsheet-OnionSkinAreaBG-color;
@xsheet-NotEmptyColumn-color: darken(@bg, 3);
@xsheet-SelectedEmptyCell-color: fade(mix(lighten(@xsheet-EmptyCell-color, 20), @cellHighlightTintColor, 80), 50);
@xsheet-LevelColumn-color: #4C6E4C;
@xsheet-VectorColumn-color: #7B7B4C;
@xsheet-ChildColumn-color: #6b4e69;
@xsheet-FullColorColumn-color: #657A96;
@xsheet-FxColumn-color: #5e5645;
@xsheet-ReferenceColumn-color: lighten(@bg, 5);
@xsheet-PaletteColumn-color: #42756e;
@xsheet-MeshColumn-color: #594d75;
@xsheet-MetaColumn-color: #8c8c8c;
@xsheet-SoundTextColumn-color: #a7a7a7;
@xsheet-SoundColumn-color: #578a8a;
@xsheet-SoundColumnHL-color: #34FE5E;
@xsheet-SoundColumnTrack-color: rgba(0,0,0,0.8);
@xsheet-SoundPreviewTool-color: darken(@xsheet-SoundColumnTrack-color, 20);
@xsheet-ActiveCamera-color: #4073a3;
@xsheet-OtherCamera-color: #5e9aa3;
@xsheet-Table-color: #62628c;
@xsheet-Peg-color: #9f6e3c;
// Orientation: XSheet
@xsheet-ColumnNameBg-color: rgba(0, 0, 0, 0);
@xsheet-DragBarHighlight-color: rgba(255, 255, 255, 0.15);
@xsheet-PreviewButtonBgOn-color: rgba(200, 200, 100, 1);
@xsheet-CamstandButtonBgOn-color: rgba(235, 144, 107, 1);
@xsheet-LockButtonBgOn-color: rgba(255, 255, 255, 0.6);
@xsheet-ConfigButtonBg-color: rgba(255, 255, 255, 0);
// Orientation: Timeline
@timeline-FrameRangeMarkerLine-color: lighten(@bg, 15);
@timeline-IconLine-color: @xsheet-VerticalLine-color;
// -----------------------------------------------------------------------------
// Schematic Viewer
// -----------------------------------------------------------------------------
// Node Viewer
@schematic-viewer-bg-color: darken(@bg, 5);
@schematic-label-text-color: #a0e680;
// Help Button
@schematic-help-button-bg-color: transparent;
@schematic-help-button-bg-color-hover: @button-bg-color-hover;
// Node Type Colors Adjustment
@nodeLightness: 0;
@nodeSaturation: 0;
@schematic-TableColor: #62628c;
@schematic-ActiveCameraColor: @xsheet-ActiveCamera-color;
@schematic-OtherCameraColor: @xsheet-OtherCamera-color;
@schematic-GroupColor: #3b6e9c;
@schematic-PegColor: #9f6e3c;
@schematic-SplineColor: #6a9d1c;
@schematic-ActiveOutputcolor: @xsheet-ActiveCamera-color;
@schematic-OtherOutputcolor: @xsheet-OtherCamera-color;
@schematic-XsheetColor: #62628c;
@schematic-PassThroughColor: #858585;
@schematic-NormalFxColor: #5b90a3;
@schematic-MacroFxColor: #815c79;
@schematic-ImageAdjustFxColor: #656287;
@schematic-LayerBlendingFxColor: #57958f;
@schematic-MatteFxColor: #ae7171;
// Node Selected Color
@schematic-SelectedBorderColor: rgb(255, 255, 255);
// All Node Link Colors
@schematic-LinkColor: rgb(223, 223, 223);
@schematic-SelectedLinkColor: cyan;
// Motion Path Link Colors
@schematic-MotionPathLinkColor: #94ee1e;
@schematic-MotionPathSelectedLinkColor: yellow;
// For Column Based Schematic Nodes: Use the Xsheet viewer colors by default
@schematic-text-color: @xsheet-text-color;
@schematic-VerticalLine-color: @xsheet-VerticalLine-color;
@schematic-PreviewButtonBgOn-color: @xsheet-PreviewButtonBgOn-color;
@schematic-PreviewButtonBgOff-color: @xsheet-ReferenceColumn-color;
@schematic-CamstandButtonBgOn-color: @xsheet-CamstandButtonBgOn-color;
@schematic-CamstandButtonBgOff-color: @xsheet-ReferenceColumn-color;
// -----------------------------------------------------------------------------
// Keyframes
// -----------------------------------------------------------------------------
@keyframe-off-color: rgba(0, 0, 0, 0);
@keyframe-off-color-hover: @toolbutton-bg-color-hover;
@keyframe-off-border-color: @keyframe-off-color;
@keyframe-off-border-color-hover: @keyframe-off-color-hover;
@keyframe-total-color: #be7323;
@keyframe-total-color-hover: lighten(@keyframe-total-color, 10);
@keyframe-total-border-color: @keyframe-total-color;
@keyframe-total-border-color-hover: @keyframe-total-color-hover;
@keyframe-partial-color: @keyframe-total-color;
@keyframe-partial-color-hover: @keyframe-total-color-hover;
@keyframe-partial-border-color: @keyframe-partial-color;
@keyframe-partial-border-color-hover: @keyframe-partial-color-hover;
// FX Settings Panel Only
@keyframe-highlight-color: rgba(255, 255, 255, 0.3);
@keyframe-highlight-border-color: @keyframe-highlight-color;
@keyframe-inbetween-color: #80795b;
@keyframe-inbetween-border-color: @keyframe-inbetween-color;
@keyframe-modified-color: rgb(190, 176, 98);
@keyframe-modified-border-color: @keyframe-modified-color;
// -----------------------------------------------------------------------------
// Function Editor
// -----------------------------------------------------------------------------
// Function Treeview
@function-treeview-text-color: @text-color;
// Function Curve Panel
@function-panel-bg-color: darken(@bg, 5);
@function-panel-ValueLine-color: lighten(@function-panel-bg-color, 4);
@function-panel-FrameLine-color: lighten(@function-panel-bg-color, 8);
@function-panel-OtherCurves-color: lighten(@function-panel-bg-color, 30);
@function-panel-RulerBG-color: darken(@function-panel-bg-color, 3);
@function-panel-Text-color: @text-color;
@function-panel-Sub-color: @function-panel-bg-color;
@function-panel-Selected-color: #FFA500;
// Function Spreadsheet Viewer
@function-LightLightBG-color: @xsheet-OnionSkinAreaBG-color;
@function-SelectedSceneRangeEmpty-color: @xsheet-SelectedEmptyCell-color;
@function-ColumnHeaderBorder-color: darken(@bg, 13);
@function-ColumnHeaderBG-color: @xsheet-NotEmptyColumn-color;
// Keyframe Colors
@function-KeyFrame-color: darken(desaturate(spin(@keyframe-total-color, 0.0000), 0.7570), 8.4314);
@function-KeyFrameBorder-color: lighten(@function-KeyFrame-color, 20);
@function-SelectedKeyFrame-color: mix(shade(@function-KeyFrame-color, -40), @cellHighlightTintColor, 60);
@function-IgnoredKeyFrame-color: rgb(172,42,57);
@function-SelectedIgnoredKeyFrame-color: mix(shade(@function-IgnoredKeyFrame-color, -40), @cellHighlightTintColor, 60);
@function-Inbetween-color: darken(desaturate(spin(@keyframe-inbetween-color, 0.4423), 4.8071), 7.2549);
@function-InbetweenBorder-color: lighten(@keyframe-inbetween-color, 20);
@function-SelectedInbetween-color: mix(shade(@function-Inbetween-color, @cellHighlightLightness), @cellHighlightTintColor, @cellHighlightTintAmount);
@function-IgnoredInbetween-color: rgb(138,105,94);
@function-SelectedIgnoredInbetween-color: mix(shade(@function-IgnoredInbetween-color, @cellHighlightLightness), @cellHighlightTintColor, @cellHighlightTintAmount);
// Expression Field
@function-ExpressionFieldBG-color: lighten(@bg, 61.9608);
@function-ExpressionFieldBorder-color: darken(@bg, 8.2353);