/* wwwroot/css/size.css */
:root {
  --size-space-0: 0px;
  --size-space-050: 2px;
  --size-space-100: 4px;
  --size-space-150: 6px;
  --size-space-200: 8px;
  --size-space-300: 12px;
  --size-space-400: 16px;
  --size-space-600: 24px;
  --size-space-800: 32px;
  --size-space-1200: 48px;
  --size-space-1600: 64px;
  --size-space-2400: 96px;
  --size-space-4000: 160px;
  --size-space-negative-100: -4px;
  --size-space-negative-200: -8px;
  --size-space-negative-300: -12px;
  --size-space-negative-400: -16px;
  --size-space-negative-600: -24px;
  --size-radius-none---100: 0px;
  --size-radius-none---200: 0px;
  --size-radius-none---400: 0px;
  --size-radius-600: 24px;
  --size-blur-100: 4px;
  --size-radius-full: 9999px;
  --size-radius-none: 0px;
  --size-depth-0: 0px;
  --size-depth-025: 1px;
  --size-depth-100: 4px;
  --size-depth-200: 8px;
  --size-depth-400: 16px;
  --size-depth-800: 32px;
  --size-depth-1200: 48px;
  --size-depth-negative-025: -1px;
  --size-depth-negative-100: -4px;
  --size-depth-negative-200: -8px;
  --size-depth-negative-400: -16px;
  --size-depth-negative-800: -32px;
  --size-depth-negative-1200: -48px;
  --size-stroke-border: 1px;
  --size-stroke-focus-ring: 2px;
  --size-icon-small: 24px;
  --size-icon-medium: 32px;
  --size-icon-large: 40px;
  --size-label-height: calc(var(--typography-body-size-small) * 1.4 + var(--size-space-150) + var(--size-space-200));
}

