@stackoverflow/stacks 0.74.0 → 1.0.0-beta.0

package/dist/css/stacks-flexgrid-shim.min.css

@@ -1 +0,0 @@
-.grid{display:flex}.grid__fl0,.grid__fl0>.grid,.grid__fl0>.grid--cell{flex:0 auto}.grid__fl1,.grid__fl1>.grid,.grid__fl1>.grid--cell{flex:1 auto}.grid--cell1{flex-basis:8.33333333%}.grid--cell2{flex-basis:16.66666667%}.grid--cell3{flex-basis:25%}.grid--cell4{flex-basis:33.33333333%}.grid--cell5{flex-basis:41.66666667%}.grid--cell6{flex-basis:50%}.grid--cell7{flex-basis:58.33333333%}.grid--cell8{flex-basis:66.66666667%}.grid--cell9{flex-basis:75%}.grid--cell10{flex-basis:83.33333333%}.grid--cell11{flex-basis:91.66666667%}.grid--cell12{flex-basis:100%}.grid__allcells1>.grid,.grid__allcells1>.grid--cell{flex-basis:8.33333333%}.grid__allcells2>.grid,.grid__allcells2>.grid--cell{flex-basis:16.66666667%}.grid__allcells3>.grid,.grid__allcells3>.grid--cell{flex-basis:25%}.grid__allcells4>.grid,.grid__allcells4>.grid--cell{flex-basis:33.33333333%}.grid__allcells5>.grid,.grid__allcells5>.grid--cell{flex-basis:41.66666667%}.grid__allcells6>.grid,.grid__allcells6>.grid--cell{flex-basis:50%}.grid__allcells7>.grid,.grid__allcells7>.grid--cell{flex-basis:58.33333333%}.grid__allcells8>.grid,.grid__allcells8>.grid--cell{flex-basis:66.66666667%}.grid__allcells9>.grid,.grid__allcells9>.grid--cell{flex-basis:75%}.grid__allcells10>.grid,.grid__allcells10>.grid--cell{flex-basis:83.33333333%}.grid__allcells11>.grid,.grid__allcells11>.grid--cell{flex-basis:91.66666667%}.grid__allcells12>.grid,.grid__allcells12>.grid--cell{flex-basis:100%}.gs2{margin:-1px}.gs2>.grid,.gs2>.grid--cell{margin:1px}.gs2>.grid--cell1{margin:1px}.gs2.grid__allcells1>.grid,.gs2.grid__allcells1>.grid--cell,.gs2>.grid--cell1{flex-basis:calc(8.333333333333334% - 2px)}.gs2>.grid--cell2{margin:1px}.gs2.grid__allcells2>.grid,.gs2.grid__allcells2>.grid--cell,.gs2>.grid--cell2{flex-basis:calc(16.666666666666668% - 2px)}.gs2>.grid--cell3{margin:1px}.gs2.grid__allcells3>.grid,.gs2.grid__allcells3>.grid--cell,.gs2>.grid--cell3{flex-basis:calc(25% - 2px)}.gs2>.grid--cell4{margin:1px}.gs2.grid__allcells4>.grid,.gs2.grid__allcells4>.grid--cell,.gs2>.grid--cell4{flex-basis:calc(33.333333333333336% - 2px)}.gs2>.grid--cell5{margin:1px}.gs2.grid__allcells5>.grid,.gs2.grid__allcells5>.grid--cell,.gs2>.grid--cell5{flex-basis:calc(41.666666666666664% - 2px)}.gs2>.grid--cell6{margin:1px}.gs2.grid__allcells6>.grid,.gs2.grid__allcells6>.grid--cell,.gs2>.grid--cell6{flex-basis:calc(50% - 2px)}.gs2>.grid--cell7{margin:1px}.gs2.grid__allcells7>.grid,.gs2.grid__allcells7>.grid--cell,.gs2>.grid--cell7{flex-basis:calc(58.333333333333336% - 2px)}.gs2>.grid--cell8{margin:1px}.gs2.grid__allcells8>.grid,.gs2.grid__allcells8>.grid--cell,.gs2>.grid--cell8{flex-basis:calc(66.66666666666667% - 2px)}.gs2>.grid--cell9{margin:1px}.gs2.grid__allcells9>.grid,.gs2.grid__allcells9>.grid--cell,.gs2>.grid--cell9{flex-basis:calc(75% - 2px)}.gs2>.grid--cell10{margin:1px}.gs2.grid__allcells10>.grid,.gs2.grid__allcells10>.grid--cell,.gs2>.grid--cell10{flex-basis:calc(83.33333333333333% - 2px)}.gs2>.grid--cell11{margin:1px}.gs2.grid__allcells11>.grid,.gs2.grid__allcells11>.grid--cell,.gs2>.grid--cell11{flex-basis:calc(91.66666666666667% - 2px)}.gs2>.grid--cell12{margin:1px}.gs2.grid__allcells12>.grid,.gs2.grid__allcells12>.grid--cell,.gs2>.grid--cell12{flex-basis:calc(100% - 2px)}.gs4{margin:-2px}.gs4>.grid,.gs4>.grid--cell{margin:2px}.gs4>.grid--cell1{margin:2px}.gs4.grid__allcells1>.grid,.gs4.grid__allcells1>.grid--cell,.gs4>.grid--cell1{flex-basis:calc(8.333333333333334% - 4px)}.gs4>.grid--cell2{margin:2px}.gs4.grid__allcells2>.grid,.gs4.grid__allcells2>.grid--cell,.gs4>.grid--cell2{flex-basis:calc(16.666666666666668% - 4px)}.gs4>.grid--cell3{margin:2px}.gs4.grid__allcells3>.grid,.gs4.grid__allcells3>.grid--cell,.gs4>.grid--cell3{flex-basis:calc(25% - 4px)}.gs4>.grid--cell4{margin:2px}.gs4.grid__allcells4>.grid,.gs4.grid__allcells4>.grid--cell,.gs4>.grid--cell4{flex-basis:calc(33.333333333333336% - 4px)}.gs4>.grid--cell5{margin:2px}.gs4.grid__allcells5>.grid,.gs4.grid__allcells5>.grid--cell,.gs4>.grid--cell5{flex-basis:calc(41.666666666666664% - 4px)}.gs4>.grid--cell6{margin:2px}.gs4.grid__allcells6>.grid,.gs4.grid__allcells6>.grid--cell,.gs4>.grid--cell6{flex-basis:calc(50% - 4px)}.gs4>.grid--cell7{margin:2px}.gs4.grid__allcells7>.grid,.gs4.grid__allcells7>.grid--cell,.gs4>.grid--cell7{flex-basis:calc(58.333333333333336% - 4px)}.gs4>.grid--cell8{margin:2px}.gs4.grid__allcells8>.grid,.gs4.grid__allcells8>.grid--cell,.gs4>.grid--cell8{flex-basis:calc(66.66666666666667% - 4px)}.gs4>.grid--cell9{margin:2px}.gs4.grid__allcells9>.grid,.gs4.grid__allcells9>.grid--cell,.gs4>.grid--cell9{flex-basis:calc(75% - 4px)}.gs4>.grid--cell10{margin:2px}.gs4.grid__allcells10>.grid,.gs4.grid__allcells10>.grid--cell,.gs4>.grid--cell10{flex-basis:calc(83.33333333333333% - 4px)}.gs4>.grid--cell11{margin:2px}.gs4.grid__allcells11>.grid,.gs4.grid__allcells11>.grid--cell,.gs4>.grid--cell11{flex-basis:calc(91.66666666666667% - 4px)}.gs4>.grid--cell12{margin:2px}.gs4.grid__allcells12>.grid,.gs4.grid__allcells12>.grid--cell,.gs4>.grid--cell12{flex-basis:calc(100% - 4px)}.gs8{margin:-4px}.gs8>.grid,.gs8>.grid--cell{margin:4px}.gs8>.grid--cell1{margin:4px}.gs8.grid__allcells1>.grid,.gs8.grid__allcells1>.grid--cell,.gs8>.grid--cell1{flex-basis:calc(8.333333333333334% - 8px)}.gs8>.grid--cell2{margin:4px}.gs8.grid__allcells2>.grid,.gs8.grid__allcells2>.grid--cell,.gs8>.grid--cell2{flex-basis:calc(16.666666666666668% - 8px)}.gs8>.grid--cell3{margin:4px}.gs8.grid__allcells3>.grid,.gs8.grid__allcells3>.grid--cell,.gs8>.grid--cell3{flex-basis:calc(25% - 8px)}.gs8>.grid--cell4{margin:4px}.gs8.grid__allcells4>.grid,.gs8.grid__allcells4>.grid--cell,.gs8>.grid--cell4{flex-basis:calc(33.333333333333336% - 8px)}.gs8>.grid--cell5{margin:4px}.gs8.grid__allcells5>.grid,.gs8.grid__allcells5>.grid--cell,.gs8>.grid--cell5{flex-basis:calc(41.666666666666664% - 8px)}.gs8>.grid--cell6{margin:4px}.gs8.grid__allcells6>.grid,.gs8.grid__allcells6>.grid--cell,.gs8>.grid--cell6{flex-basis:calc(50% - 8px)}.gs8>.grid--cell7{margin:4px}.gs8.grid__allcells7>.grid,.gs8.grid__allcells7>.grid--cell,.gs8>.grid--cell7{flex-basis:calc(58.333333333333336% - 8px)}.gs8>.grid--cell8{margin:4px}.gs8.grid__allcells8>.grid,.gs8.grid__allcells8>.grid--cell,.gs8>.grid--cell8{flex-basis:calc(66.66666666666667% - 8px)}.gs8>.grid--cell9{margin:4px}.gs8.grid__allcells9>.grid,.gs8.grid__allcells9>.grid--cell,.gs8>.grid--cell9{flex-basis:calc(75% - 8px)}.gs8>.grid--cell10{margin:4px}.gs8.grid__allcells10>.grid,.gs8.grid__allcells10>.grid--cell,.gs8>.grid--cell10{flex-basis:calc(83.33333333333333% - 8px)}.gs8>.grid--cell11{margin:4px}.gs8.grid__allcells11>.grid,.gs8.grid__allcells11>.grid--cell,.gs8>.grid--cell11{flex-basis:calc(91.66666666666667% - 8px)}.gs8>.grid--cell12{margin:4px}.gs8.grid__allcells12>.grid,.gs8.grid__allcells12>.grid--cell,.gs8>.grid--cell12{flex-basis:calc(100% - 8px)}.gs12{margin:-6px}.gs12>.grid,.gs12>.grid--cell{margin:6px}.gs12>.grid--cell1{margin:6px}.gs12.grid__allcells1>.grid,.gs12.grid__allcells1>.grid--cell,.gs12>.grid--cell1{flex-basis:calc(8.333333333333334% - 12px)}.gs12>.grid--cell2{margin:6px}.gs12.grid__allcells2>.grid,.gs12.grid__allcells2>.grid--cell,.gs12>.grid--cell2{flex-basis:calc(16.666666666666668% - 12px)}.gs12>.grid--cell3{margin:6px}.gs12.grid__allcells3>.grid,.gs12.grid__allcells3>.grid--cell,.gs12>.grid--cell3{flex-basis:calc(25% - 12px)}.gs12>.grid--cell4{margin:6px}.gs12.grid__allcells4>.grid,.gs12.grid__allcells4>.grid--cell,.gs12>.grid--cell4{flex-basis:calc(33.333333333333336% - 12px)}.gs12>.grid--cell5{margin:6px}.gs12.grid__allcells5>.grid,.gs12.grid__allcells5>.grid--cell,.gs12>.grid--cell5{flex-basis:calc(41.666666666666664% - 12px)}.gs12>.grid--cell6{margin:6px}.gs12.grid__allcells6>.grid,.gs12.grid__allcells6>.grid--cell,.gs12>.grid--cell6{flex-basis:calc(50% - 12px)}.gs12>.grid--cell7{margin:6px}.gs12.grid__allcells7>.grid,.gs12.grid__allcells7>.grid--cell,.gs12>.grid--cell7{flex-basis:calc(58.333333333333336% - 12px)}.gs12>.grid--cell8{margin:6px}.gs12.grid__allcells8>.grid,.gs12.grid__allcells8>.grid--cell,.gs12>.grid--cell8{flex-basis:calc(66.66666666666667% - 12px)}.gs12>.grid--cell9{margin:6px}.gs12.grid__allcells9>.grid,.gs12.grid__allcells9>.grid--cell,.gs12>.grid--cell9{flex-basis:calc(75% - 12px)}.gs12>.grid--cell10{margin:6px}.gs12.grid__allcells10>.grid,.gs12.grid__allcells10>.grid--cell,.gs12>.grid--cell10{flex-basis:calc(83.33333333333333% - 12px)}.gs12>.grid--cell11{margin:6px}.gs12.grid__allcells11>.grid,.gs12.grid__allcells11>.grid--cell,.gs12>.grid--cell11{flex-basis:calc(91.66666666666667% - 12px)}.gs12>.grid--cell12{margin:6px}.gs12.grid__allcells12>.grid,.gs12.grid__allcells12>.grid--cell,.gs12>.grid--cell12{flex-basis:calc(100% - 12px)}.gs16{margin:-8px}.gs16>.grid,.gs16>.grid--cell{margin:8px}.gs16>.grid--cell1{margin:8px}.gs16.grid__allcells1>.grid,.gs16.grid__allcells1>.grid--cell,.gs16>.grid--cell1{flex-basis:calc(8.333333333333334% - 16px)}.gs16>.grid--cell2{margin:8px}.gs16.grid__allcells2>.grid,.gs16.grid__allcells2>.grid--cell,.gs16>.grid--cell2{flex-basis:calc(16.666666666666668% - 16px)}.gs16>.grid--cell3{margin:8px}.gs16.grid__allcells3>.grid,.gs16.grid__allcells3>.grid--cell,.gs16>.grid--cell3{flex-basis:calc(25% - 16px)}.gs16>.grid--cell4{margin:8px}.gs16.grid__allcells4>.grid,.gs16.grid__allcells4>.grid--cell,.gs16>.grid--cell4{flex-basis:calc(33.333333333333336% - 16px)}.gs16>.grid--cell5{margin:8px}.gs16.grid__allcells5>.grid,.gs16.grid__allcells5>.grid--cell,.gs16>.grid--cell5{flex-basis:calc(41.666666666666664% - 16px)}.gs16>.grid--cell6{margin:8px}.gs16.grid__allcells6>.grid,.gs16.grid__allcells6>.grid--cell,.gs16>.grid--cell6{flex-basis:calc(50% - 16px)}.gs16>.grid--cell7{margin:8px}.gs16.grid__allcells7>.grid,.gs16.grid__allcells7>.grid--cell,.gs16>.grid--cell7{flex-basis:calc(58.333333333333336% - 16px)}.gs16>.grid--cell8{margin:8px}.gs16.grid__allcells8>.grid,.gs16.grid__allcells8>.grid--cell,.gs16>.grid--cell8{flex-basis:calc(66.66666666666667% - 16px)}.gs16>.grid--cell9{margin:8px}.gs16.grid__allcells9>.grid,.gs16.grid__allcells9>.grid--cell,.gs16>.grid--cell9{flex-basis:calc(75% - 16px)}.gs16>.grid--cell10{margin:8px}.gs16.grid__allcells10>.grid,.gs16.grid__allcells10>.grid--cell,.gs16>.grid--cell10{flex-basis:calc(83.33333333333333% - 16px)}.gs16>.grid--cell11{margin:8px}.gs16.grid__allcells11>.grid,.gs16.grid__allcells11>.grid--cell,.gs16>.grid--cell11{flex-basis:calc(91.66666666666667% - 16px)}.gs16>.grid--cell12{margin:8px}.gs16.grid__allcells12>.grid,.gs16.grid__allcells12>.grid--cell,.gs16>.grid--cell12{flex-basis:calc(100% - 16px)}.gs24{margin:-12px}.gs24>.grid,.gs24>.grid--cell{margin:12px}.gs24>.grid--cell1{margin:12px}.gs24.grid__allcells1>.grid,.gs24.grid__allcells1>.grid--cell,.gs24>.grid--cell1{flex-basis:calc(8.333333333333334% - 24px)}.gs24>.grid--cell2{margin:12px}.gs24.grid__allcells2>.grid,.gs24.grid__allcells2>.grid--cell,.gs24>.grid--cell2{flex-basis:calc(16.666666666666668% - 24px)}.gs24>.grid--cell3{margin:12px}.gs24.grid__allcells3>.grid,.gs24.grid__allcells3>.grid--cell,.gs24>.grid--cell3{flex-basis:calc(25% - 24px)}.gs24>.grid--cell4{margin:12px}.gs24.grid__allcells4>.grid,.gs24.grid__allcells4>.grid--cell,.gs24>.grid--cell4{flex-basis:calc(33.333333333333336% - 24px)}.gs24>.grid--cell5{margin:12px}.gs24.grid__allcells5>.grid,.gs24.grid__allcells5>.grid--cell,.gs24>.grid--cell5{flex-basis:calc(41.666666666666664% - 24px)}.gs24>.grid--cell6{margin:12px}.gs24.grid__allcells6>.grid,.gs24.grid__allcells6>.grid--cell,.gs24>.grid--cell6{flex-basis:calc(50% - 24px)}.gs24>.grid--cell7{margin:12px}.gs24.grid__allcells7>.grid,.gs24.grid__allcells7>.grid--cell,.gs24>.grid--cell7{flex-basis:calc(58.333333333333336% - 24px)}.gs24>.grid--cell8{margin:12px}.gs24.grid__allcells8>.grid,.gs24.grid__allcells8>.grid--cell,.gs24>.grid--cell8{flex-basis:calc(66.66666666666667% - 24px)}.gs24>.grid--cell9{margin:12px}.gs24.grid__allcells9>.grid,.gs24.grid__allcells9>.grid--cell,.gs24>.grid--cell9{flex-basis:calc(75% - 24px)}.gs24>.grid--cell10{margin:12px}.gs24.grid__allcells10>.grid,.gs24.grid__allcells10>.grid--cell,.gs24>.grid--cell10{flex-basis:calc(83.33333333333333% - 24px)}.gs24>.grid--cell11{margin:12px}.gs24.grid__allcells11>.grid,.gs24.grid__allcells11>.grid--cell,.gs24>.grid--cell11{flex-basis:calc(91.66666666666667% - 24px)}.gs24>.grid--cell12{margin:12px}.gs24.grid__allcells12>.grid,.gs24.grid__allcells12>.grid--cell,.gs24>.grid--cell12{flex-basis:calc(100% - 24px)}.gs32{margin:-16px}.gs32>.grid,.gs32>.grid--cell{margin:16px}.gs32>.grid--cell1{margin:16px}.gs32.grid__allcells1>.grid,.gs32.grid__allcells1>.grid--cell,.gs32>.grid--cell1{flex-basis:calc(8.333333333333334% - 32px)}.gs32>.grid--cell2{margin:16px}.gs32.grid__allcells2>.grid,.gs32.grid__allcells2>.grid--cell,.gs32>.grid--cell2{flex-basis:calc(16.666666666666668% - 32px)}.gs32>.grid--cell3{margin:16px}.gs32.grid__allcells3>.grid,.gs32.grid__allcells3>.grid--cell,.gs32>.grid--cell3{flex-basis:calc(25% - 32px)}.gs32>.grid--cell4{margin:16px}.gs32.grid__allcells4>.grid,.gs32.grid__allcells4>.grid--cell,.gs32>.grid--cell4{flex-basis:calc(33.333333333333336% - 32px)}.gs32>.grid--cell5{margin:16px}.gs32.grid__allcells5>.grid,.gs32.grid__allcells5>.grid--cell,.gs32>.grid--cell5{flex-basis:calc(41.666666666666664% - 32px)}.gs32>.grid--cell6{margin:16px}.gs32.grid__allcells6>.grid,.gs32.grid__allcells6>.grid--cell,.gs32>.grid--cell6{flex-basis:calc(50% - 32px)}.gs32>.grid--cell7{margin:16px}.gs32.grid__allcells7>.grid,.gs32.grid__allcells7>.grid--cell,.gs32>.grid--cell7{flex-basis:calc(58.333333333333336% - 32px)}.gs32>.grid--cell8{margin:16px}.gs32.grid__allcells8>.grid,.gs32.grid__allcells8>.grid--cell,.gs32>.grid--cell8{flex-basis:calc(66.66666666666667% - 32px)}.gs32>.grid--cell9{margin:16px}.gs32.grid__allcells9>.grid,.gs32.grid__allcells9>.grid--cell,.gs32>.grid--cell9{flex-basis:calc(75% - 32px)}.gs32>.grid--cell10{margin:16px}.gs32.grid__allcells10>.grid,.gs32.grid__allcells10>.grid--cell,.gs32>.grid--cell10{flex-basis:calc(83.33333333333333% - 32px)}.gs32>.grid--cell11{margin:16px}.gs32.grid__allcells11>.grid,.gs32.grid__allcells11>.grid--cell,.gs32>.grid--cell11{flex-basis:calc(91.66666666666667% - 32px)}.gs32>.grid--cell12{margin:16px}.gs32.grid__allcells12>.grid,.gs32.grid__allcells12>.grid--cell,.gs32>.grid--cell12{flex-basis:calc(100% - 32px)}.gs48{margin:-24px}.gs48>.grid,.gs48>.grid--cell{margin:24px}.gs48>.grid--cell1{margin:24px}.gs48.grid__allcells1>.grid,.gs48.grid__allcells1>.grid--cell,.gs48>.grid--cell1{flex-basis:calc(8.333333333333334% - 48px)}.gs48>.grid--cell2{margin:24px}.gs48.grid__allcells2>.grid,.gs48.grid__allcells2>.grid--cell,.gs48>.grid--cell2{flex-basis:calc(16.666666666666668% - 48px)}.gs48>.grid--cell3{margin:24px}.gs48.grid__allcells3>.grid,.gs48.grid__allcells3>.grid--cell,.gs48>.grid--cell3{flex-basis:calc(25% - 48px)}.gs48>.grid--cell4{margin:24px}.gs48.grid__allcells4>.grid,.gs48.grid__allcells4>.grid--cell,.gs48>.grid--cell4{flex-basis:calc(33.333333333333336% - 48px)}.gs48>.grid--cell5{margin:24px}.gs48.grid__allcells5>.grid,.gs48.grid__allcells5>.grid--cell,.gs48>.grid--cell5{flex-basis:calc(41.666666666666664% - 48px)}.gs48>.grid--cell6{margin:24px}.gs48.grid__allcells6>.grid,.gs48.grid__allcells6>.grid--cell,.gs48>.grid--cell6{flex-basis:calc(50% - 48px)}.gs48>.grid--cell7{margin:24px}.gs48.grid__allcells7>.grid,.gs48.grid__allcells7>.grid--cell,.gs48>.grid--cell7{flex-basis:calc(58.333333333333336% - 48px)}.gs48>.grid--cell8{margin:24px}.gs48.grid__allcells8>.grid,.gs48.grid__allcells8>.grid--cell,.gs48>.grid--cell8{flex-basis:calc(66.66666666666667% - 48px)}.gs48>.grid--cell9{margin:24px}.gs48.grid__allcells9>.grid,.gs48.grid__allcells9>.grid--cell,.gs48>.grid--cell9{flex-basis:calc(75% - 48px)}.gs48>.grid--cell10{margin:24px}.gs48.grid__allcells10>.grid,.gs48.grid__allcells10>.grid--cell,.gs48>.grid--cell10{flex-basis:calc(83.33333333333333% - 48px)}.gs48>.grid--cell11{margin:24px}.gs48.grid__allcells11>.grid,.gs48.grid__allcells11>.grid--cell,.gs48>.grid--cell11{flex-basis:calc(91.66666666666667% - 48px)}.gs48>.grid--cell12{margin:24px}.gs48.grid__allcells12>.grid,.gs48.grid__allcells12>.grid--cell,.gs48>.grid--cell12{flex-basis:calc(100% - 48px)}.gs64{margin:-32px}.gs64>.grid,.gs64>.grid--cell{margin:32px}.gs64>.grid--cell1{margin:32px}.gs64.grid__allcells1>.grid,.gs64.grid__allcells1>.grid--cell,.gs64>.grid--cell1{flex-basis:calc(8.333333333333334% - 64px)}.gs64>.grid--cell2{margin:32px}.gs64.grid__allcells2>.grid,.gs64.grid__allcells2>.grid--cell,.gs64>.grid--cell2{flex-basis:calc(16.666666666666668% - 64px)}.gs64>.grid--cell3{margin:32px}.gs64.grid__allcells3>.grid,.gs64.grid__allcells3>.grid--cell,.gs64>.grid--cell3{flex-basis:calc(25% - 64px)}.gs64>.grid--cell4{margin:32px}.gs64.grid__allcells4>.grid,.gs64.grid__allcells4>.grid--cell,.gs64>.grid--cell4{flex-basis:calc(33.333333333333336% - 64px)}.gs64>.grid--cell5{margin:32px}.gs64.grid__allcells5>.grid,.gs64.grid__allcells5>.grid--cell,.gs64>.grid--cell5{flex-basis:calc(41.666666666666664% - 64px)}.gs64>.grid--cell6{margin:32px}.gs64.grid__allcells6>.grid,.gs64.grid__allcells6>.grid--cell,.gs64>.grid--cell6{flex-basis:calc(50% - 64px)}.gs64>.grid--cell7{margin:32px}.gs64.grid__allcells7>.grid,.gs64.grid__allcells7>.grid--cell,.gs64>.grid--cell7{flex-basis:calc(58.333333333333336% - 64px)}.gs64>.grid--cell8{margin:32px}.gs64.grid__allcells8>.grid,.gs64.grid__allcells8>.grid--cell,.gs64>.grid--cell8{flex-basis:calc(66.66666666666667% - 64px)}.gs64>.grid--cell9{margin:32px}.gs64.grid__allcells9>.grid,.gs64.grid__allcells9>.grid--cell,.gs64>.grid--cell9{flex-basis:calc(75% - 64px)}.gs64>.grid--cell10{margin:32px}.gs64.grid__allcells10>.grid,.gs64.grid__allcells10>.grid--cell,.gs64>.grid--cell10{flex-basis:calc(83.33333333333333% - 64px)}.gs64>.grid--cell11{margin:32px}.gs64.grid__allcells11>.grid,.gs64.grid__allcells11>.grid--cell,.gs64>.grid--cell11{flex-basis:calc(91.66666666666667% - 64px)}.gs64>.grid--cell12{margin:32px}.gs64.grid__allcells12>.grid,.gs64.grid__allcells12>.grid--cell,.gs64>.grid--cell12{flex-basis:calc(100% - 64px)}.gsx,.gsx>.grid,.gsx>[class*=grid--cell]{margin-top:0;margin-bottom:0}.gsy,.gsy>.grid,.gsy>[class*=grid--cell]{margin-right:0;margin-left:0}.s-btn.grid{display:flex}

