/* * Bluelib Glass * by */ :where(.bluelib) { --b-panel-blur: 16px; --b-panel-initial-opacity: 0.3; --b-panel-nested-opacity: 0.075; } @supports (backdrop-filter: blur(var(--b-panel-blur))) { :where(.bluelib) :where(.panel), :where(.bluelib) :where(.table):where(.panel) > :where(.table-caption) { background-color: hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness) / var(--b-panel-initial-opacity)); backdrop-filter: blur(var(--b-panel-blur)) hue-rotate(calc(var(--bhsl-current-hue) - var(--bhsl-foreground-hue))); } :where(.bluelib) :where(.panel) :where(.panel), :where(.bluelib) :where(.table):where(.panel) > :where(.table-caption) :where(.panel) { background-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / var(--b-panel-nested-opacity)); backdrop-filter: none; } :where(.bluelib) :where(.modifier-mark), :where(.bluelib) :where(.panel):where(.modifier-mark) { background-color: hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness)); backdrop-filter: none; } :where(.bluelib) :where(.modifier-mark) :where(.modifier-mark), :where(.bluelib) :where(.panel):where(.modifier-mark) :where(.modifier-mark), :where(.bluelib) :where(.modifier-mark) :where(.panel):where(.modifier-mark), :where(.bluelib) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark) { background-color: hsl(var(--bhsl-background-hue) var(--bhsl-background-saturation) var(--bhsl-background-lightness)); } :where(.bluelib) :where(.modifier-mark) :where(.modifier-mark) :where(.modifier-mark), :where(.bluelib) :where(.panel):where(.modifier-mark) :where(.modifier-mark) :where(.modifier-mark), :where(.bluelib) :where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.modifier-mark), :where(.bluelib) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.modifier-mark), :where(.bluelib) :where(.modifier-mark) :where(.modifier-mark) :where(.panel):where(.modifier-mark), :where(.bluelib) :where(.panel):where(.modifier-mark) :where(.modifier-mark) :where(.panel):where(.modifier-mark), :where(.bluelib) :where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark), :where(.bluelib) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark) :where(.panel):where(.modifier-mark) { background-color: hsl(var(--bhsl-mark-background-hue) var(--bhsl-mark-background-saturation) var(--bhsl-mark-background-lightness)); } :where(.bluelib) :where(.modifier-todo), :where(.bluelib) :where(.panel):where(.modifier-todo) { background-color: hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness)); } :where(.bluelib) :where(.modifier-todo) :where(.panel), :where(.bluelib) :where(.panel):where(.modifier-todo) :where(.panel) { background-color: hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness)); backdrop-filter: none; } :where(.bluelib) :where(.panel):where(.modifier-todo) { background-color: hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness) / 0.3); backdrop-filter: blur(var(--b-panel-blur)) grayscale(100%); } :where(.bluelib) :where(.panel) :where(.panel):where(.modifier-todo) { background-color: hsl(var(--bhsl-todo-background-hue) var(--bhsl-todo-background-saturation) var(--bhsl-todo-background-lightness)); } }