/* wwwroot/css/color.css */
:root {
  color-scheme: light dark;
  --color-brand-100: #F4F8FF;
  --color-brand-200: #EAF1FF;
  --color-brand-300: #DFE9FF;
  --color-brand-400: #C1D4FF;
  --color-brand-500: #97B7FF;
  --color-brand-600: #3C88F3;
  --color-brand-700: #0069EB;
  --color-brand-800: #084B9E;
  --color-brand-900: #083367;
  --color-brand-1000: #0D2036;
  --color-black-100: #0C0C0D0D;
  --color-black-200: #0C0C0D1A;
  --color-black-300: #0C0C0D33;
  --color-black-400: #0C0C0D66;
  --color-black-500: #0C0C0DB2;
  --color-black-600: #0C0C0DCC;
  --color-black-700: #0C0C0DD9;
  --color-black-800: #0C0C0DE5;
  --color-black-900: #0C0C0DF2;
  --color-black-1000: #0C0C0D;
  --color-gray-100: #FAFAFA;
  --color-gray-200: #F5F5F5;
  --color-gray-300: #E6E6E6;
  --color-gray-400: #D2D2D2;
  --color-gray-500: #A7A9AD;
  --color-gray-600: #6D7078;
  --color-gray-700: #44474C;
  --color-gray-800: #303238;
  --color-gray-900: #212327;
  --color-gray-1000: #1B1D21;
  --color-white-100: #FFFFFF0A;
  --color-white-200: #FFFFFF1A;
  --color-white-300: #FFFFFF33;
  --color-white-400: #FFFFFF66;
  --color-white-500: #FFFFFFB2;
  --color-white-600: #FFFFFFCC;
  --color-white-700: #FFFFFFD9;
  --color-white-800: #FFFFFFE5;
  --color-white-900: #FFFFFFF2;
  --color-white-1000: #FFFFFF;
  --color-pink-100: #FFE6FF;
  --color-pink-200: #FFC5FF;
  --color-pink-300: #FF99FF;
  --color-pink-400: #FF6DFF;
  --color-pink-500: #E755E7;
  --color-pink-600: #BF52BF;
  --color-pink-700: #853285;
  --color-pink-800: #5F265F;
  --color-pink-900: #401B40;
  --color-pink-1000: #210D21;
  --color-beige-100: #F5F2EF;
  --color-beige-200: #EDE4DA;
  --color-beige-300: #DFCFBD;
  --color-beige-400: #D1BBA2;
  --color-beige-500: #AD967B;
  --color-beige-600: #8C7A68;
  --color-beige-700: #695E51;
  --color-beige-800: #4A433A;
  --color-beige-900: #302C27;
  --color-beige-1000: #161512;
  --color-forrest-100: #EAEAE6;
  --color-creame-100: #FBFCED;
  --color-creame-200: #F8FBD3;
  --color-creame-300: #ECEFB3;
  --color-creame-400: #D7D897;
  --color-creame-500: #A9A87E;
  --color-creame-600: #7C7E6A;
  --color-creame-700: #686955;
  --color-creame-800: #4B4A39;
  --color-creame-900: #303026;
  --color-creame-1000: #161612;
  --color-orange-100: #FFE2CC;
  --color-orange-200: #FFC599;
  --color-orange-300: #FFAE70;
  --color-orange-400: #FC9241;
  --color-orange-500: #FF6D00;
  --color-orange-600: #D95D00;
  --color-orange-700: #A84900;
  --color-orange-800: #753300;
  --color-orange-900: #401B00;
  --color-orange-1000: #291200;
  --color-green-100: #EBFFEE;
  --color-red-100: #FEE9E7;
  --color-yellow-100: #FFFBEB;
  --color-yellow-200: #FFF1C2;
  --color-yellow-300: #FFE8A3;
  --color-yellow-400: #E8B931;
  --color-yellow-500: #E5A000;
  --color-yellow-600: #BF6A02;
  --color-yellow-700: #975102;
  --color-yellow-800: #682D03;
  --color-yellow-900: #522504;
  --color-yellow-1000: #401B01;
  --color-red-200: #FDD3D0;
  --color-red-300: #FCB3AD;
  --color-red-400: #F4776A;
  --color-red-500: #EC221F;
  --color-red-600: #C00F0C;
  --color-red-700: #900B09;
  --color-red-800: #690807;
  --color-red-900: #4D0B0A;
  --color-red-1000: #300603;
  --color-green-200: #CFF7D3;
  --color-green-300: #AFF4C6;
  --color-green-400: #85E0A3;
  --color-green-500: #14AE5C;
  --color-green-600: #009951;
  --color-green-700: #008043;
  --color-green-800: #02542D;
  --color-green-900: #024023;
  --color-green-1000: #062D1B;
  --color-forrest-200: #D1D1C1;
  --color-forrest-300: #BDBD99;
  --color-forrest-400: #BDBD5C;
  --color-forrest-500: #B7B738;
  --color-forrest-600: #A3A31F;
  --color-forrest-700: #83830B;
  --color-forrest-800: #5B5B00;
  --color-forrest-900: #444400;
  --color-forrest-1000: #2B2B01;
  --color-background-default-default: var(--color-white-1000);
  --color-background-default-default-hover: var(--color-gray-100);
  --color-background-default-secondary: var(--color-gray-100);
  --color-background-default-secondary-hover: var(--color-gray-200);
  --color-background-default-tertiary: var(--color-gray-200);
  --color-background-default-tertiary-hover: var(--color-gray-300);
  --color-background-default-quaternary: var(--color-gray-300);
  --color-background-default-quaternary-hover: var(--color-gray-400);
  --color-background-negative-default: var(--color-gray-600);
  --color-background-negative-hover: var(--color-gray-800);
  --color-background-negative-secondary: var(--color-gray-600);
  --color-background-negative-secondary-hover: var(--color-gray-700);
  --color-background-negative-tertiary: var(--color-gray-400);
  --color-background-negative-tertiary-hover: var(--color-gray-500);
  --color-background-brand-default: var(--color-brand-700);
  --color-background-brand-hover: var(--color-brand-800);
  --color-background-brand-secondary: var(--color-brand-600);
  --color-background-brand-secondary-hover: var(--color-brand-700);
  --color-background-brand-tertiary: var(--color-brand-200);
  --color-background-brand-tertiary-hover: var(--color-brand-300);
  --color-background-brand-quaternary: var(--color-brand-100);
  --color-background-brand-quaternary-hover: var(--color-brand-200);
  --color-background-positive-default: var(--color-green-500);
  --color-background-positive-hover: var(--color-green-600);
  --color-background-positive-secondary: var(--color-green-200);
  --color-background-positive-secondary-hover: var(--color-green-300);
  --color-background-positive-tertiary: var(--color-green-100);
  --color-background-positive-tertiary-hover: var(--color-green-200);
  --color-background-warning-default: var(--color-yellow-400);
  --color-background-warning-hover: var(--color-yellow-500);
  --color-background-warning-secondary: var(--color-yellow-200);
  --color-background-warning-secondary-hover: var(--color-yellow-300);
  --color-background-warning-tertiary: var(--color-yellow-100);
  --color-background-warning-tertiary-hover: var(--color-yellow-200);
  --color-background-danger-default: var(--color-red-500);
  --color-background-danger-hover: var(--color-red-600);
  --color-background-danger-secondary: var(--color-red-200);
  --color-background-danger-secondary-hover: var(--color-red-300);
  --color-background-danger-tertiary: var(--color-red-100);
  --color-background-danger-tertiary-hover: var(--color-red-200);
  --color-background-disabled-default: var(--color-gray-300);
  --color-background-disabled-brand: var(--color-brand-400);
  --color-background-utilities-alpha-hover: var(--color-black-100);
  --color-background-utilities-scrim: #FFFFFFCC;
  --color-background-utilities-blanket: var(--color-black-100);
  --color-background-utilities-overlay: #00000080;
  --color-background-utilities-measurement: var(--color-pink-200);
  --color-background-utilities-input: var(--color-white-1000);
  --color-background-utilities-answer-box: var(--color-brand-200);
  --color-text-default-default: var(--color-gray-1000);
  --color-text-default-secondary: var(--color-gray-700);
  --color-text-default-tertiary: var(--color-gray-600);
  --color-text-negative-default: var(--color-white-1000);
  --color-text-negative-secondary: var(--color-gray-200);
  --color-text-negative-tertiary: var(--color-gray-300);
  --color-text-brand-default: var(--color-brand-800);
  --color-text-brand-secondary: var(--color-brand-700);
  --color-text-brand-tertiary: var(--color-brand-600);
  --color-text-brand-on-brand: var(--color-brand-100);
  --color-text-brand-on-brand-secondary: var(--color-white-1000);
  --color-text-brand-on-brand-tertiary: var(--color-brand-900);
  --color-text-positive-default: var(--color-green-800);
  --color-text-positive-secondary: var(--color-green-600);
  --color-text-positive-tertiary: var(--color-green-500);
  --color-text-positive-on-positive: var(--color-green-100);
  --color-text-positive-on-positive-secondary: var(--color-green-800);
  --color-text-positive-on-positive-tertiary: var(--color-green-800);
  --color-text-warning-default: var(--color-yellow-900);
  --color-text-warning-secondary: var(--color-yellow-700);
  --color-text-warning-tertiary: var(--color-yellow-600);
  --color-text-warning-on-warning: var(--color-yellow-1000);
  --color-text-warning-on-warning-secondary: var(--color-yellow-800);
  --color-text-warning-on-warning-tertiary: var(--color-yellow-900);
  --color-text-danger-default: var(--color-red-600);
  --color-text-danger-secondary: var(--color-red-700);
  --color-text-danger-tertiary: var(--color-red-500);
  --color-text-danger-on-danger: var(--color-red-100);
  --color-text-danger-on-danger-secondary: var(--color-red-700);
  --color-text-danger-on-danger-tertiary: var(--color-red-700);
  --color-text-disabled-default: var(--color-gray-400);
  --color-text-disabled-on-disabled: var(--color-gray-400);
  --color-text-disabled-on-brand: var(--color-brand-100);
  --color-text-utilities-text-on-overlay: var(--color-black-1000);
  --color-text-utilities-text-on-measurement: var(--color-pink-800);
  --color-border-default-default: var(--color-gray-300);
  --color-border-default-secondary: var(--color-gray-400);
  --color-border-default-tertiary: var(--color-gray-600);
  --color-border-negative-default: var(--color-gray-900);
  --color-border-negative-secondary: var(--color-gray-600);
  --color-border-negative-tertiary: var(--color-gray-400);
  --color-border-brand-default: var(--color-brand-800);
  --color-border-brand-secondary: var(--color-brand-700);
  --color-border-brand-tertiary: var(--color-brand-300);
  --color-border-positive-default: var(--color-green-800);
  --color-border-positive-secondary: var(--color-green-600);
  --color-border-positive-tertiary: var(--color-green-500);
  --color-border-warning-default: var(--color-yellow-900);
  --color-border-warning-secondary: var(--color-yellow-700);
  --color-border-warning-tertiary: var(--color-yellow-600);
  --color-border-danger-default: var(--color-red-600);
  --color-border-danger-secondary: var(--color-red-700);
  --color-border-danger-tertiary: var(--color-red-500);
  --color-border-disabled-default: var(--color-gray-400);
  --color-border-utilities-measurement: var(--color-pink-400);
  --color-border-utilities-swatch: #0000003D;
  --color-border-utilities-gradient: #E6E6E600;
  --color-icon-default-default: var(--color-gray-900);
  --color-icon-default-secondary: var(--color-gray-600);
  --color-icon-default-tertiary: var(--color-gray-500);
  --color-icon-negative-default: var(--color-gray-900);
  --color-icon-negative-secondary: var(--color-gray-700);
  --color-icon-negative-tertiary: var(--color-gray-600);
  --color-icon-negative-on-neutral: var(--color-gray-100);
  --color-icon-negative-on-neutral-secondary: var(--color-white-1000);
  --color-icon-negative-on-neutral-tertiary: var(--color-gray-900);
  --color-icon-brand-default: var(--color-brand-700);
  --color-icon-brand-secondary: var(--color-brand-600);
  --color-icon-brand-tertiary: var(--color-brand-500);
  --color-icon-brand-on-brand: var(--color-brand-100);
  --color-icon-brand-on-brand-secondary: var(--color-white-1000);
  --color-icon-brand-on-brand-tertiary: var(--color-brand-900);
  --color-icon-positive-default: var(--color-green-800);
  --color-icon-positive-secondary: var(--color-green-600);
  --color-icon-positive-tertiary: var(--color-green-500);
  --color-icon-positive-on-positive: var(--color-green-100);
  --color-icon-positive-on-positive-secondary: var(--color-green-800);
  --color-icon-positive-on-positive-tertiary: var(--color-green-900);
  --color-icon-warning-default: var(--color-yellow-900);
  --color-icon-warning-secondary: var(--color-yellow-700);
  --color-icon-warning-tertiary: var(--color-yellow-600);
  --color-icon-warning-on-warning: var(--color-yellow-1000);
  --color-icon-warning-on-warning-secondary: var(--color-yellow-800);
  --color-icon-warning-on-warning-tertiary: var(--color-yellow-900);
  --color-icon-danger-default: var(--color-red-600);
  --color-icon-danger-secondary: var(--color-red-700);
  --color-icon-danger-tertiary: var(--color-red-500);
  --color-icon-danger-on-danger: var(--color-red-100);
  --color-icon-danger-on-danger-secondary: var(--color-red-700);
  --color-icon-danger-on-danger-tertiary: var(--color-red-700);
  --color-icon-disabled-default: var(--color-gray-400);
  --color-icon-disabled-on-disabled: var(--color-gray-400);
  --color-icon-disabled-on-brand: var(--color-brand-100);
  --color-icon-utilities-icon: var(--color-pink-600);
  --color-icon-utilities-icon-on-measurement: var(--color-pink-800);
  --color-text-neutral-default: var(--color-white-1000);
}
@media (prefers-color-scheme: dark) {
  :root {
    --color-background-default-default: var(--color-gray-1000);
    --color-background-default-default-hover: var(--color-gray-900);
    --color-background-default-secondary: var(--color-gray-900);
    --color-background-default-secondary-hover: var(--color-gray-800);
    --color-background-default-tertiary: var(--color-gray-800);
    --color-background-default-tertiary-hover: var(--color-gray-700);
    --color-background-default-quaternary: var(--color-gray-700);
    --color-background-default-quaternary-hover: var(--color-gray-600);
    --color-background-negative-default: var(--color-gray-400);
    --color-background-negative-hover: var(--color-gray-300);
    --color-background-negative-secondary: var(--color-gray-500);
    --color-background-negative-secondary-hover: var(--color-gray-400);
    --color-background-negative-tertiary: var(--color-gray-700);
    --color-background-negative-tertiary-hover: var(--color-gray-600);
    --color-background-brand-default: var(--color-brand-700);
    --color-background-brand-hover: var(--color-brand-600);
    --color-background-brand-secondary: var(--color-brand-800);
    --color-background-brand-secondary-hover: var(--color-brand-700);
    --color-background-brand-tertiary: var(--color-brand-1000);
    --color-background-brand-tertiary-hover: var(--color-brand-800);
    --color-background-brand-quaternary: var(--color-brand-1000);
    --color-background-brand-quaternary-hover: var(--color-brand-900);
    --color-background-positive-default: var(--color-green-700);
    --color-background-positive-hover: var(--color-green-800);
    --color-background-positive-secondary: var(--color-green-800);
    --color-background-positive-secondary-hover: var(--color-green-900);
    --color-background-positive-tertiary: var(--color-green-900);
    --color-background-positive-tertiary-hover: var(--color-green-1000);
    --color-background-warning-default: var(--color-yellow-400);
    --color-background-warning-hover: var(--color-yellow-500);
    --color-background-warning-secondary: var(--color-yellow-800);
    --color-background-warning-secondary-hover: var(--color-yellow-900);
    --color-background-warning-tertiary: var(--color-yellow-900);
    --color-background-warning-tertiary-hover: var(--color-yellow-1000);
    --color-background-danger-default: var(--color-red-600);
    --color-background-danger-hover: var(--color-red-700);
    --color-background-danger-secondary: var(--color-red-800);
    --color-background-danger-secondary-hover: var(--color-red-900);
    --color-background-danger-tertiary: var(--color-red-900);
    --color-background-danger-tertiary-hover: var(--color-red-1000);
    --color-background-disabled-default: var(--color-gray-700);
    --color-background-disabled-brand: var(--color-brand-900);
    --color-background-utilities-alpha-hover: var(--color-white-100);
    --color-background-utilities-scrim: #000000CC;
    --color-background-utilities-blanket: var(--color-white-100);
    --color-background-utilities-overlay: #00000080;
    --color-background-utilities-measurement: var(--color-pink-800);
    --color-background-utilities-input: var(--color-white-200);
    --color-background-utilities-answer-box: var(--color-white-100);
    --color-text-default-default: var(--color-white-1000);
    --color-text-default-secondary: var(--color-white-600);
    --color-text-default-tertiary: var(--color-white-500);
    --color-text-negative-default: var(--color-gray-1000);
    --color-text-negative-secondary: var(--color-gray-800);
    --color-text-negative-tertiary: var(--color-gray-700);
    --color-text-brand-default: var(--color-brand-100);
    --color-text-brand-secondary: var(--color-brand-300);
    --color-text-brand-tertiary: var(--color-brand-400);
    --color-text-brand-on-brand: var(--color-brand-100);
    --color-text-brand-on-brand-secondary: var(--color-white-1000);
    --color-text-brand-on-brand-tertiary: var(--color-brand-100);
    --color-text-positive-default: var(--color-green-200);
    --color-text-positive-secondary: var(--color-green-400);
    --color-text-positive-tertiary: var(--color-green-600);
    --color-text-positive-on-positive: var(--color-green-100);
    --color-text-positive-on-positive-secondary: var(--color-green-100);
    --color-text-positive-on-positive-tertiary: var(--color-green-100);
    --color-text-warning-default: var(--color-yellow-200);
    --color-text-warning-secondary: var(--color-yellow-400);
    --color-text-warning-tertiary: var(--color-yellow-600);
    --color-text-warning-on-warning: var(--color-yellow-1000);
    --color-text-warning-on-warning-secondary: var(--color-yellow-100);
    --color-text-warning-on-warning-tertiary: var(--color-yellow-100);
    --color-text-danger-default: var(--color-red-200);
    --color-text-danger-secondary: var(--color-red-400);
    --color-text-danger-tertiary: var(--color-red-500);
    --color-text-danger-on-danger: var(--color-red-100);
    --color-text-danger-on-danger-secondary: var(--color-red-100);
    --color-text-danger-on-danger-tertiary: var(--color-red-100);
    --color-text-disabled-default: var(--color-gray-500);
    --color-text-disabled-on-disabled: var(--color-gray-400);
    --color-text-disabled-on-brand: var(--color-brand-400);
    --color-text-utilities-text-on-overlay: var(--color-white-1000);
    --color-text-utilities-text-on-measurement: var(--color-pink-200);
    --color-border-default-default: var(--color-gray-800);
    --color-border-default-secondary: var(--color-gray-600);
    --color-border-default-tertiary: var(--color-gray-500);
    --color-border-negative-default: var(--color-gray-100);
    --color-border-negative-secondary: var(--color-gray-500);
    --color-border-negative-tertiary: var(--color-gray-600);
    --color-border-brand-default: var(--color-white-400);
    --color-border-brand-secondary: var(--color-white-300);
    --color-border-brand-tertiary: var(--color-white-200);
    --color-border-positive-default: var(--color-green-200);
    --color-border-positive-secondary: var(--color-green-400);
    --color-border-positive-tertiary: var(--color-green-600);
    --color-border-warning-default: var(--color-yellow-200);
    --color-border-warning-secondary: var(--color-yellow-400);
    --color-border-warning-tertiary: var(--color-yellow-600);
    --color-border-danger-default: var(--color-red-200);
    --color-border-danger-secondary: var(--color-red-400);
    --color-border-danger-tertiary: var(--color-red-500);
    --color-border-disabled-default: var(--color-gray-600);
    --color-border-utilities-measurement: var(--color-pink-600);
    --color-border-utilities-swatch: #FFFFFF3D;
    --color-border-utilities-gradient: #30323800;
    --color-icon-default-default: var(--color-white-1000);
    --color-icon-default-secondary: var(--color-white-500);
    --color-icon-default-tertiary: var(--color-white-400);
    --color-icon-negative-default: var(--color-gray-200);
    --color-icon-negative-secondary: var(--color-gray-300);
    --color-icon-negative-tertiary: var(--color-gray-400);
    --color-icon-negative-on-neutral: var(--color-gray-1000);
    --color-icon-negative-on-neutral-secondary: var(--color-white-1000);
    --color-icon-negative-on-neutral-tertiary: var(--color-gray-100);
    --color-icon-brand-default: var(--color-brand-100);
    --color-icon-brand-secondary: var(--color-brand-300);
    --color-icon-brand-tertiary: var(--color-brand-400);
    --color-icon-brand-on-brand: var(--color-brand-100);
    --color-icon-brand-on-brand-secondary: var(--color-white-1000);
    --color-icon-brand-on-brand-tertiary: var(--color-brand-100);
    --color-icon-positive-default: var(--color-green-200);
    --color-icon-positive-secondary: var(--color-green-400);
    --color-icon-positive-tertiary: var(--color-green-600);
    --color-icon-positive-on-positive: var(--color-green-100);
    --color-icon-positive-on-positive-secondary: var(--color-green-100);
    --color-icon-positive-on-positive-tertiary: var(--color-green-100);
    --color-icon-warning-default: var(--color-yellow-200);
    --color-icon-warning-secondary: var(--color-yellow-400);
    --color-icon-warning-tertiary: var(--color-yellow-600);
    --color-icon-warning-on-warning: var(--color-yellow-1000);
    --color-icon-warning-on-warning-secondary: var(--color-yellow-100);
    --color-icon-warning-on-warning-tertiary: var(--color-yellow-100);
    --color-icon-danger-default: var(--color-red-200);
    --color-icon-danger-secondary: var(--color-red-400);
    --color-icon-danger-tertiary: var(--color-red-500);
    --color-icon-danger-on-danger: var(--color-red-100);
    --color-icon-danger-on-danger-secondary: var(--color-red-100);
    --color-icon-danger-on-danger-tertiary: var(--color-red-100);
    --color-icon-disabled-default: var(--color-gray-500);
    --color-icon-disabled-on-disabled: var(--color-gray-400);
    --color-icon-disabled-on-brand: var(--color-brand-400);
    --color-icon-utilities-icon: var(--color-pink-400);
    --color-icon-utilities-icon-on-measurement: var(--color-pink-200);
  }
}