package/lib/css/atomic/_stacks-spacing.less

@@ -1,162 +0,0 @@
-//
-//  STACK OVERFLOW
-//  SPACING
-//
-//  This CSS comes from Stacks, our CSS & Pattern library for rapidly building
-//  Stack Overflow. For documentation of all these classes and how to contribute,
-//  visit https://stackoverflow.design/
-//
-//  • MARGIN
-//  • PADDING
-//  • POSITIONING
-//
-//  ============================================================================
-//  $   MARGIN
-//  ----------------------------------------------------------------------------
-//  $$  All margin
-#stacks-internals #build-classes(
-    responsive,
-    '.m', { .template(@value) { margin: @value !important; } },
-    0 (@su2/2) @su2 @su4 @su6 @su8 @su12 @su16 @su24 @su32 @su48 @su64 @su96 @su128 auto -@su2 -@su4 -@su6 -@su8 -@su12 -@su16 -@su24 -@su32 -@su48 -@su64 -@su96 -@su128
-);
-
-//  $$  Top margin
-#stacks-internals #build-classes(
-    responsive,
-    '.mt', { .template(@value) { margin-top: @value !important; } },
-    0 (@su2/2) @su2 @su4 @su6 @su8 @su12 @su16 @su24 @su32 @su48 @su64 @su96 @su128
-);
-
-//  $$ Negative & auto top margin
-#stacks-internals #build-classes(
-    '.mt', { .template(@value) { margin-top: @value !important; } },
-    auto -(@su2/2) -@su2 -@su4 -@su6 -@su8 -@su12 -@su16 -@su24 -@su32 -@su48 -@su64 -@su96 -@su128
-);
-
-//  $$  Right margin
-#stacks-internals #build-classes(
-    responsive,
-    '.mr', { .template(@value) { margin-right: @value !important; } },
-    0 (@su2/2) @su2 @su4 @su6 @su8 @su12 @su16 @su24 @su32 @su48 @su64 @su96 @su128
-);
-
-//  $$ Negative & auto right margin
-#stacks-internals #build-classes(
-    '.mr', { .template(@value) { margin-right: @value !important; } },
-    auto -(@su2/2) -@su2 -@su4 -@su6 -@su8 -@su12 -@su16 -@su24 -@su32 -@su48 -@su64 -@su96 -@su128
-);
-
-//  $$  Bottom margin
-#stacks-internals #build-classes(
-    responsive,
-    '.mb', { .template(@value) { margin-bottom: @value !important; } },
-    0 (@su2/2) @su2 @su4 @su6 @su8 @su12 @su16 @su24 @su32 @su48 @su64 @su96 @su128
-);
-
-//  $$ Negative & auto bottom margin
-#stacks-internals #build-classes(
-    '.mb', { .template(@value) { margin-bottom: @value !important; } },
-    auto -(@su2/2) -@su2 -@su4 -@su6 -@su8 -@su12 -@su16 -@su24 -@su32 -@su48 -@su64 -@su96 -@su128
-);
-
-//  $$  Left margin
-#stacks-internals #build-classes(
-    responsive,
-    '.ml', { .template(@value) { margin-left: @value !important; } },
-    0 (@su2/2) @su2 @su4 @su6 @su8 @su12 @su16 @su24 @su32 @su48 @su64 @su96 @su128
-);
-
-//  $$ Negative & auto left margin
-#stacks-internals #build-classes(
-    '.ml', { .template(@value) { margin-left: @value !important; } },
-    auto -(@su2/2) -@su2 -@su4 -@su6 -@su8 -@su12 -@su16 -@su24 -@su32 -@su48 -@su64 -@su96 -@su128
-);
-
-//  $$  X-Axis margin
-#stacks-internals #build-classes(
-    '.mx', { .template(@value) { margin-left: @value !important; margin-right: @value !important; } },
-    0 (@su2/2) @su2 @su4 @su6 @su8 @su12 @su16 @su24 @su32 @su48 @su64 @su96 @su128 auto -(@su2/2) -@su2 -@su4 -@su8 -@su12 -@su16 -@su24 -@su32 -@su48 -@su64 -@su96 -@su128
-);
-
-//  $$  Y-Axis margin
-#stacks-internals #build-classes(
-    '.my', { .template(@value) { margin-top: @value !important; margin-bottom: @value !important; } },
-    0 (@su2/2) @su2 @su4 @su6 @su8 @su12 @su16 @su24 @su32 @su48 @su64 @su96 @su128 auto -(@su2/2) -@su2 -@su4 -@su8 -@su12 -@su16 -@su24 -@su32 -@su48 -@su64 -@su96 -@su128
-);
-
-//  ============================================================================
-//  $   PADDING
-//  ----------------------------------------------------------------------------
-//  $$  All padding
-#stacks-internals #build-classes(
-    responsive,
-    '.p', { .template(@value) { padding: @value !important; } },
-    0 (@su2/2) @su2 @su4 @su6 @su8 @su12 @su16 @su24 @su32 @su48 @su64 @su96 @su128
-);
-
-//  $$  Top Padding
-#stacks-internals #build-classes(
-    responsive,
-    '.pt', { .template(@value) { padding-top: @value !important; } },
-    0 (@su2/2) @su2 @su4 @su6 @su8 @su12 @su16 @su24 @su32 @su48 @su64 @su96 @su128
-);
-
-//  $$  Right Padding
-#stacks-internals #build-classes(
-    responsive,
-    '.pr', { .template(@value) { padding-right: @value !important; } },
-    0 (@su2/2) @su2 @su4 @su6 @su8 @su12 @su16 @su24 @su32 @su48 @su64 @su96 @su128
-);
-
-//  $$  Bottom Padding
-#stacks-internals #build-classes(
-    responsive,
-    '.pb', { .template(@value) { padding-bottom: @value !important; } },
-    0 (@su2/2) @su2 @su4 @su6 @su8 @su12 @su16 @su24 @su32 @su48 @su64 @su96 @su128
-);
-
-//  $$  Left Padding
-#stacks-internals #build-classes(
-    responsive,
-    '.pl', { .template(@value) { padding-left: @value !important; } },
-    0 (@su2/2) @su2 @su4 @su6 @su8 @su12 @su16 @su24 @su32 @su48 @su64 @su96 @su128
-);
-
-//  $$  X-Axis Padding
-#stacks-internals #build-classes(
-    '.px', { .template(@value) { padding-left: @value !important; padding-right: @value !important; } },
-    0 (@su2/2) @su2 @su4 @su6 @su8 @su12 @su16 @su24 @su32 @su48 @su64 @su96 @su128
-);
-
-//  $$  Y-Axis Padding
-#stacks-internals #build-classes(
-    '.py', { .template(@value) { padding-top: @value !important; padding-bottom: @value !important; } },
-    0 (@su2/2) @su2 @su4 @su6 @su8 @su12 @su16 @su24 @su32 @su48 @su64 @su96 @su128
-);
-
-//  ============================================================================
-//  $   POSITIONING
-//  ----------------------------------------------------------------------------
-//  $$ Top
-#stacks-internals #build-classes(
-    '.t', { .template(@value) { top: @value !important; } },
-    0 1px -1px @su2 -@su2 @su4 -@su4 @su6 -@su6 @su8 -@su8 @su12 -@su12 @su16 -@su16 @su24 -@su24 @su32 -@su32 @su48 -@su48 @su64 -@su64 @su96 -@su96 @su128 -@su128 50% -50% 100% -100%
-);
-
-//  $$ Right
-#stacks-internals #build-classes(
-    '.r', { .template(@value) { right: @value !important; } },
-    0 1px -1px @su2 -@su2 @su4 -@su4 @su6 -@su6 @su8 -@su8 @su12 -@su12 @su16 -@su16 @su24 -@su24 @su32 -@su32 @su48 -@su48 @su64 -@su64 @su96 -@su96 @su128 -@su128 50% -50% 100% -100%
-);
-
-//  $$ Bottom
-#stacks-internals #build-classes(
-    '.b', { .template(@value) { bottom: @value !important; } },
-    0 1px -1px @su2 -@su2 @su4 -@su4 @su6 -@su6 @su8 -@su8 @su12 -@su12 @su16 -@su16 @su24 -@su24 @su32 -@su32 @su48 -@su48 @su64 -@su64 @su96 -@su96 @su128 -@su128 50% -50% 100% -100%
-);
-
-//  $$ Left
-#stacks-internals #build-classes(
-    '.l', { .template(@value) { left: @value !important; } },
-    0 1px -1px @su2 -@su2 @su4 -@su4 @su6 -@su6 @su8 -@su8 @su12 -@su12 @su16 -@su16 @su24 -@su24 @su32 -@su32 @su48 -@su48 @su64 -@su64 @su96 -@su96 @su128 -@su128 50% -50% 100% -100%
-);

