/*!
 * GRRR - CSS Grid System
 * Copyright (c) 2024 Atonal Studio
 * Licensed under the MIT License
 * For details, see: https://github.com/atonalstudio/grrr
 */@property --_grrr-canvas-width{syntax:"<length>";inherits:true;initial-value:0px}.grrr{--_grrr-canvas-width: 100cqw;display:grid;grid-auto-rows:auto;grid-auto-flow:row;grid-column:1/-1;align-content:start;width:100%;container-type:inline-size;--_grrr-cols: var(--grrr-cols, 12);--_grrr-gutter: var(--grrr-gutter, 18px);--_grrr-col-width: var(--grrr-col-width, 84px);--_grrr-col-flex-width: var(--grrr-fluid-col, minmax(0, var(--_grrr-col-width)));--_grrr-margin-left: var(--grrr-margin-left, var(--grrr-margin, 20px));--_grrr-margin-right: var(--grrr-margin-right, var(--grrr-margin, 20px));--_grrr-off-left: var(--grrr-off-left, var(--grrr-off, minmax(0, 1fr)));--_grrr-off-right: var(--grrr-off-right, var(--grrr-off, minmax(0, 1fr)));--_grrr-gutters-total-width: calc(var(--_grrr-gutter) * (var(--_grrr-cols) - 1));--_grrr-margins-total-width: calc(var(--_grrr-margin-left) + var(--_grrr-margin-right));--_grrr-board-width: calc(var(--grrr-canvas-width, var(--_grrr-canvas-width)) - (var(--_grrr-margins-total-width) + var(--_grrr-gutters-total-width)));--grrr-use-col-responsive-width: calc( var(--_grrr-board-width) / var(--_grrr-cols) );--grrr-use-col-width: min( var(--_grrr-col-width), var(--grrr-use-col-responsive-width) );--grrr-unstill: var(--_grrr-col-flex-width);--grrr-use-fluid-col: minmax(0, 1fr);--grrr-use-board-fluid-width: calc(var(--grrr-canvas-width, var(--_grrr-canvas-width)) - var(--_grrr-margins-total-width));--grrr-use-board-width: min( var(--grrr-use-board-fluid-width), calc(var(--_grrr-cols) * var(--_grrr-col-width) + var(--_grrr-gutters-total-width)) );--grrr-use-off-total-width: max(0px, calc( var(--grrr-canvas-width, var(--_grrr-canvas-width)) - var(--_grrr-margins-total-width) - var(--grrr-use-board-width) ));--grrr-use-off-width: calc(var(--grrr-use-off-total-width) / 2)}.grrr--still{--_grrr-still-start: var(--grrr-still-start, 3);--_grrr-still-end: var(--grrr-still-end, 10);--_grrr-still-cols: calc(var(--_grrr-still-end) - var(--_grrr-still-start) + 1);--_grrr-still-col-width: calc((100% - (var(--_grrr-margins-total-width) + var(--_grrr-gutter) * (var(--_grrr-still-cols) - 1))) / var(--_grrr-still-cols));--_grrr-still-col-flex-width: min(var(--_grrr-still-col-width), var(--_grrr-col-width));--_grrr-still-col: var(--grrr-still, min(var(--_grrr-still-col-width), var(--_grrr-col-width)))}.grrr{grid-template-columns:[full-start margin-start] var(--_grrr-margin-left) [margin-end off-start] var(--_grrr-off-left) [off-end board-start col-start] repeat(calc(var(--_grrr-cols) - 1), var(--_grrr-col-flex-width) [col-end gutter-start] var(--_grrr-gutter) [gutter-end col-start]) var(--_grrr-col-flex-width) [col-end board-end off-start] var(--_grrr-off-right) [off-end margin-start] var(--_grrr-margin-right) [margin-end full-end]}.grrr--fluid{--grrr-off: 0;--grrr-fluid-col: var(--grrr-use-fluid-col)}.grrr--still{--grrr-use-still-area: col-start var(--_grrr-still-start) / col-end var(--_grrr-still-end);grid-template-columns:[full-start margin-start] var(--_grrr-margin-left) [margin-end off-start] var(--_grrr-off-left) [off-end board-start col-start] repeat(calc(var(--_grrr-still-start) - 1), var(--_grrr-col-flex-width) [col-end gutter-start] minmax(0, var(--_grrr-gutter)) [gutter-end col-start]) repeat(calc(var(--_grrr-still-cols) - 1), var(--_grrr-still-col) [col-end gutter-start] var(--_grrr-gutter) [gutter-end col-start]) var(--_grrr-still-col) [col-end gutter-start] repeat(calc(var(--_grrr-cols) - var(--_grrr-still-end)), minmax(0, var(--_grrr-gutter)) [gutter-end col-start] var(--_grrr-col-flex-width) [col-end gutter-start]) [col-end board-end off-start] var(--_grrr-off-right) [off-end margin-start] var(--_grrr-margin-right) [margin-end full-end]}.grrr--still--from-first{--_grrr-still-start: 1 !important;grid-template-columns:[full-start margin-start] var(--_grrr-margin-left) [margin-end off-start] var(--_grrr-off-left) [off-end board-start col-start] repeat(calc(var(--_grrr-still-cols) - 1), var(--_grrr-still-col) [col-end gutter-start] var(--_grrr-gutter) [gutter-end col-start]) var(--_grrr-still-col) [col-end gutter-start] repeat(calc(var(--_grrr-cols) - var(--_grrr-still-end)), minmax(0, var(--_grrr-gutter)) [gutter-end col-start] var(--_grrr-col-flex-width) [col-end gutter-start]) [col-end board-end off-start] var(--_grrr-off-right) [off-end margin-start] var(--_grrr-margin-right) [margin-end full-end]}.grrr--still--to-last:not(.grrr--still--from-first){--_grrr-still-end: var(--_grrr-cols) !important;grid-template-columns:[full-start margin-start] var(--_grrr-margin-left) [margin-end off-start] var(--_grrr-off-left) [off-end board-start col-start] repeat(calc(var(--_grrr-still-start) - 1), var(--_grrr-col-flex-width) [col-end gutter-start] minmax(0, var(--_grrr-gutter)) [gutter-end col-start]) repeat(calc(var(--_grrr-still-cols) - 1), var(--_grrr-still-col) [col-end gutter-start] var(--_grrr-gutter) [gutter-end col-start]) var(--_grrr-still-col) [col-end board-end off-start] var(--_grrr-off-right) [off-end margin-start] var(--_grrr-margin-right) [margin-end full-end]}.grrr--still--off{--grrr-still: var(--grrr-unstill)}.grrr--inherit{display:inherit;grid-column:inherit;grid-template-columns:inherit;margin-inline:inherit;grid-auto-rows:inherit;grid-auto-flow:inherit;align-content:inherit;width:inherit}.grrr--unset{display:unset;grid-column:unset;grid-template-columns:unset;margin-inline:unset;grid-auto-rows:unset;grid-auto-flow:unset;align-content:unset;width:unset}