/* wwwroot/css/typography.css */
@font-face {
  font-family: "Family Sans";
  src: url(../fonts/Inter-Variable.woff2) format("woff2-variations");
  font-style: normal;
  font-weight: 100 900;
}
@font-face {
  font-family: "Family Sans";
  src: url(../fonts/Inter-RegularItalic.woff2) format("woff2");
  font-style: italic;
  font-weight: 400;
}
@font-face {
  font-family: "Family Serif";
  src: url(../fonts/PublicoText-Roman-Web.woff2) format("woff2");
  font-weight: 400;
  font-style: normal;
}
:root {
  --typography-scale-01: 12px;
  --typography-scale-02: 14px;
  --typography-scale-03: 16px;
  --typography-scale-04: 18px;
  --typography-scale-05: 24px;
  --typography-scale-06: 32px;
  --typography-scale-07: 40px;
  --typography-scale-08: 48px;
  --typography-scale-09: 64px;
  --typography-scale-10: 72px;
  --typography-weight-light: 300;
  --typography-weight-regular: 400;
  --typography-weight-medium: 500;
  --typography-weight-bold: 700;
  --typography-title-hero-size: var(--typography-scale-10);
  --typography-title-hero-font-weight: nullpx;
  --typography-title-page-font-family: Family Serif;
  --typography-title-page-size-small: var(--typography-scale-07);
  --typography-title-page-size-base: var(--typography-scale-08);
  --typography-title-page-size-large: var(--typography-scale-09);
  --typography-title-page-font-weight: var(--typography-weight-regular);
  --typography-subtitle-font-family: Family Sans;
  --typography-subtitle-size-small: var(--typography-scale-05);
  --typography-subtitle-size-base: var(--typography-scale-06);
  --typography-subtitle-size-large: var(--typography-scale-07);
  --typography-subtitle-font-weight: nullpx;
  --typography-heading-size-small: var(--typography-scale-04);
  --typography-heading-size-base: var(--typography-scale-05);
  --typography-heading-size-large: var(--typography-scale-06);
  --typography-heading-font-weight: nullpx;
  --typography-subheading-size-small: var(--typography-scale-03);
  --typography-subheading-size-medium: var(--typography-scale-04);
  --typography-subheading-size-large: var(--typography-scale-05);
  --typography-subheading-font-weight: nullpx;
  --typography-body-size-x-small: var(--typography-scale-01);
  --typography-body-size-small: var(--typography-scale-02);
  --typography-body-size-medium: var(--typography-scale-03);
  --typography-body-size-large: var(--typography-scale-04);
  --typography-body-font-family: Family Sans;
  --typography-body-font-weight-regular: var(--typography-weight-regular);
  --typography-body-font-weight-strong: var(--typography-weight-medium);
}