package/lib/css/atomic/_stacks-width-height.less

@@ -1,189 +0,0 @@
-//
-//  STACK OVERFLOW
-//  WIDTH & HEIGHT
-//
-//  This CSS comes from Stacks, our CSS & Pattern library for rapidly building
-//  Stack Overflow. For documentation of all these classes and how to contribute,
-//  visit https://stackoverflow.design/
-//
-//  • WIDTH
-//      • PERCENTAGE
-//      • STATIC
-//  • MAX-WIDTH
-//  • MIN-WIDTH
-//  • HEIGHT
-//      • PERCENTAGE
-//      • STATIC
-//  • MAX-HEIGHT
-//  • MIN-HEIGHT
-//
-//  ============================================================================
-//  $  WIDTH
-//  ----------------------------------------------------------------------------
-//  $$  PERCENTAGE
-.w0 { width: 0 !important; }
-.w10 { width: 10% !important; }
-.w20 { width: 20% !important; }
-#stacks-internals #responsify('.w25', { width: 25% !important; });
-.w30 { width: 30% !important; }
-#stacks-internals #responsify('.w33', { width: 33.33333% !important; });
-.w40 { width: 40% !important; }
-#stacks-internals #responsify('.w50', { width: 50% !important; });
-.w60 { width: 60% !important; }
-#stacks-internals #responsify('.w66', { width: 66.66667% !important; });
-.w70 { width: 70% !important; }
-#stacks-internals #responsify('.w75', { width: 75% !important; });
-.w80 { width: 80% !important; }
-.w90 { width: 90% !important; }
-#stacks-internals #responsify('.w100', { width: 100% !important; });
-#stacks-internals #responsify('.w-auto', { width: auto !important; });
-
-//  $$  STATIC
-.ws0,
-.w0 { width: 0 !important; }
-.ws1 { width: @s-step !important; }
-.ws2 { width: @s-step * 2 !important; }
-.ws3 { width: @s-step * 3 !important; }
-.ws4 { width: @s-step * 4 !important; }
-.ws5 { width: @s-step * 5 !important; }
-.ws6 { width: @s-step * 6 !important; }
-.ws7 { width: @s-step * 7 !important; }
-.ws8 { width: @s-step * 8 !important; }
-.ws9 { width: @s-step * 9 !important; }
-.ws10 { width: @s-step * 10 !important; }
-.ws11 { width: @s-step * 11 !important; }
-.ws12 { width: @s-full !important; }
-
-//  $$  SPACING UNITS
-.w2 { width: @su2 !important; }
-.w4 { width: @su4 !important; }
-.w6 { width: @su6 !important; }
-.w8 { width: @su8 !important; }
-.w12 { width: @su12 !important; }
-.w16 { width: @su16 !important; }
-.w24 { width: @su24 !important; }
-.w32 { width: @su32 !important; }
-.w48 { width: @su48 !important; }
-.w64 { width: @su64 !important; }
-.w96 { width: @su96 !important; }
-.w128 { width: @su128 !important; }
-
-//  ============================================================================
-//  $  MAX-WIDTH
-//  ----------------------------------------------------------------------------
-.wmx0 { max-width: 0 !important; }
-.wmx1 { max-width: @s-step !important; }
-.wmx2 { max-width: @s-step * 2 !important; }
-.wmx25 { max-width: 25% !important; }
-.wmx3 { max-width: @s-step * 3 !important; }
-.wmx4 { max-width: @s-step * 4 !important; }
-.wmx5 { max-width: @s-step * 5 !important; }
-.wmx50 { max-width: 50% !important; }
-.wmx6 { max-width: @s-step * 6 !important; }
-.wmx7 { max-width: @s-step * 7 !important; }
-.wmx75 { max-width: 75% !important; }
-.wmx8 { max-width: @s-step * 8 !important; }
-.wmx9 { max-width: @s-step * 9 !important; }
-.wmx10 { max-width: @s-step * 10 !important; }
-.wmx11 { max-width: @s-step * 11 !important; }
-.wmx12 { max-width: @s-full !important; }
-#stacks-internals #responsify('.wmx100', { max-width: 100% !important; });
-#stacks-internals #responsify('.wmx-initial', { max-width: initial !important; });
-
-//  ============================================================================
-//  $  MIN-WIDTH
-//  ----------------------------------------------------------------------------
-.wmn0 { min-width: 0 !important; }
-.wmn1 { min-width: @s-step !important; }
-.wmn2 { min-width: @s-step * 2 !important; }
-.wmn25 { min-width: 25% !important; }
-.wmn3 { min-width: @s-step * 3 !important; }
-.wmn4 { min-width: @s-step * 4 !important; }
-.wmn5 { min-width: @s-step * 5 !important; }
-.wmn50 { min-width: 50% !important; }
-.wmn6 { min-width: @s-step * 6 !important; }
-.wmn7 { min-width: @s-step * 7 !important; }
-.wmn75 { min-width: 75% !important; }
-.wmn8 { min-width: @s-step * 8 !important; }
-.wmn9 { min-width: @s-step * 9 !important; }
-.wmn10 { min-width: @s-step * 10 !important; }
-.wmn11 { min-width: @s-step * 11 !important; }
-.wmn12 { min-width: @s-full !important; }
-#stacks-internals #responsify('.wmn100', { min-width: 100% !important; });
-#stacks-internals #responsify('.wmn-initial', { min-width: initial !important; });
-
-//  ============================================================================
-//  $  HEIGHT
-//  ----------------------------------------------------------------------------
-//  $$  PERCENTAGE
-.h0 { height: 0 !important; }
-#stacks-internals #responsify('.h100', { height: 100% !important; });
-#stacks-internals #responsify('.h-auto', { height: auto !important; });
-
-//  $$  STATIC
-.hs0,
-.h0 { height: 0 !important; }
-.hs1 { height: @s-step !important; }
-.hs2 { height: @s-step * 2 !important; }
-.hs3 { height: @s-step * 3 !important; }
-.hs4 { height: @s-step * 4 !important; }
-.hs5 { height: @s-step * 5 !important; }
-.hs6 { height: @s-step * 6 !important; }
-.hs7 { height: @s-step * 7 !important; }
-.hs8 { height: @s-step * 8 !important; }
-.hs9 { height: @s-step * 9 !important; }
-.hs10 { height: @s-step * 10 !important; }
-.hs11 { height: @s-step * 11 !important; }
-.hs12 { height: @s-full !important; }
-
-//  $$  SPACING UNITS
-.h2 { height: @su2 !important; }
-.h4 { height: @su4 !important; }
-.h6 { height: @su6 !important; }
-.h8 { height: @su8 !important; }
-.h12 { height: @su12 !important; }
-.h16 { height: @su16 !important; }
-.h24 { height: @su24 !important; }
-.h32 { height: @su32 !important; }
-.h48 { height: @su48 !important; }
-.h64 { height: @su64 !important; }
-.h96 { height: @su96 !important; }
-.h128 { height: @su128 !important; }
-
-//  ============================================================================
-//  $  MAX-HEIGHT
-//  ----------------------------------------------------------------------------
-.hmx0 { max-height: 0 !important; }
-.hmx1 { max-height: @s-step !important; }
-.hmx2 { max-height: @s-step * 2 !important; }
-.hmx3 { max-height: @s-step * 3 !important; }
-.hmx4 { max-height: @s-step * 4 !important; }
-.hmx5 { max-height: @s-step * 5 !important; }
-.hmx6 { max-height: @s-step * 6 !important; }
-.hmx7 { max-height: @s-step * 7 !important; }
-.hmx8 { max-height: @s-step * 8 !important; }
-.hmx9 { max-height: @s-step * 9 !important; }
-.hmx10 { max-height: @s-step * 10 !important; }
-.hmx11 { max-height: @s-step * 11 !important; }
-.hmx12 { max-height: @s-full !important; }
-#stacks-internals #responsify('.hmx100', { max-height: 100% !important; });
-#stacks-internals #responsify('.hmx-initial', { max-height: initial !important; });
-
-//  ============================================================================
-//  $  MIN-HEIGHT
-//  ----------------------------------------------------------------------------
-.hmn0 { min-height: 0 !important; }
-.hmn1 { min-height: @s-step !important; }
-.hmn2 { min-height: @s-step * 2 !important; }
-.hmn3 { min-height: @s-step * 3 !important; }
-.hmn4 { min-height: @s-step * 4 !important; }
-.hmn5 { min-height: @s-step * 5 !important; }
-.hmn6 { min-height: @s-step * 6 !important; }
-.hmn7 { min-height: @s-step * 7 !important; }
-.hmn8 { min-height: @s-step * 8 !important; }
-.hmn9 { min-height: @s-step * 9 !important; }
-.hmn10 { min-height: @s-step * 10 !important; }
-.hmn11 { min-height: @s-step * 11 !important; }
-.hmn12 { min-height: @s-full !important; }
-#stacks-internals #responsify('.hmn100', { min-height: 100% !important; });
-#stacks-internals #responsify('.hmn-initial', { min-height: initial !important; });

