/* webrad:C:\GitHub\WebRad\out\WebRad-win32-x64\.webrad-compiler-virtual\app.css */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root,
  :host {
    --font-sans:
      -apple-system,
      BlinkMacSystemFont,
      "Segoe UI",
      Roboto,
      "Helvetica Neue",
      "Noto Sans",
      Arial,
      sans-serif,
      "Apple Color Emoji",
      "Segoe UI Emoji",
      "Segoe UI Symbol",
      "Noto Color Emoji";
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --ease-out: cubic-bezier(0, 0, 0.2, 1);
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  }
}
@layer utilities {
  .cursor-pointer {
    cursor: pointer;
  }
  .flex-row {
    flex-direction: row;
  }
  .rounded-\[10px\] {
    border-radius: 10px;
  }
  .rounded-\[12px\] {
    border-radius: 12px;
  }
  .rounded-\[16px\] {
    border-radius: 16px;
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-\[1px\] {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-solid {
    --tw-border-style: solid;
    border-style: solid;
  }
  .\[border-style\:solid\] {
    border-style: solid;
  }
  .border-transparent {
    border-color: transparent;
  }
  .bg-\[linear-gradient\(to_bottom\,\#f8fbff\,\#eef2ff\)\] {
    background-image:
      linear-gradient(
        to bottom,
        #f8fbff,
        #eef2ff);
  }
  .object-cover {
    object-fit: cover;
  }
  .object-center {
    object-position: center;
  }
  .font-sans {
    font-family: var(--font-sans);
  }
  .text-\[14px\] {
    font-size: 14px;
  }
  .leading-\[20px\] {
    --tw-leading: 20px;
    line-height: 20px;
  }
  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .text-\[\#0f172a\] {
    color: #0f172a;
  }
  .text-\[\#334155\] {
    color: #334155;
  }
  .text-\[\#ffffff\] {
    color: #ffffff;
  }
  .shadow-sm {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow:
      var(--tw-inset-shadow),
      var(--tw-inset-ring-shadow),
      var(--tw-ring-offset-shadow),
      var(--tw-ring-shadow),
      var(--tw-shadow);
  }
  .transition-all {
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .transition-colors {
    transition-property:
      color,
      background-color,
      border-color,
      outline-color,
      text-decoration-color,
      fill,
      stroke,
      --tw-gradient-from,
      --tw-gradient-via,
      --tw-gradient-to;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .duration-\[200ms\] {
    --tw-duration: 200ms;
    transition-duration: 200ms;
  }
  .ease-out {
    --tw-ease: var(--ease-out);
    transition-timing-function: var(--ease-out);
  }
  .\[--wr-data-grid-button-background-color\:\#e0e7ff\] {
    --wr-data-grid-button-background-color: #e0e7ff;
  }
  .\[--wr-data-grid-button-border-color\:\#c7d2fe\] {
    --wr-data-grid-button-border-color: #c7d2fe;
  }
  .\[--wr-data-grid-button-border-radius\:6px\] {
    --wr-data-grid-button-border-radius: 6px;
  }
  .\[--wr-data-grid-button-border-style\:solid\] {
    --wr-data-grid-button-border-style: solid;
  }
  .\[--wr-data-grid-button-border-width\:1px\] {
    --wr-data-grid-button-border-width: 1px;
  }
  .\[--wr-data-grid-button-font-weight\:600\] {
    --wr-data-grid-button-font-weight: 600;
  }
  .\[--wr-data-grid-button-padding-x\:8px\] {
    --wr-data-grid-button-padding-x: 8px;
  }
  .\[--wr-data-grid-button-padding-y\:4px\] {
    --wr-data-grid-button-padding-y: 4px;
  }
  .\[--wr-data-grid-button-text-color\:\#1e3a8a\] {
    --wr-data-grid-button-text-color: #1e3a8a;
  }
  .\[--wr-data-grid-checkbox-accent-color\:\#2563eb\] {
    --wr-data-grid-checkbox-accent-color: #2563eb;
  }
  .\[--wr-data-grid-checkbox-font-weight\:500\] {
    --wr-data-grid-checkbox-font-weight: 500;
  }
  .\[--wr-data-grid-checkbox-gap\:6px\] {
    --wr-data-grid-checkbox-gap: 6px;
  }
  .\[--wr-data-grid-checkbox-size\:16px\] {
    --wr-data-grid-checkbox-size: 16px;
  }
  .\[--wr-data-grid-checkbox-text-color\:\#334155\] {
    --wr-data-grid-checkbox-text-color: #334155;
  }
  .\[--wr-data-grid-footer-background-color\:\#f8fafc\] {
    --wr-data-grid-footer-background-color: #f8fafc;
  }
  .\[--wr-data-grid-footer-border-color\:\#dbeafe\] {
    --wr-data-grid-footer-border-color: #dbeafe;
  }
  .\[--wr-data-grid-footer-font-weight\:500\] {
    --wr-data-grid-footer-font-weight: 500;
  }
  .\[--wr-data-grid-footer-text-color\:\#334155\] {
    --wr-data-grid-footer-text-color: #334155;
  }
  .\[--wr-data-grid-header-background-color\:\#e0e7ff\] {
    --wr-data-grid-header-background-color: #e0e7ff;
  }
  .\[--wr-data-grid-header-border-color\:\#c7d2fe\] {
    --wr-data-grid-header-border-color: #c7d2fe;
  }
  .\[--wr-data-grid-header-font-weight\:600\] {
    --wr-data-grid-header-font-weight: 600;
  }
  .\[--wr-data-grid-header-text-color\:\#1e3a8a\] {
    --wr-data-grid-header-text-color: #1e3a8a;
  }
  .\[background\:linear-gradient\(to_bottom\,\#ffffff\,\#f8fafc\)_padding-box\,linear-gradient\(to_bottom_right\,\#dbeafe\,\#e9d5ff\)_border-box\] {
    background:
      linear-gradient(
        to bottom,
        #ffffff,
        #f8fafc) padding-box,
      linear-gradient(
        to bottom right,
        #dbeafe,
        #e9d5ff) border-box;
  }
  .\[background\:linear-gradient\(to_bottom\,\#ffffff\,\#f8fbff\)_padding-box\,linear-gradient\(to_bottom_right\,\#bfdbfe\,\#ddd6fe\)_border-box\] {
    background:
      linear-gradient(
        to bottom,
        #ffffff,
        #f8fbff) padding-box,
      linear-gradient(
        to bottom right,
        #bfdbfe,
        #ddd6fe) border-box;
  }
  .\[background\:linear-gradient\(to_bottom_right\,\#2563eb\,\#7c3aed\)_padding-box\,linear-gradient\(to_bottom_right\,\#60a5fa\,\#a78bfa\)_border-box\] {
    background:
      linear-gradient(
        to bottom right,
        #2563eb,
        #7c3aed) padding-box,
      linear-gradient(
        to bottom right,
        #60a5fa,
        #a78bfa) border-box;
  }
  .\[background\:linear-gradient\(to_bottom_right\,\#eff6ff\,\#f5f3ff\)_padding-box\,linear-gradient\(to_bottom_right\,\#dbeafe\,\#e9d5ff\)_border-box\] {
    background:
      linear-gradient(
        to bottom right,
        #eff6ff,
        #f5f3ff) padding-box,
      linear-gradient(
        to bottom right,
        #dbeafe,
        #e9d5ff) border-box;
  }
  .focus-within\:shadow-md:focus-within {
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow:
      var(--tw-inset-shadow),
      var(--tw-inset-ring-shadow),
      var(--tw-ring-offset-shadow),
      var(--tw-ring-shadow),
      var(--tw-shadow);
  }
  .focus-within\:ring-\[2px\]:focus-within {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow:
      var(--tw-inset-shadow),
      var(--tw-inset-ring-shadow),
      var(--tw-ring-offset-shadow),
      var(--tw-ring-shadow),
      var(--tw-shadow);
  }
  .focus-within\:ring-\[\#93c5fd\]:focus-within {
    --tw-ring-color: #93c5fd;
  }
  .focus-within\:ring-offset-\[2px\]:focus-within {
    --tw-ring-offset-width: 2px;
    --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  }
  .focus-within\:ring-offset-\[\#ffffff\]:focus-within {
    --tw-ring-offset-color: #ffffff;
  }
  @media (hover: hover) {
    .hover\:translate-y-\[-1px\]:hover {
      --tw-translate-y: -1px;
      translate: var(--tw-translate-x) var(--tw-translate-y);
    }
    .hover\:scale-\[1\.02\]:hover {
      scale: 1.02;
    }
    .hover\:border:hover {
      border-style: var(--tw-border-style);
      border-width: 1px;
    }
    .hover\:\[border-style\:solid\]:hover {
      border-style: solid;
    }
    .hover\:border-transparent:hover {
      border-color: transparent;
    }
    .hover\:shadow-md:hover {
      --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
      box-shadow:
        var(--tw-inset-shadow),
        var(--tw-inset-ring-shadow),
        var(--tw-ring-offset-shadow),
        var(--tw-ring-shadow),
        var(--tw-shadow);
    }
    .hover\:\[background\:linear-gradient\(to_bottom_right\,\#3b82f6\,\#8b5cf6\)_padding-box\,linear-gradient\(to_bottom_right\,\#93c5fd\,\#c4b5fd\)_border-box\]:hover {
      background:
        linear-gradient(
          to bottom right,
          #3b82f6,
          #8b5cf6) padding-box,
        linear-gradient(
          to bottom right,
          #93c5fd,
          #c4b5fd) border-box;
    }
  }
  .focus\:shadow-md:focus {
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow:
      var(--tw-inset-shadow),
      var(--tw-inset-ring-shadow),
      var(--tw-ring-offset-shadow),
      var(--tw-ring-shadow),
      var(--tw-shadow);
  }
  .focus\:ring-\[2px\]:focus {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow:
      var(--tw-inset-shadow),
      var(--tw-inset-ring-shadow),
      var(--tw-ring-offset-shadow),
      var(--tw-ring-shadow),
      var(--tw-shadow);
  }
  .focus\:ring-\[\#93c5fd\]:focus {
    --tw-ring-color: #93c5fd;
  }
  .focus\:ring-offset-\[2px\]:focus {
    --tw-ring-offset-width: 2px;
    --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  }
  .focus\:ring-offset-\[\#ffffff\]:focus {
    --tw-ring-offset-color: #ffffff;
  }
  .active\:translate-y-\[0px\]:active {
    --tw-translate-y: 0px;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }
  .active\:border:active {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .active\:\[border-style\:solid\]:active {
    border-style: solid;
  }
  .active\:border-transparent:active {
    border-color: transparent;
  }
  .active\:shadow-sm:active {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow:
      var(--tw-inset-shadow),
      var(--tw-inset-ring-shadow),
      var(--tw-ring-offset-shadow),
      var(--tw-ring-shadow),
      var(--tw-shadow);
  }
  .active\:\[background\:linear-gradient\(to_bottom_right\,\#1d4ed8\,\#6d28d9\)_padding-box\,linear-gradient\(to_bottom_right\,\#60a5fa\,\#a78bfa\)_border-box\]:active {
    background:
      linear-gradient(
        to bottom right,
        #1d4ed8,
        #6d28d9) padding-box,
      linear-gradient(
        to bottom right,
        #60a5fa,
        #a78bfa) border-box;
  }
  .disabled\:cursor-not-allowed:disabled {
    cursor: not-allowed;
  }
  .disabled\:border-\[\#64748b\]:disabled {
    border-color: #64748b;
  }
  .disabled\:border-\[\#e2e8f0\]:disabled {
    border-color: #e2e8f0;
  }
  .disabled\:text-\[\#64748b\]:disabled {
    color: #64748b;
  }
  .disabled\:shadow-none:disabled {
    --tw-shadow: 0 0 #0000;
    box-shadow:
      var(--tw-inset-shadow),
      var(--tw-inset-ring-shadow),
      var(--tw-ring-offset-shadow),
      var(--tw-ring-shadow),
      var(--tw-shadow);
  }
  .disabled\:\[background\:\#64748b\]:disabled {
    background: #64748b;
  }
  .disabled\:\[background\:\#f1f5f9\]:disabled {
    background: #f1f5f9;
  }
  .aria-disabled\:cursor-not-allowed[aria-disabled=true] {
    cursor: not-allowed;
  }
  .aria-disabled\:border-\[\#64748b\][aria-disabled=true] {
    border-color: #64748b;
  }
  .aria-disabled\:border-\[\#e2e8f0\][aria-disabled=true] {
    border-color: #e2e8f0;
  }
  .aria-disabled\:text-\[\#64748b\][aria-disabled=true] {
    color: #64748b;
  }
  .aria-disabled\:shadow-none[aria-disabled=true] {
    --tw-shadow: 0 0 #0000;
    box-shadow:
      var(--tw-inset-shadow),
      var(--tw-inset-ring-shadow),
      var(--tw-ring-offset-shadow),
      var(--tw-ring-shadow),
      var(--tw-shadow);
  }
  .aria-disabled\:\[background\:\#64748b\][aria-disabled=true] {
    background: #64748b;
  }
  .aria-disabled\:\[background\:\#f1f5f9\][aria-disabled=true] {
    background: #f1f5f9;
  }
  .\[\&_\.wr-button-icon\]\:block .wr-button-icon {
    display: block;
  }
  .\[\&_\.wr-button-icon\]\:h-\[16px\]\! .wr-button-icon {
    height: 16px !important;
  }
  .\[\&_\.wr-button-icon\]\:w-\[16px\]\! .wr-button-icon {
    width: 16px !important;
  }
  .\[\&_\.wr-data-grid-button\]\:flex-row .wr-data-grid-button {
    flex-direction: row;
  }
  .\[\&_\.wr-data-grid-button_\.wr-button-icon\]\:h-\[16px\]\! .wr-data-grid-button .wr-button-icon {
    height: 16px !important;
  }
  .\[\&_\.wr-data-grid-button_\.wr-button-icon\]\:w-\[16px\]\! .wr-data-grid-button .wr-button-icon {
    width: 16px !important;
  }
  .\[\&_\.wr-data-grid-button_\.wr-button-icon\]\:text-current .wr-data-grid-button .wr-button-icon {
    color: currentcolor;
  }
  .\[\&_\.wr-data-grid-button_\.wr-data-grid-button-caption\]\:block .wr-data-grid-button .wr-data-grid-button-caption {
    display: block;
  }
  .\[\&_\.wr-data-grid-button-icon-slot\]\:block .wr-data-grid-button-icon-slot {
    display: block;
  }
  .\[\&_\[data-webrad-text-content\]\]\:bg-\[linear-gradient\(to_right\,\#334155\,\#2563eb\)\] [data-webrad-text-content] {
    background-image:
      linear-gradient(
        to right,
        #334155,
        #2563eb);
  }
  .\[\&_\[data-webrad-text-content\]\]\:bg-clip-text [data-webrad-text-content] {
    background-clip: text;
  }
  .\[\&_\[data-webrad-text-content\]\]\:text-transparent [data-webrad-text-content] {
    color: transparent;
  }
}
@layer components {
  :root {
    color-scheme: light dark;
    font-family:
      Inter,
      ui-sans-serif,
      system-ui,
      -apple-system,
      BlinkMacSystemFont,
      "Segoe UI",
      sans-serif;
    --wr-input-bg: #ffffff;
    --wr-muted-text: #657184;
    --wr-accent: #1479d3;
    --wr-control-border: #9da9b8;
    --wr-control-surface: #f5f7fa;
    --wr-button-bg: #edf1f6;
    --wr-button-hover: #dfe6ef;
  }
  * {
    box-sizing: border-box;
  }
  html,
  body {
    min-height: 100%;
    margin: 0;
  }
  body {
    min-width: 100vw;
    min-height: 100vh;
    color: #1f2937;
    background: #ffffff;
  }
  .wr-webpage {
    width: 100vw !important;
    min-height: 100vh;
    height: 100vh !important;
    color: #111827;
    background: #ffffff;
  }
  .wr-component {
    --webrad-border-gradient-surface: transparent;
    box-sizing: border-box;
    font: inherit;
  }
  .wr-component[hidden] {
    display: none !important;
  }
  .wr-webpage {
    --webrad-border-gradient-surface: var(--wr-page-surface, #ffffff);
    overflow: hidden;
  }
  .wr-webreusableelement {
    border: 0;
    background: transparent;
    overflow: visible;
  }
  .wr-floating-layer {
    position: static;
    width: 0;
    height: 0;
    overflow: visible;
  }
  .wr-reusable-definition-root {
    position: relative;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
  }
  .wr-reusable-definition-root > .wr-component {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0;
    min-height: 0;
  }
  .wr-weblabel {
    display: flex;
    align-items: center;
    color: inherit;
    overflow: hidden;
    white-space: nowrap;
  }
  .wr-webpanel {
    --webrad-border-gradient-surface: var(--wr-control-surface, #262b35);
    border: 1px solid var(--wr-control-border, #677184);
    background: var(--wr-control-surface, #262b35);
    padding: 6px;
    overflow: hidden;
  }
  .wr-webedit,
  .wr-webtextarea,
  .wr-webcombobox,
  .wr-weblistbox {
    --webrad-border-gradient-surface: var(--wr-input-bg, #11151c);
    border: 1px solid var(--wr-control-border, #677184);
    border-radius: 3px;
    background: var(--wr-input-bg, #11151c);
    color: inherit;
    padding: 5px 7px;
    outline: none;
  }
  .wr-webedit:focus,
  .wr-webtextarea:focus,
  .wr-webcombobox:focus,
  .wr-weblistbox:focus {
    border-color: var(--wr-accent, #4da3ff);
    box-shadow: 0 0 0 1px var(--wr-accent, #4da3ff);
  }
  .wr-webbutton {
    --webrad-border-gradient-surface: var(--wr-button-bg, #343b49);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45em;
    border: 1px solid var(--wr-control-border, #677184);
    border-radius: 4px;
    background: var(--wr-button-bg, #343b49);
    color: inherit;
    padding: 4px 12px;
  }
  .wr-webbutton:hover:not(:disabled) {
    --webrad-border-gradient-surface: var(--wr-button-hover, #414a5a);
    background: var(--wr-button-hover, #414a5a);
  }
  .wr-button-icon {
    display: block;
    width: 1em;
    height: 1em;
    flex: none;
  }
  .wr-button-content-text .wr-button-icon {
    display: none;
  }
  .wr-button-icon-left {
    flex-direction: row;
  }
  .wr-webcheckbox {
    display: flex;
    align-items: center;
    gap: 7px;
  }
  .wr-webimage {
    display: block;
    object-fit: contain;
    border: 1px dashed var(--wr-control-border, #677184);
    color: var(--wr-muted-text, #8e98aa);
  }
  .wr-webdatagrid {
    --webrad-border-gradient-surface: var(--wr-control-surface, #262b35);
    display: block;
    overflow: hidden;
    border: 1px solid var(--wr-control-border, #677184);
    background: var(--wr-control-surface, #262b35);
    color: inherit;
  }
  .wr-data-grid-scroll {
    width: 100%;
    height: 100%;
    overflow: auto;
  }
  .wr-data-grid-content {
    width: 100%;
    min-width: var(--wr-data-grid-min-width, 0);
  }
  .wr-data-grid-row {
    display: grid;
    grid-template-columns: var(--wr-data-grid-columns);
    min-width: var(--wr-data-grid-min-width, 0);
  }
  .wr-data-grid-cell {
    box-sizing: border-box;
    min-width: 0;
    min-height: 0;
    padding: var(--wr-data-grid-cell-padding-y, 8px) var(--wr-data-grid-cell-padding-x, 10px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .wr-data-grid-body-row > .wr-data-grid-cell {
    border-bottom-width: var(--wr-data-grid-horizontal-line-override-width, var(--wr-data-grid-horizontal-line-width, var(--wr-data-grid-config-horizontal-line-width, 1px)));
    border-bottom-style: var(--wr-data-grid-horizontal-line-style, solid);
    border-bottom-color: var(--wr-data-grid-horizontal-line-color, currentColor);
    @supports (color: color-mix(in lab, red, red)) {
      border-bottom-color: var(--wr-data-grid-horizontal-line-color, color-mix(in srgb, currentColor 15%, transparent));
    }
  }
  .wr-data-grid-has-footer .wr-data-grid-body-row:last-child > .wr-data-grid-cell {
    border-bottom-width: 0;
  }
  .wr-data-grid-row > .wr-data-grid-cell:not(:first-child) {
    border-inline-start-width: var(--wr-data-grid-vertical-line-override-width, var(--wr-data-grid-vertical-line-width, var(--wr-data-grid-config-vertical-line-width, 0px)));
    border-inline-start-style: var(--wr-data-grid-vertical-line-style, solid);
    border-inline-start-color: var(--wr-data-grid-vertical-line-color, currentColor);
    @supports (color: color-mix(in lab, red, red)) {
      border-inline-start-color: var(--wr-data-grid-vertical-line-color, color-mix(in srgb, currentColor 15%, transparent));
    }
  }
  .wr-data-grid-body-row > .wr-data-grid-cell:focus-visible {
    outline: 2px solid var(--wr-accent, #4da3ff);
    outline-offset: -2px;
  }
  .wr-data-grid-content[data-webrad-wrap-text=true] .wr-data-grid-cell {
    overflow-wrap: anywhere;
    text-overflow: clip;
    white-space: normal;
  }
  .wr-data-grid-header-cell {
    height: var(--wr-data-grid-header-height, auto);
    border-bottom-width: var(--wr-data-grid-header-border-width, var(--wr-data-grid-horizontal-line-override-width, var(--wr-data-grid-horizontal-line-width, var(--wr-data-grid-config-horizontal-line-width, 1px))));
    border-bottom-style: var(--wr-data-grid-header-border-style, var(--wr-data-grid-horizontal-line-style, solid));
    border-bottom-color: var(--wr-data-grid-header-border-color, #c7d2fe);
    background: var(--wr-data-grid-header-background-color, #e0e7ff);
    color: var(--wr-data-grid-header-text-color, #1e3a8a);
    font-weight: var(--wr-data-grid-header-font-weight, 600);
    padding: var(--wr-data-grid-header-padding-y, var(--wr-data-grid-cell-padding-y, 8px)) var(--wr-data-grid-header-padding-x, var(--wr-data-grid-cell-padding-x, 10px));
  }
  .wr-data-grid-footer-cell {
    height: var(--wr-data-grid-footer-height, auto);
    border-top-width: var(--wr-data-grid-footer-border-width, var(--wr-data-grid-horizontal-line-override-width, var(--wr-data-grid-horizontal-line-width, var(--wr-data-grid-config-horizontal-line-width, 1px))));
    border-top-style: var(--wr-data-grid-footer-border-style, var(--wr-data-grid-horizontal-line-style, solid));
    border-top-color: var(--wr-data-grid-footer-border-color, #dbeafe);
    background: var(--wr-data-grid-footer-background-color, #f8fafc);
    color: var(--wr-data-grid-footer-text-color, #334155);
    font-weight: var(--wr-data-grid-footer-font-weight, 600);
    padding: var(--wr-data-grid-footer-padding-y, var(--wr-data-grid-cell-padding-y, 8px)) var(--wr-data-grid-footer-padding-x, var(--wr-data-grid-cell-padding-x, 10px));
  }
  .wr-data-grid-sticky-header {
    position: sticky;
    z-index: 1;
    top: 0;
  }
  .wr-data-grid-sticky-footer {
    position: sticky;
    z-index: 1;
    bottom: 0;
  }
  .wr-data-grid-content[data-webrad-row-height-mode=fixed] .wr-data-grid-body-row {
    height: var(--wr-data-grid-fixed-row-height, 40px);
    max-height: var(--wr-data-grid-fixed-row-height, 40px);
  }
  .wr-data-grid-content[data-webrad-row-height-mode=fixed] .wr-data-grid-body-row > .wr-data-grid-cell {
    height: var(--wr-data-grid-fixed-row-height, 40px);
  }
  .wr-data-grid-content[data-webrad-row-height-mode=dynamic] .wr-data-grid-body-row {
    min-height: var(--wr-data-grid-min-row-height, 36px);
    max-height: var(--wr-data-grid-max-row-height, none);
  }
  .wr-data-grid-striped .wr-data-grid-body-row:nth-child(even) > .wr-data-grid-cell {
    background: currentColor;
    @supports (color: color-mix(in lab, red, red)) {
      background: color-mix(in srgb, currentColor 5%, transparent);
    }
  }
  .wr-data-grid-image {
    display: block;
    width: 100%;
    max-width: 100%;
    height: 36px;
    max-height: 100%;
    object-fit: contain;
  }
  .wr-data-grid-button {
    display: inline-flex;
    max-width: 100%;
    align-items: center;
    justify-content: center;
    gap: .45em;
    border-width: var(--wr-data-grid-button-border-width, 1px);
    border-style: var(--wr-data-grid-button-border-style, solid);
    border-color: var(--wr-data-grid-button-border-color, #c7d2fe);
    border-radius: var(--wr-data-grid-button-border-radius, 6px);
    background: var(--wr-data-grid-button-background-color, #e0e7ff);
    color: var(--wr-data-grid-button-text-color, #1e3a8a);
    cursor: pointer;
    font-weight: var(--wr-data-grid-button-font-weight, 600);
    padding: var(--wr-data-grid-button-padding-y, 4px) var(--wr-data-grid-button-padding-x, 8px);
  }
  .wr-data-grid-button-icon-slot {
    position: relative;
    display: block;
    flex: 0 0 16px;
    min-width: 0;
    min-height: 0;
    width: 16px;
    height: 16px;
    line-height: 0;
  }
  .wr-data-grid-button-icon-slot > .wr-data-grid-button-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    transform: translate(-50%, -50%);
  }
  .wr-data-grid-button-caption {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .wr-data-grid-checkbox-control {
    display: inline-flex;
    max-width: 100%;
    align-items: center;
    gap: var(--wr-data-grid-checkbox-gap, 6px);
    color: var(--wr-data-grid-checkbox-text-color, #334155);
    font-weight: var(--wr-data-grid-checkbox-font-weight, 500);
  }
  .wr-data-grid-checkbox {
    flex: none;
    width: var(--wr-data-grid-checkbox-size, 16px);
    height: var(--wr-data-grid-checkbox-size, 16px);
    margin: 0;
    accent-color: var(--wr-data-grid-checkbox-accent-color, #2563eb);
  }
  .wr-data-grid-checkbox-caption {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .wr-data-grid-empty {
    color: var(--wr-muted-text, #8e98aa);
    font-style: italic;
    text-align: center !important;
  }
}
@property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; }
@property --tw-leading { syntax: "*"; inherits: false; }
@property --tw-font-weight { syntax: "*"; inherits: false; }
@property --tw-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@property --tw-shadow-color { syntax: "*"; inherits: false; }
@property --tw-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
@property --tw-inset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@property --tw-inset-shadow-color { syntax: "*"; inherits: false; }
@property --tw-inset-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
@property --tw-ring-color { syntax: "*"; inherits: false; }
@property --tw-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@property --tw-inset-ring-color { syntax: "*"; inherits: false; }
@property --tw-inset-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@property --tw-ring-inset { syntax: "*"; inherits: false; }
@property --tw-ring-offset-width { syntax: "<length>"; inherits: false; initial-value: 0px; }
@property --tw-ring-offset-color { syntax: "*"; inherits: false; initial-value: #fff; }
@property --tw-ring-offset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
@property --tw-duration { syntax: "*"; inherits: false; }
@property --tw-ease { syntax: "*"; inherits: false; }
@property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; }
@property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; }
@property --tw-translate-z { syntax: "*"; inherits: false; initial-value: 0; }
@layer properties {
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
    *,
    ::before,
    ::after,
    ::backdrop {
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-duration: initial;
      --tw-ease: initial;
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
    }
  }
}