/* wwwroot/css/input.css */
.radio-button-container {
  display: flex;
  align-items: baseline;
  gap: var(--size-space-300);
}
input[type=radio] {
  appearance: none;
  background-color: var(--color-background-default-default);
  margin: 0;
  font: inherit;
  width: var(--size-space-400);
  height: var(--size-space-400);
  transition: border 120ms;
  border: 0.1em solid var(--color-border-brand-tertiary);
  border-radius: 50%;
  display: inline-grid;
  place-content: center;
  cursor: pointer;
}
input[type=radio]:checked {
  border: 0.1em solid var(--color-border-brand-default);
}
input[type=radio]::before {
  content: "";
  width: calc(var(--size-space-400) - 2px);
  height: calc(var(--size-space-400) - 2px);
  border-radius: 50%;
  transition: box-shadow 120ms;
  box-shadow: inset 0 0 0px 0px var(--color-background-brand-secondary);
}
input[type=radio]:checked::before {
  box-shadow: inset 0 0 0px 3px var(--color-background-brand-secondary);
}
label {
  cursor: pointer;
}
button {
  background: none;
  border: none;
  outline: none;
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: var(--size-space-200);
  border-radius: var(--size-radius-none);
  font-family: var(--typography-body-font-family);
  font-size: var(--typography-body-size-medium);
  font-style: normal;
  font-weight: var(--typography-body-font-weight-regular);
  transition: background-color 120ms;
}
button.primary {
  color: var(--color-text-brand-on-brand);
  background-color: var(--color-background-brand-default);
}
button.primary:hover {
  color: var(--color-text-brand-on-brand);
  background-color: var(--color-background-brand-hover);
}
button.medium {
  padding: var(--size-space-300) var(--size-space-400);
}
button.small {
  padding: var(--size-space-200) var(--size-space-300);
}
textarea {
  padding: var(--size-space-300) var(--size-space-400);
  color: var(--color-text-default-default);
  border-radius: var(--size-radius-none);
  border: var(--size-stroke-border) solid var(--color-border-default-default);
  background-color: var(--color-background-utilities-input);
}
textarea::placeholder {
  color: var(--color-text-default-tertiary);
}