package/lib/css/base/_stacks-configuration-dynamic.less

@@ -1,106 +0,0 @@
-// Some small parts of Stacks is configurable, so e.g. different Stack Exchange communities
-// can have different button styles. The default styles are the Stack Overflow brand styles.
-// To compile a modified version of stacks, create a LESS file that imports Stacks and
-// modifies the configuration, e.g. like this:
-//
-//     @import "path/to/stacks.less";
-//
-//     #stacks-config {
-//         @button-primary-background-color: magenta;
-//     }
-//
-// These configuration options only apply to the "dynamic" part of Stacks, which (on the Q&A sites) gets
-// compiled into the site's primary.css. The "static" part of Stacks, which is a shared CSS file across
-// all Q&A sites, has no access to these options.
-//
-// A few global configuration options that are per-project, not per-site, and thus apply to the static part
-// as well, are in _stacks-configuration-static.less
-
-#stacks-config {
-    //  Overall body element properties
-    @body-font-color:                                var(--theme-body-font-color);
-    @body-type-face:                                 var(--theme-body-font-family);
-    @body-background:                                var(--white);
-    @body-site-width:                                1060px; // DEPRECATED will be removed in a future release
-
-    // DEPRECATED will be removed in a future release
-    //  Button Muted
-    @button-muted-color:                             var(--black-500);
-    @button-muted-hover-color:                       var(--black-600);
-    @button-muted-hover-background-color:            var(--black-025);
-    @button-muted-active-background-color:           var(--black-050);
-    @button-muted-selected-color:                    var(--black-700);
-    @button-muted-selected-background-color:         var(--black-075);
-
-    // DEPRECATED will be removed in a future release
-    //  Button Muted Outlined
-    @button-muted-outlined-border-color:             var(--black-300);
-    @button-muted-outlined-selected-border-color:    var(--black-400);
-
-    // DEPRECATED will be removed in a future release
-    //  Button Muted Filled
-    @button-muted-filled-color:                      var(--black-700);
-    @button-muted-filled-background-color:           var(--black-100);
-    @button-muted-filled-hover-color:                var(--black-700);
-    @button-muted-filled-hover-background-color:     var(--black-150);
-    @button-muted-filled-active-background-color:    var(--black-200);
-    @button-muted-filled-selected-color:             var(--black-800);
-    @button-muted-filled-selected-background-color:  var(--black-350);
-
-    // DEPRECATED will be removed in a future release
-    //  Button Danger
-    @button-danger-color:                            var(--red-600);
-    @button-danger-hover-color:                      var(--red-700);
-    @button-danger-hover-background-color:           var(--red-050);
-    @button-danger-active-background-color:          var(--red-100);
-    @button-danger-selected-color:                   var(--red-900);
-    @button-danger-selected-background-color:        var(--red-200);
-
-    // DEPRECATED will be removed in a future release
-    //  Button Danger Outlined
-    @button-danger-outlined-border-color:            var(--red-500);
-    @button-danger-outlined-selected-border-color:   var(--red-600);
-
-    // DEPRECATED will be removed in a future release
-    //  Button Danger Filled
-    @button-danger-filled-color:                     @white;
-    @button-danger-filled-background-color:          var(--red-500);
-    @button-danger-filled-hover-color:               @white;
-    @button-danger-filled-hover-background-color:    var(--red-600);
-    @button-danger-filled-active-background-color:   var(--red-700);
-    @button-danger-filled-selected-color:            var(--white);
-    @button-danger-filled-selected-background-color: var(--red-800);
-    @button-danger-filled-number-color:              var(--black-900);
-
-    // DEPRECATED will be removed in a future release
-    //  Tags
-    @tags-moderator-border:                          var(--red-200);
-    @tags-moderator-background:                      var(--red-050);
-    @tags-moderator-color:                           var(--red-800);
-    @tags-moderator-hover-border:                    var(--red-300);
-    @tags-moderator-hover-background:                var(--red-100);
-    @tags-moderator-hover-color:                     var(--red-900);
-    @tags-moderator-selected-border:                 var(--red-400);
-    @tags-moderator-selected-background:             var(--red-200);
-    @tags-moderator-selected-color:                  var(--red-800);
-
-    @tags-required-border:                           var(--bc-darker);
-    @tags-required-background:                       var(--black-075);
-    @tags-required-color:                            var(--black-700);
-    @tags-required-hover-border:                     var(--black-300);
-    @tags-required-hover-background:                 var(--black-100);
-    @tags-required-hover-color:                      var(--black-800);
-    @tags-required-selected-border:                  var(--black-500);
-    @tags-required-selected-background:              var(--black-200);
-    @tags-required-selected-color:                   var(--black-900);
-
-    @tags-muted-border:                              transparent;
-    @tags-muted-background:                          var(--black-075);
-    @tags-muted-color:                               var(--black-700);
-    @tags-muted-hover-border:                        transparent;
-    @tags-muted-hover-background:                    var(--black-100);
-    @tags-muted-hover-color:                         var(--black-800);
-    @tags-muted-selected-border:                     transparent;
-    @tags-muted-selected-background:                 var(--black-200);
-    @tags-muted-selected-color:                      var(--black-900);
-}