/* wwwroot/css/component.css */
.icon-button {
  cursor: pointer;
}
.icon-button.primary {
  background-color: var(--color-background-brand-default);
  stroke: var(--color-icon-brand-on-brand);
}
.icon-button.subtle {
  stroke: var(--color-icon-default-default);
  fill: none;
}
.icon-button.small {
  width: 16px;
  height: 16px;
  padding: var(--size-space-200);
  border-radius: var(--typography-scale-06);
}
.icon-button.medium {
  width: 20px;
  height: 20px;
  padding: var(--size-space-300);
  border-radius: var(--typography-scale-06);
}
.icon-button.subtle:hover {
  background: var(--color-background-utilities-blanket);
}
.icon-button.subtle.selected {
  stroke: var(--color-icon-brand-default);
  fill: var(--color-icon-brand-tertiary);
}
.has-label {
  position: relative;
}
.has-label.label-float {
  margin-top: var(--size-label-height);
}
.has-label::before,
.is-label {
  display: inline-block;
  padding: var(--size-space-200) var(--size-space-800) var(--size-space-150) var(--size-space-300);
  font-family: var(--typography-body-font-family);
  font-size: var(--typography-body-size-small);
  font-weight: var(--typography-body-font-weight-strong);
  line-height: 140%;
  color: var(--color-icon-negative-on-neutral);
  background-color: var(--color-background-negative-default);
}
.has-label::before {
  content: attr(data-label);
}
.has-label.label-float::before,
.is-label.label-float {
  display: block;
  position: absolute;
  bottom: 100%;
}
.has-label.label-left.label-float::before,
.is-label.label-left.label-float {
  left: 0px;
}
.has-label.label-left:not(.label-float)::before,
.is-label.label-left:not(.label-float) {
  margin-right: auto;
}
.has-label.label-right.label-float::before,
.is-label.label-right.label-float {
  right: 0px;
}
.has-label.label-right:not(.label-float)::before,
.is-label.label-right:not(.label-float) {
  margin-left: auto;
}
.has-label.label-brand::before,
.is-label.label-brand {
  color: var(--color-text-brand-on-brand-secondary);
  background-color: var(--color-background-brand-secondary);
}
.body-base {
  font-family: var(--typography-body-font-family);
  font-size: var(--typography-body-size-medium);
  font-style: normal;
  font-weight: var(--typography-body-font-weight-regular);
  line-height: 140%;
}
.body-large {
  font-family: var(--typography-body-font-family);
  font-size: var(--typography-body-size-large);
  font-style: normal;
  font-weight: var(--typography-body-font-weight-regular);
  line-height: 140%;
}
div:has(> .menu) {
  position: relative;
  display: flex;
}
.menu {
  max-width: calc(100vw - var(--size-space-800) * 2 - var(--size-space-200) * 2);
  min-width: 300px;
  position: absolute;
  z-index: 1;
  top: 100%;
  right: 0;
  display: none;
  padding: var(--size-space-200);
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
  border: var(--size-stroke-border) solid var(--color-border-default-default);
  background-color: var(--color-background-default-default);
  box-shadow: var(--size-depth-0) var(--size-depth-025) var(--size-depth-400) var(--size-depth-0) var(--color-black-100);
}
div.open > .menu {
  display: flex;
}
.menu-item {
  cursor: pointer;
  display: flex;
  padding: var(--size-space-300) var(--size-space-400);
  align-items: flex-start;
  gap: var(--size-space-300);
  align-self: stretch;
  text-decoration: none;
}
.menu-item > svg {
  stroke: var(--color-text-default-default);
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  aspect-ratio: 1/1;
}
.menu-item > div {
  pointer-events: none;
  color: var(--color-text-default-default);
  font-family: var(--typography-body-font-family);
  font-size: var(--typography-body-size-medium);
  font-style: normal;
  font-weight: var(--typography-body-font-weight-regular);
  line-height: 140%;
}
.menu-item > div[data-description]::after {
  display: block;
  content: attr(data-description);
  color: var(--color-text-default-secondary);
  font-family: var(--typography-body-font-family);
  font-size: var(--typography-body-size-small);
  font-style: normal;
  font-weight: var(--typography-body-font-weight-regular);
  line-height: 140%;
}
.menu-item:has(> [hidden]) {
  display: none;
}
.menu-item:hover {
  background: var(--color-background-brand-default);
}
.menu-item:hover > svg {
  stroke: var(--color-text-brand-on-brand);
}
.menu-item:hover > div,
.menu-item:hover > div::after {
  color: var(--color-text-brand-on-brand);
}
.menu-separator {
  background-color: var(--color-border-default-default);
  background-clip: content-box;
  align-self: stretch;
  height: 1px;
  padding: var(--size-space-200) var(--size-space-400);
}
dialog {
  display: none !important;
  width: 600px;
  padding: var(--size-space-800);
  flex-direction: column;
  align-items: flex-start;
  gap: var(--size-space-600);
  border-radius: var(--size-radius-none);
  border: var(--size-stroke-border) solid var(--color-border-default-default);
  background: var(--color-background-default-default);
  box-shadow: var(--size-depth-0) var(--size-depth-100) var(--size-depth-800) var(--size-depth-negative-100) var(--color-black-200), var(--size-depth-0) var(--size-depth-025) var(--size-depth-200) var(--size-depth-negative-100) var(--color-black-100);
}
dialog:focus-visible {
  outline: none;
}
dialog > button[type=submit] {
  align-self: flex-end;
}
dialog[open] {
  display: flex !important;
}
.grow {
  flex-grow: 1;
}

/* wwwroot/css/app-base.css */
@font-face {
  font-family: "Publico text";
  src: url(../fonts/PublicoText-Roman-Web.woff2) format("woff2");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Publico text";
  src: url(../fonts/PublicoText-Italic-Web.woff2) format("woff2");
  font-weight: 400;
  font-style: italic;
}
@font-face {
  font-family: "Publico text";
  src: url(../fonts/PublicoText-Semibold-Web.woff2) format("woff2");
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: "Publico text";
  src: url(../fonts/PublicoText-Bold-Web.woff2) format("woff2");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "Publico text";
  src: url(../fonts/PublicoText-BoldItalic-Web.woff2) format("woff2");
  font-weight: 700;
  font-style: italic;
}
@font-face {
  font-family: "Inter";
  src: url(../fonts/Inter-Variable.woff2) format("woff2-variations");
  font-style: normal;
  font-weight: 100 900;
}
@font-face {
  font-family: "Inter";
  src: url(../fonts/Inter-RegularItalic.woff2) format("woff2");
  font-style: italic;
  font-weight: 400;
}
:root {
  --main-column-width: min(calc(100vw - var(--size-space-800)), 540px);
}
html {
  height: 100%;
  overflow-y: scroll;
  overscroll-behavior-y: contain;
}
body {
  height: 100%;
  margin: 0px;
  background-color: var(--color-background-default-secondary);
  color: var(--color-text-default-default);
  font-family: sans-serif;
  font-size: 16px;
  font-family: Inter, sans-serif;
}
a {
  color: inherit;
}
body > * {
  display: flex;
  flex-direction: column;
  align-items: center;
}
body.show-lex-panel > div:not(#lex-panel) {
  width: 50%;
}
body.show-lex-panel > #thread {
  transform: translate(-25vw, 0px);
}
body.show-lex-panel > #lex-panel {
  display: block;
}
#lex-panel {
  display: none;
  position: fixed;
  width: 50%;
  left: 50%;
  top: 0;
  height: 100%;
  background-color: #f3f4f4;
  overflow-y: auto;
  padding: 20px 40px;
  font-family: "Public text", serif;
  font-size: large;
  border-left: 1px solid rgba(0, 0, 0, .3);
  box-sizing: border-box;
  scrollbar-width: none;
}
#lex-panel > h1 > a {
  font-size: small;
  margin-left: 10px;
}
#sprite {
  display: none;
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}
header {
  position: fixed;
  z-index: 1;
  top: 0px;
  width: 100%;
  display: flex;
  gap: 24px;
  flex-direction: row;
  align-items: center;
  padding: var(--size-space-400) var(--size-space-800);
  box-sizing: border-box;
}
#right-menu-container {
  position: fixed;
  display: flex;
  right: 0;
  top: var(--size-space-1200);
  padding: var(--size-space-400) var(--size-space-800);
  z-index: 1;
  flex-direction: row;
}
.workflow-select,
#answer-count-select,
#toggle-lex-panel-button {
  padding: 5px 10px;
  border-width: 1px;
  font: inherit;
  font-size: small;
}
.menu-item:has(> #answer-count-select[data-selected="1"]) ~ .menu-item:has(> .workflow-select[data-index="2"]),
.menu-item:has(> #answer-count-select[data-selected="0"]) ~ .menu-item:has(> .workflow-select[data-index="1"]),
.menu-item:has(> #answer-count-select[data-selected="0"]) ~ .menu-item:has(> .workflow-select[data-index="2"]) {
  display: none;
}
#logo {
  width: var(--size-icon-large);
  aspect-ratio: 10/11;
  fill: var(--color-icon-brand-default);
  flex-shrink: 0;
}
#logo-text {
  font-weight: bold;
  flex-grow: 1;
}
#email-form {
  flex-direction: row;
  justify-content: center;
}
#thread {
  width: 100%;
  margin: 0px auto;
  box-sizing: border-box;
  max-width: calc(100vw - var(--size-space-800));
  font-family: "Public text", serif;
  font-size: large;
  justify-content: end;
  align-content: center;
  flex-wrap: wrap;
  gap: var(--size-space-600);
}
#thread > *:first-child {
  margin-top: 100px;
}
#thread > *:last-child {
  margin-bottom: var(--footer-height, 250px);
  scroll-margin-bottom: var(--footer-height, 250px);
  scroll-snap-align: end;
}
.assistant-container {
  max-width: calc(100vw - 40px);
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  font-family: var(--typography-body-font-family);
  font-size: var(--typography-body-size-medium);
  font-weight: var(--typography-body-font-weight-regular);
  line-height: 140%;
  gap: var(--size-space-800);
}
.reveal-left-to-right,
.reveal-left-to-right.has-label.label-left::before {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  transition: clip-path 1000ms;
}
@starting-style {
  .reveal-left-to-right,
  .reveal-left-to-right.has-label.label-left::before {
    clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
  }
}
.assistant {
  width: 960px;
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-auto-rows: min-content;
  max-width: 960px;
}
.assistant:not(:only-of-type) {
  scroll-snap-align: center;
}
.assistant:only-of-type .select-preferred-message-button {
  display: none;
}
body.answering .select-preferred-message-button {
  visibility: hidden;
}
@media screen and (max-width: 680px) {
  .select-preferred-message-button {
    font-size: small !important;
  }
}
.assistant:not(:only-of-type) {
  position: relative;
}
@keyframes assistant-blink {
  from {
    opacity: 1;
  }
  to {
    opacity: .5;
  }
}
.assistant-messages-footer {
  display: flex;
  gap: 10px;
}
.message {
  grid-column: 1;
  grid-row: 2;
}
.message > div {
  padding: var(--size-space-400) var(--size-space-400) var(--size-space-600) var(--size-space-400);
  background-color: var(--color-background-utilities-answer-box);
  min-height: 100px;
}
.message > div > p.processing {
  color: var(--color-text-brand-default);
}
.message > div > p:first-child,
.sources > div > p:first-child {
  margin-top: 0;
}
.message > div > p:last-child,
.sources > div > p:last-child {
  margin-bottom: 0;
}
.message > div:empty::after,
.sources > div:empty::after {
  display: block;
  white-space: pre;
  animation-name: assistant-blink;
  animation-duration: 500ms;
  animation-direction: alternate;
  animation-iteration-count: infinite;
}
.message-options {
  display: flex;
  gap: var(--size-space-200);
  background-color: var(--color-background-default-tertiary);
  padding: var(--size-space-050) var(--size-space-300);
  margin-right: auto;
}
.assistant:not(.finished) > .message-options {
  clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
}
.icon-button-thumbs-down {
  transform: scaleY(-1);
}
.icon-button-copy use[href="#icon-clicked"] {
  display: none;
}
.icon-button-copy.is-clicked use[href="#icon-clicked"] {
  display: block;
}
.icon-button-copy.is-clicked use[href="#icon-copy"] {
  display: none;
}
.sources {
  align-self: start;
  grid-column: 2;
  grid-row: 1 / span 3;
  margin-left: var(--size-space-800);
}
.sources > div:empty::after,
.sources.no-sources > div::after {
  padding: var(--size-space-400) var(--size-space-400) var(--size-space-600) var(--size-space-400);
  background-color: var(--color-background-default-tertiary);
}
.sources > div:empty::after {
  content: "Finder kilder til svaret...";
}
.sources.no-sources > div::after {
  animation-name: none;
  content: "Ingen kilder fundet";
}
.source {
  background-color: var(--color-background-default-tertiary);
  padding: var(--size-space-200) var(--size-space-300) var(--size-space-300) var(--size-space-300);
  opacity: 1;
  transition: opacity 300ms, background-color 300ms;
  display: flex;
  flex-direction: column;
  position: relative;
  cursor: pointer;
}
.source.expanded {
  background-color: var(--color-background-default-quaternary);
  cursor: default;
}
@starting-style {
  .source {
    opacity: 0;
  }
}
.source:not(:last-child) {
  border-bottom: 1px solid var(--color-border-default-secondary);
}
.source-image-container {
  position: relative;
  display: none;
}
.source-image-container:has(> .source-image[src]) {
  display: block;
}
.source-image {
  width: calc(100% + var(--size-space-300) * 2);
  object-fit: cover;
  margin: calc(var(--size-space-200) * -1) calc(var(--size-space-300) * -1) var(--size-space-100) calc(var(--size-space-300) * -1);
}
.source-image-credit {
  position: absolute;
  margin-bottom: var(--size-space-300);
  bottom: 0px;
  color: var(--color-text-neutral-default);
  text-shadow: 0 0 4px rgba(0, 0, 0, 0.25);
  font-family: var(--typography-body-font-family);
  font-size: var(--typography-body-size-x-small);
  font-style: normal;
  font-weight: var(--typography-body-font-weight-regular);
  line-height: 140%;
}
.source-title {
  color: var(--color-text-default-default);
  font: var(--typography-body-font-family);
  font-weight: var(--typography-body-font-weight-strong);
  font-size: var(--typography-body-size-medium);
}
.source-subject-container {
  display: flex;
  align-items: center;
  opacity: 0;
  transition: opacity 300ms;
}
.source.has-article-content .source-subject-container {
  opacity: 1;
}
.source-subject {
  color: var(--color-text-default-tertiary);
  font: var(--typography-body-font-family);
  font-weight: var(--typography-body-font-weight-regular);
  font-size: var(--typography-body-size-x-small);
  line-height: 1.4;
  flex-grow: 1;
}
.source-expand-icon {
  width: 20px;
  height: 20px;
  stroke: var(--color-icon-default-secondary);
  flex-shrink: 0;
  cursor: pointer;
  transition: transform 300ms;
}
.source.expanded .source-expand-icon {
  transform: rotate(180deg);
}
.source-expander {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows 300ms, opacity 300ms;
}
.source-expander > * {
  overflow: hidden;
  min-height: 0;
}
.source.expanded > .source-expander {
  grid-template-rows: 1fr;
  opacity: 1;
}
.source-excerpt {
  color: var(--color-text-default-secondary);
  font: var(--typography-body-font-family);
  font-weight: var(--typography-body-font-weight-regular);
  font-size: var(--typography-body-size-x-small);
  line-height: 140%;
  margin-bottom: var(--size-space-1200);
}
.source-excerpt > p {
  height: calc(16.8px * 4);
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.source-date {
  color: var(--color-text-default-tertiary);
  font: var(--typography-body-font-family);
  font-weight: var(--typography-body-font-weight-regular);
  font-size: var(--typography-body-size-x-small);
  flex-grow: 1;
}
.source-read-more {
  display: flex;
  align-self: flex-end;
  text-align: right;
  text-decoration: none;
  position: relative;
  gap: var(--size-space-200);
  align-items: center;
  color: var(--color-text-default-default);
  font: var(--typography-body-font-family);
  font-size: var(--typography-body-size-small);
  flex-shrink: 0;
}
.source-bottom {
  display: flex;
  position: absolute;
  align-items: center;
  bottom: 0;
  margin-bottom: var(--size-space-300);
  pointer-events: none;
  opacity: 0;
  transition: opacity 300ms;
  width: calc(100% - var(--size-space-600));
}
.source.expanded .source-bottom {
  opacity: 1;
  pointer-events: all;
}
#feedback > textarea {
  display: none;
}
#feedback > .radio-button-container:has(> input:checked) + textarea {
  display: block;
}
#title {
  display: flex;
  position: relative;
  flex-direction: column;
  width: var(--main-column-width);
  gap: var(--size-space-200);
  color: var(--color-text-default-default);
  font-family: var(--typography-title-page-font-family);
  font-weight: var(--typography-title-page-font-weight);
  font-style: normal;
  font-size: var(--typography-title-page-size-base);
  line-height: 100%;
  pointer-events: none;
  margin-bottom: calc(var(--size-space-400) + var(--size-space-600));
  opacity: 1;
  transition: opacity 300ms, display 300ms allow-discrete;
}
#title::after {
  display: block;
  content: "Sp\f8rg om begreber, historiske begivenheder eller definitioner. Alle svar genereres med AI ud fra Lex\2019  verificerede artikler.";
  color: var(--color-text-default-secondary);
  font-family: var(--typography-body-font-family);
  font-weight: var(--typography-body-font-weight-regular);
  font-style: normal;
  font-size: var(--typography-body-size-large);
  line-height: 140%;
  vertical-align: middle;
}
#thread:not(:empty) ~ footer > #title {
  opacity: 0;
  top: 0 !important;
  display: none;
}
#bottom-container {
  border-top: 1px solid;
  border-image:
    radial-gradient(
      circle at top center,
      var(--color-border-utilities-gradient),
      var(--color-border-utilities-gradient)) 1;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: var(--size-space-400);
  margin-bottom: var(--size-space-300);
  transition: border-image 300ms 300ms;
  pointer-events: all;
}
#title,
#bottom-container {
  transform: translateY(calc(-40vh + 70px + max(0px, 200px - 25vw)));
}
#thread:not(:empty) ~ footer > #bottom-container {
  transition: border-image 300ms 300ms, transform 300ms;
  transform: translateY(0);
  border-image:
    radial-gradient(
      circle at top center,
      var(--color-border-default-default),
      var(--color-border-utilities-gradient)) 1;
}
#thread:not(:empty) ~ footer #input-message-container {
  transform: none !important;
}
#thread:not(:empty) ~ footer #input-message-container::before {
  opacity: 0;
}
#input-message-container {
  position: relative;
  width: calc(var(--main-column-width) - 25px);
  margin-right: 25px;
  background-color: var(--color-background-utilities-input);
  box-shadow: inset 0 0 0 1px var(--color-border-brand-tertiary);
  padding: 0 var(--size-space-400);
  box-sizing: border-box;
  margin-top: 0px;
}
#input-message-container::before {
  opacity: 1;
  transition: opacity 300ms;
}
#input-message-container::after {
  display: block;
  content: attr(data-char-count) " / 1000";
  position: absolute;
  right: 0;
  font-size: small;
  pointer-events: none;
  opacity: 0;
  transition: opacity 300ms;
}
#input-message-container[data-char-count-approaching-limit=true]::after {
  opacity: 1;
}
#input-message-container:has(> #input-message:disabled) {
  background-color: var(--color-background-disabled-default);
  pointer-events: none;
}
#input-message {
  padding: 12.5px 0;
  scroll-padding: 12.5px;
  outline: none;
  width: calc(100% - 25px);
  resize: none;
  height: 25px;
  min-height: 25px;
  max-height: 15vh;
  border: none;
  background-color: transparent;
  display: block;
  color: var(--color-text-default-default);
  scrollbar-width: none;
  overscroll-behavior: contain;
}
#input-message::-webkit-scrollbar {
  display: none;
}
#input-message::placeholder {
  color: var(--color-text-default-tertiary);
}
#input-message:focus::placeholder {
  opacity: 0;
}
#input-message:disabled::placeholder {
  opacity: 0;
}
#input-message:disabled {
  pointer-events: none;
}
#send-message-button {
  position: absolute;
  right: -25px;
  width: 50px;
  height: 100%;
  bottom: 0px;
  transition: background-color 300ms;
  border-radius: 25px;
  padding: 15px;
  box-sizing: border-box;
}
#input-message:disabled + #send-message-button,
#input-message:placeholder-shown + #send-message-button {
  background-color: var(--color-background-disabled-brand);
  pointer-events: none;
}
#thread:empty ~ #bottom-container > #input-message {
  box-shadow: white 0px 0px 20px, white 0px 0px 20px;
}
#message {
  display: block;
  margin: 100px 20px 20px 20px;
  max-width: min(var(--main-column-width), 100vw - 40px);
  justify-self: center;
}
.button {
  text-decoration: underline;
  cursor: pointer;
}
footer {
  position: fixed;
  bottom: 0px;
  width: 100%;
  pointer-events: none;
  background-color: var(--color-background-default-secondary);
}
#footer-text {
  padding: var(--size-space-0) var(--size-space-800) var(--size-space-300) var(--size-space-800);
  box-sizing: border-box;
  color: var(--color-text-default-tertiary);
  font-family: var(--typography-body-font-family);
  font-weight: var(--typography-body-font-weight-regular);
  font-style: normal;
  font-size: var(--typography-body-size-small);
  line-height: 140%;
  text-align: center;
}

/* wwwroot/css/responsive.css */
@media (max-width: 600px) {
  .assistant {
    grid-template-columns: 1fr;
    min-width: 70%;
  }
  .sources {
    transform: none !important;
    grid-column: 1;
    grid-row: 5;
    margin-left: 0;
    margin-top: var(--size-space-800);
  }
}
@media (max-width: 1000px) {
  .assistant:not(:only-of-type) {
    grid-template-columns: 1fr;
  }
  .assistant:not(:only-of-type) > .sources {
    transform: none !important;
    grid-column: 1;
    grid-row: 4;
    margin-left: 0;
    margin-top: var(--size-space-800);
  }
}
@media (max-width: 1140px) {
  header {
    border-bottom: 1px solid var(--color-border-default-default);
    background-color: var(--color-background-default-secondary);
  }
  #logo {
    width: var(--size-icon-medium);
  }
  #right-menu-container {
    top: 0px;
    right: var(--size-space-1200);
    flex-direction: row;
  }
}

/* wwwroot/src/styles.css */