package/lib/css/exports/_stacks-constants-helpers.less

@@ -1,139 +0,0 @@
-//
-//  STACK OVERFLOW
-//  CONSTANTS -- HELPERS
-//
-//  This CSS comes from Stacks, our CSS & Pattern library for rapidly building
-//  Stack Overflow. For documentation of all these classes and how to contribute,
-//  visit https://stackoverflow.design/
-//
-//  These are helper variables to quickly set values.
-//  These SHOULD NOT be reset.
-//
-//  Table of Contents
-//  • z-index (zi-)
-//  • border-radius (br-)
-//  • box-shadow (bs-)
-//  • spacing units (su-)
-//  • transition easings (te-)
-//
-//  ============================================================================
-//  $   Z-INDEX (zi-)
-//      Used for a bird's eye view of components dependent on the z-axis.
-//      Try to avoid customizing these.
-//  ----------------------------------------------------------------------------
-@zi-hide:               -1;     //  Hide something all the elements
-@zi-base:               0;      //  Reset to 0
-@zi-selected:           25;     //  Pop above siblings
-@zi-active:             30;     //  Pop above selected siblings
-@zi-dropdown:           1000;   //  Dropdowns
-@zi-popovers:           2000;   //  Popovers, Popups, Autocompletes
-@zi-tooltips:           3000;   //  Tooltips
-@zi-banners:            4000;   //  Banners
-@zi-navigation:         5000;   //  Navigation Bars
-@zi-navigation-fixed:   5050;   //  Fixed navigation bars
-@zi-modals:             9000;   //  Modals
-@zi-modals-background:  @zi-modals - 50;
-
-//  ============================================================================
-//  $   RESPONSIVE BREAKPOINTS
-//  ----------------------------------------------------------------------------
-@breakpoint-lg: 1264px;
-@breakpoint-md: 980px;
-@breakpoint-sm: 640px;
-
-//  ============================================================================
-//  $   BORDER RADIUS (br-)
-//  ----------------------------------------------------------------------------
-@br-sm:                 3px;
-@br-md:                 5px;
-@br-lg:                 7px;
-@br-circle:             50%;
-
-//  ============================================================================
-//  $  SPACING UNITS (su-)
-//  ----------------------------------------------------------------------------
-@su1:                   1px;
-@su2:                   2px;
-@su4:                   4px;
-@su6:                   6px;
-@su8:                   8px;
-@su12:                  12px;
-@su16:                  16px;
-@su24:                  24px;
-@su32:                  32px;
-@su48:                  48px;
-@su64:                  64px;
-@su96:                  96px;
-@su128:                 128px;
-
-
-//  ============================================================================
-//  $  SIZING UNITS (su-)
-//  ----------------------------------------------------------------------------
-@s-full: 97.2307692rem; // Based on a pixel size of 1264px;
-@s-step: (@s-full / 12);
-
-// TODO These helpers allow us to create our own timing functions with
-// cubic-bezier ~ but perhaps the default timing functions are acceptable?
-
-//  ============================================================================
-//  $   TRANSITION EASINGS (te-)
-//  ----------------------------------------------------------------------------
-@te-smooth-slow:        cubic-bezier(0.25, 0.46, 0.45, 0.94);       // easeOutQuad
-@te-smooth:             cubic-bezier(0.165, 0.84, 0.44, 1);         // easeOutQuart
-@te-smooth-quick:       cubic-bezier(0.19, 1, 0.22, 1);             // easeOutExpo
-@te-back-out:           cubic-bezier(0.175, 0.885, 0.32, 1.275);    // easeOutBack
-@te-back-in-out:        cubic-bezier(0.68, -0.55, 0.265, 1.55);     // easeInOutBack
-@te-ease-in:            cubic-bezier(0.47, 0, 0.745, 0.715);        // easeIn
-@te-ease-in-out:        cubic-bezier(0.445, 0.05, 0.55, 0.95);      // easeInOut
-@te-ease-out:           cubic-bezier(0.39, 0.575, 0.565, 1);        // easeOut
-
-@default-transition-duration:       0.1s;
-@transition-time:                   @default-transition-duration;
-
-
-//  ============================================================================
-//  $   SCROLLBAR STYLING
-//  ----------------------------------------------------------------------------
-@scrollbar-styles: {
-    &::-webkit-scrollbar {
-        width: @su12 - @su2;
-        height: @su12 - @su2;
-        background-color: transparent;
-    }
-
-    &::-webkit-scrollbar-track {
-        border-radius: @su12 - @su2;
-        background-color: transparent;
-    }
-
-    &::-webkit-scrollbar-thumb {
-        border-radius: @su12 - @su2;
-        background-color: var(--scrollbar);
-    }
-
-    &::-webkit-scrollbar-corner {
-        background-color: transparent;
-        border-color: transparent;
-    }
-
-    scrollbar-color: var(--scrollbar) transparent;
-}
-
-//  ============================================================================
-//  $   FOCUS STYLING
-//  ----------------------------------------------------------------------------
-@focus-styles: {
-    // Hide focus styles if they're not needed, for example,
-    // when an element receives focus via the mouse.
-    &:focus:not(:focus-visible) {
-        outline: none;
-        box-shadow: none;
-    }
-
-    // Show focus styles on keyboard focus.
-    &:focus-visible {
-        outline: none;
-        box-shadow: 0 0 0 @su4 var(--focus-ring-muted);
-    }
-}