/*
        …[  [ … [    [[∞]]    ] … ]  ]…
      # [`@backwater-systems/landscape`][¹]
  _A user interface component and style library_
                 _for the web_
                      ---
              [Backwater Systems][²]
                       ◦
          © 2026 [Nate Gehringer][³]
        …[  [ … [    [[∞]]    ] … ]  ]…

  [¹]: https://code.backwater.systems/#landscape
  [²]: https://backwater.systems/
  [³]: mailto:nate@backwater.systems
*/


:root {
	--one-hundredth: 0.01;
	--two-hundredths: 0.02;
	--five-hundredths: 0.05;
	--one-tenth: 0.1;
	--one-sixth: calc(1 / 6);
	--two-tenths: 0.2;
	--one-third: calc(1 / 3);
	--four-tenths: 0.4;
	--five-tenths: 0.5;
	--two-thirds: calc(2 / 3);
	--eight-tenths: 0.8;
	--ninety-five-hundredths: 0.95;
	--ninety-eight-hundredths: 0.98;

	--rgb_black: 0, 0, 0;
	--rgb_blue: 0, 120, 240;
	--rgb_green: 20, 220, 80;
	--rgb_grey-1: 10, 10, 10;
	--rgb_grey-2: 20, 20, 20;
	--rgb_grey-3: 30, 30, 30;
	--rgb_grey-4: 40, 40, 40;
	--rgb_grey-5: 50, 50, 50;
	--rgb_grey-6: 60, 60, 60;
	--rgb_grey-7: 70, 70, 70;
	--rgb_grey-8: 80, 80, 80;
	--rgb_grey-10: 100, 100, 100;
	--rgb_grey-12: 120, 120, 120;
	--rgb_grey-15: 150, 150, 150;
	--rgb_grey-16: 160, 160, 160;
	--rgb_grey-18: 180, 180, 180;
	--rgb_grey-20: 200, 200, 200;
	--rgb_grey-22: 220, 220, 220;
	--rgb_grey-23: 230, 230, 230;
	--rgb_grey-24: 240, 240, 240;
	--rgb_grey-25: 250, 250, 250;
	--rgb_orange: 240, 180, 20;
	--rgb_pastel-blue: 120, 180, 220;
	--rgb_pastel-blue-pale: 220, 236, 248;
	--rgb_pastel-blue-pale-light: 224, 242, 255;
	--rgb_pastel-green-pale: 224, 240, 224;
	--rgb_pink: 224, 36, 168;
	--rgb_purple: 100, 10, 120;
	--rgb_purple-dark: 20, 2, 24;
	--rgb_purple-pale: 60, 6, 72;
	--rgb_red: 220, 20, 20;
	--rgb_ultraviolet: 180, 18, 216;
	--rgb_white: 255, 255, 255;
	--rgb_yellow: 255, 255, 20;

	--border-radius_small: 0.05in;
	--border-radius_large: 0.2in;

	--border-width_small: 0.0125in;
	--border-width_medium: 0.025in;
	--border-width_large: 0.05in;

	--box-shadow-offset_small: 0.025in;
	--box-shadow-offset_large: 0.0375in;

	--content_information-source: "ℹ";
	--content_required-field: "*";

	--font-weight_medium: 400;
	--font-weight_heavy: 600;

	--gap_extra-extra-small: 0.025in;
	--gap_extra-small: 0.05in;
	--gap_small: 0.125in;
	--gap_medium: 0.25in;
	--gap_large: 0.5in;
	--gap_extra-large: 0.8in;

	--margin_extra-extra-small: 0.025in;
	--margin_extra-small: 0.05in;
	--margin_small: 0.125in;
	--margin_medium: 0.25in;
	--margin_large: 0.5in;
	--margin_extra-large: 0.8in;

	--padding_extra-extra-small: 0.025in;
	--padding_extra-small: 0.05in;
	--padding_small: 0.125in;
	--padding_medium: 0.25in;
	--padding_large: 0.5in;
	--padding_extra-large: 0.8in;

	--scale-small: 0.9;
	--scale-large-less: 1.01;
	--scale-large: 1.02;
	--scale-x-large-less: 1.04;
	--scale-x-large: 1.05;

	--text-shadow-offset_small: 0.02em;
	--text-shadow-offset_medium: 0.04em;
	--text-shadow-offset_large: 0.08em;

	--transition-duration_long: 0.5s;
	--transition-duration_medium: 0.2s;
	--transition-duration_short: 0.1s;

	color-scheme: light dark;
}


/* #region color-scheme */
:root {
	--a-color: rgb( var(--rgb_grey-10) );
	--a_active-color: rgb( var(--rgb_pink) );
	--a_focus-visible_hover-color: rgb( var(--rgb_blue) );
	--backdrop-background-color: rgba( var(--rgb_white), var(--eight-tenths) );
	--background-color: rgb( var(--rgb_white) );
	--box-shadow-color_light: rgba( var(--rgb_black), var(--one-sixth) );
	--box-shadow-color_medium: rgba( var(--rgb_black), var(--one-third) );
	--button-background-color: rgba( var(--rgb_grey-25), var(--ninety-five-hundredths) );
	--button-border-color: rgba( var(--rgb_grey-16), var(--five-tenths) );
	--button-color: rgb( var(--rgb_grey-8) );
	--button-text-shadow-color: rgba( var(--rgb_grey-15), var(--five-tenths) );
	--button_accent-background-color: rgba( var(--rgb_pastel-blue-pale-light), var(--ninety-five-hundredths) );
	--button_accent-color: rgb( var(--rgb_grey-8) );
	--button_accent_not_disabled_active-background-color: rgba( var(--rgb_pastel-blue-pale), var(--ninety-five-hundredths) );
	--button_accent_not_disabled_active-color: rgb( var(--rgb_grey-4) );
	--button_accent_not_disabled_focus-visible_hover-background-color: rgba( var(--rgb_pastel-blue-pale-light), var(--ninety-five-hundredths) );
	--button_accent_not_disabled_focus-visible_hover-color: rgb( var(--rgb_grey-6) );
	--button_not_disabled_active-background-color: rgba( var(--rgb_grey-25), var(--ninety-five-hundredths) );
	--button_not_disabled_active-border-color: rgba( var(--rgb_grey-8), var(--five-tenths) );
	--button_not_disabled_active-color: rgb( var(--rgb_grey-4) );
	--button_not_disabled_focus-visible_hover-background-color: rgba( var(--rgb_grey-24), var(--ninety-five-hundredths) );
	--button_not_disabled_focus-visible_hover-border-color: rgba( var(--rgb_grey-12), var(--five-tenths) );
	--button_not_disabled_focus-visible_hover-color: rgb( var(--rgb_grey-6) );
	--color: rgb( var(--rgb_grey-8) );
	--color_muted-text: rgb( var(--rgb_grey-10) );
	--color_tooltip: rgb( var(--rgb_grey-4) );
	--fieldset-border-color: rgba( var(--rgb_grey-20), var(--five-tenths) );
	--glyph-button-color: rgb( var(--rgb_grey-8) );
	--glyph-button_active-background-color: rgba( var(--rgb_grey-25), var(--ninety-five-hundredths) );
	--glyph-button_active-color: rgb( var(--rgb_grey-4) );
	--glyph-button_active-text-shadow-color: rgba( var(--rgb_grey-2), var(--five-tenths) );
	--glyph-button_focus-visible_hover-background-color: rgba( var(--rgb_grey-24), var(--ninety-five-hundredths) );
	--glyph-button_focus-visible_hover-color: rgb( var(--rgb_grey-6) );
	--glyph-button_focus-visible_hover-text-shadow-color: rgba( var(--rgb_grey-2), var(--five-tenths) );
	--h1_h2_h3-border-bottom-color: rgba( var(--rgb_grey-10), var(--two-tenths) );
	--h1_h2_h3_h4_h5_h6-color: rgba( var(--rgb_grey-5), var(--ninety-five-hundredths) );
	--h1_h2_h3_h4_h5_h6-text-shadow-color: rgba( var(--rgb_black), var(--two-tenths) );
	--h4_h5_h6-text-decoration-color: rgba( var(--rgb_grey-6), var(--two-tenths) );
	--input_select_textarea-border-bottom-color: rgba( var(--rgb_grey-10), var(--ninety-five-hundredths) );
	--input_select_textarea-color: rgb( var(--rgb_grey-5) );
	--input_select_textarea_focus-visible-background-color: rgba( var(--rgb_white), var(--ninety-five-hundredths) );
	--input_select_textarea_focus-visible-color: rgb( var(--rgb_grey-2) );
	--menu-background-color: rgba( var(--rgb_grey-25), var(--ninety-five-hundredths) );
	--menu-border-color: rgba( var(--rgb_grey-20), var(--five-tenths) );
	--menu-heading-background-color: rgba( var(--rgb_black), var(--five-hundredths) );
	--menu-heading-color: rgb( var(--rgb_grey-8) );
	--menu-heading-text-shadow-color: rgba( var(--rgb_grey-18), var(--eight-tenths) );
	--menu-li-a_active_button_not_disabled_active-background-color: rgba( var(--rgb_black), var(--five-hundredths) );
	--menu-li-a_active_button_not_disabled_active-color: rgb( var(--rgb_grey-4) );
	--menu-li-a_focus-visible_hover_button_not_disabled_focus-visible_hover-background-color: rgba( var(--rgb_black), var(--two-hundredths) );
	--menu-li-a_focus-visible_hover_button_not_disabled_focus-visible_hover-color: rgb( var(--rgb_grey-8) );
	--outline-color: rgba( var(--rgb_blue), var(--eight-tenths) );
	--panel-background-color: rgba( var(--rgb_grey-18), var(--five-hundredths) );
	--panel-border-color: rgba( var(--rgb_grey-20), var(--five-tenths) );
	--popover-background-color: rgba( var(--rgb_white), var(--ninety-five-hundredths) );
	--popover-border-color: rgba( var(--rgb_black), var(--eight-tenths) );
	--surface-background-color: rgba( var(--rgb_grey-25), var(--ninety-five-hundredths) );
	--table-background-color: rgba( var(--rgb_grey-25), var(--ninety-five-hundredths) );
	--table-border-color: rgba( var(--rgb_grey-20), var(--five-tenths) );
	--table-border-color_accent: rgb( var(--rgb_blue) );
	--table-color: rgb( var(--rgb_grey-6) );
	--table-tbody-tr_focus-visible_hover-background-image:
		linear-gradient(
			rgba( var(--rgb_pastel-blue-pale), 0.42 ) 20%,
			rgba( var(--rgb_pastel-blue-pale), var(--four-tenths) ) 40%,
			rgba( var(--rgb_pastel-blue-pale), var(--four-tenths) ) 60%,
			rgba( var(--rgb_pastel-blue-pale), 0.42 ) 80%
		),
		linear-gradient(
			135deg,
			rgba( 0, 240, 0, var(--one-hundredth) ) 20%,
			rgba( 0, 220, 0, var(--two-hundredths) ),
			rgba( 0, 240, 0, var(--one-hundredth) ) 80%
		),
		linear-gradient(
			45deg,
			rgba( 0, 0, 240, var(--one-hundredth) ) 20%,
			rgba( 0, 0, 220, var(--two-hundredths) ),
			rgba( 0, 0, 240, var(--one-hundredth) ) 80%
		)
	;
	--table-tbody-tr_nth-child_odd-background-color: rgba( var(--rgb_grey-8), var(--five-hundredths) );
	--table-td_th-border-color: rgba( var(--rgb_grey-2), var(--one-tenth) );
	--table-th-background-color: rgba( var(--rgb_black), var(--five-hundredths) );
	--table-th-color: rgb( var(--rgb_grey-5) );
	--table-thead-tr-background-color: rgba( var(--rgb_grey-24), var(--ninety-eight-hundredths) );
	--table_accent-tbody-tr_nth-child_even-background-color: rgba( var(--rgb_grey-25), var(--four-tenths) );
	--table_accent-tbody-tr_nth-child_odd-background-color: rgba( var(--rgb_pastel-green-pale), var(--four-tenths) );
	--table_accent-thead-border-color: rgba( var(--rgb_black), var(--two-tenths) );
}

@media (prefers-color-scheme: dark) {
	:root {
		--a-color: rgb( var(--rgb_grey-18) );
		--a_active-color: rgb( var(--rgb_ultraviolet) );
		--a_focus-visible_hover-color: rgb( var(--rgb_orange) );
		--backdrop-background-color: rgba( var(--rgb_black), var(--eight-tenths) );
		--background-color: rgb( var(--rgb_purple-dark) );
		--box-shadow-color_light: rgba( var(--rgb_grey-6), var(--one-third) );
		--box-shadow-color_medium: rgba( var(--rgb_grey-6), var(--two-thirds) );
		--button-background-color: rgba( var(--rgb_grey-4), var(--ninety-five-hundredths) );
		--button-border-color: rgba( var(--rgb_grey-12), var(--five-tenths) );
		--button-color: rgb( var(--rgb_grey-15) );
		--button-text-shadow-color: rgba( var(--rgb_black), var(--two-tenths) );
		--button_accent-background-color: rgba( 40, 4, 48, var(--ninety-five-hundredths) );
		--button_accent-color: rgb( var(--rgb_grey-18) );
		--button_accent_not_disabled_active-background-color: rgb( var(--rgb_purple-pale) );
		--button_accent_not_disabled_active-color: rgb( var(--rgb_grey-22) );
		--button_accent_not_disabled_focus-visible_hover-background-color: rgba( 50, 5, 60, var(--ninety-five-hundredths) );
		--button_accent_not_disabled_focus-visible_hover-color: rgb( var(--rgb_grey-20) );
		--button_not_disabled_active-background-color: rgba( var(--rgb_grey-4), var(--ninety-five-hundredths) );
		--button_not_disabled_active-border-color: rgba( var(--rgb_grey-20), var(--five-tenths) );
		--button_not_disabled_active-color: rgb( var(--rgb_grey-22) );
		--button_not_disabled_focus-visible_hover-background-color: rgba( var(--rgb_grey-5), var(--ninety-five-hundredths) );
		--button_not_disabled_focus-visible_hover-border-color: rgba( var(--rgb_grey-16), var(--five-tenths) );
		--button_not_disabled_focus-visible_hover-color: rgb( var(--rgb_grey-20) );
		--color: rgb( var(--rgb_grey-20) );
		--color_muted-text: rgb( var(--rgb_grey-16) );
		--color_tooltip: rgb( var(--rgb_grey-22) );
		--fieldset-border-color: rgba( var(--rgb_grey-12), var(--five-tenths) );
		--glyph-button-color: rgb( var(--rgb_grey-15) );
		--glyph-button_active-background-color: rgba( var(--rgb_grey-3), var(--ninety-five-hundredths) );
		--glyph-button_active-color: rgb( var(--rgb_grey-24) );
		--glyph-button_active-text-shadow-color: rgba( var(--rgb_grey-2), var(--five-tenths) );
		--glyph-button_focus-visible_hover-background-color: rgba( var(--rgb_grey-4), var(--ninety-five-hundredths) );
		--glyph-button_focus-visible_hover-color: rgb( var(--rgb_grey-22) );
		--glyph-button_focus-visible_hover-text-shadow-color: rgba( var(--rgb_grey-3), var(--five-tenths) );
		--h1_h2_h3-border-bottom-color: rgba( var(--rgb_grey-10), var(--two-tenths) );
		--h1_h2_h3_h4_h5_h6-color: rgba( var(--rgb_grey-22), var(--ninety-five-hundredths) );
		--h1_h2_h3_h4_h5_h6-text-shadow-color: rgba( var(--rgb_black), var(--two-tenths) );
		--h4_h5_h6-text-decoration-color: rgba( var(--rgb_grey-6), var(--two-tenths) );
		--input_select_textarea-border-bottom-color: rgba( var(--rgb_grey-18), var(--eight-tenths) );
		--input_select_textarea-color: rgb( var(--rgb_grey-20) );
		--input_select_textarea_focus-visible-background-color: rgba( var(--rgb_grey-2), var(--ninety-five-hundredths) );
		--input_select_textarea_focus-visible-color: rgb( var(--rgb_grey-22) );
		--menu-background-color: rgba( var(--rgb_grey-2), var(--ninety-five-hundredths) );
		--menu-border-color: rgba( var(--rgb_grey-12), var(--five-tenths) );
		--menu-heading-background-color: rgba( var(--rgb_grey-22), var(--one-tenth) );
		--menu-heading-color: rgb( var(--rgb_grey-15) );
		--menu-heading-text-shadow-color: rgba( var(--rgb_grey-2), var(--eight-tenths) );
		--menu-li-a_active_button_not_disabled_active-background-color: rgba( var(--rgb_grey-4), var(--ninety-five-hundredths) );
		--menu-li-a_active_button_not_disabled_active-color: rgb( var(--rgb_grey-22) );
		--menu-li-a_focus-visible_hover_button_not_disabled_focus-visible_hover-background-color: rgba( var(--rgb_grey-8), var(--two-tenths) );
		--menu-li-a_focus-visible_hover_button_not_disabled_focus-visible_hover-color: rgb( var(--rgb_grey-20) );
		--outline-color: rgba( var(--rgb_purple), var(--eight-tenths) );
		--panel-background-color: rgba( var(--rgb_grey-6), var(--one-tenth) );
		--panel-border-color: rgba( var(--rgb_grey-12), var(--five-tenths) );
		--popover-background-color: rgba( var(--rgb_purple-dark), var(--ninety-five-hundredths) );
		--popover-border-color: rgba( var(--rgb_white), var(--eight-tenths) );
		--surface-background-color: rgba( var(--rgb_grey-8), var(--eight-tenths) );
		--table-background-color: rgba( var(--rgb_grey-3), var(--ninety-five-hundredths) );
		--table-border-color: rgba( var(--rgb_grey-8), var(--five-tenths) );
		--table-border-color_accent: rgb( var(--rgb_orange) );
		--table-color: rgb( var(--rgb_grey-18) );
		--table-tbody-tr_focus-visible_hover-background-image:
			linear-gradient(
				rgba(24, 42, 55, 0.42) 20%,
				rgba( 24, 42, 55, var(--four-tenths) ) 40%,
				rgba( 24, 42, 55, var(--four-tenths) ) 60%,
				rgba(24, 42, 55, 0.42) 80%
			),
			linear-gradient(
				135deg,
				rgba( 0, 24, 0, var(--one-hundredth) ) 20%,
				rgba( 0, 22, 0, var(--two-hundredths) ),
				rgba( 0, 24, 0, var(--one-hundredth) ) 80%
			),
			linear-gradient(
				45deg,
				rgba( 0, 0, 24, var(--one-hundredth) ) 20%,
				rgba( 0, 0, 22, var(--two-hundredths) ),
				rgba( 0, 0, 24, var(--one-hundredth) ) 80%
			)
		;
		--table-tbody-tr_nth-child_odd-background-color: rgba( var(--rgb_grey-15), var(--five-hundredths) );
		--table-td_th-border-color: rgba( var(--rgb_grey-24), var(--five-hundredths) );
		--table-th-background-color: rgba( var(--rgb_white), var(--one-hundredth) );
		--table-th-color: rgb( var(--rgb_grey-20) );
		--table-thead-tr-background-color: rgba( var(--rgb_grey-6), var(--ninety-eight-hundredths) );
		--table_accent-tbody-tr_nth-child_even-background-color: rgba( var(--rgb_grey-8), var(--two-tenths) );
		--table_accent-tbody-tr_nth-child_odd-background-color: rgba( var(--rgb_grey-6), var(--two-tenths) );
		--table_accent-thead-border-color: rgba( var(--rgb_white), var(--two-tenths) );
	}
}

:root .dark {
	--a-color: rgb( var(--rgb_grey-18) );
	--a_active-color: rgb( var(--rgb_ultraviolet) );
	--a_focus-visible_hover-color: rgb( var(--rgb_orange) );
	--backdrop-background-color: rgba( var(--rgb_black), var(--eight-tenths) );
	--background-color: rgb( var(--rgb_purple-dark) );
	--box-shadow-color_light: rgba( var(--rgb_grey-6), var(--one-third) );
	--box-shadow-color_medium: rgba( var(--rgb_grey-6), var(--two-thirds) );
	--button-background-color: rgba( var(--rgb_grey-4), var(--ninety-five-hundredths) );
	--button-border-color: rgba( var(--rgb_grey-12), var(--five-tenths) );
	--button-color: rgb( var(--rgb_grey-15) );
	--button-text-shadow-color: rgba( var(--rgb_black), var(--two-tenths) );
	--button_accent-background-color: rgba( 40, 4, 48, var(--ninety-five-hundredths) );
	--button_accent-color: rgb( var(--rgb_grey-18) );
	--button_accent_not_disabled_active-background-color: rgb( var(--rgb_purple-pale) );
	--button_accent_not_disabled_active-color: rgb( var(--rgb_grey-22) );
	--button_accent_not_disabled_focus-visible_hover-background-color: rgba( 50, 5, 60, var(--ninety-five-hundredths) );
	--button_accent_not_disabled_focus-visible_hover-color: rgb( var(--rgb_grey-20) );
	--button_not_disabled_active-background-color: rgba( var(--rgb_grey-4), var(--ninety-five-hundredths) );
	--button_not_disabled_active-border-color: rgba( var(--rgb_grey-20), var(--five-tenths) );
	--button_not_disabled_active-color: rgb( var(--rgb_grey-22) );
	--button_not_disabled_focus-visible_hover-background-color: rgba( var(--rgb_grey-5), var(--ninety-five-hundredths) );
	--button_not_disabled_focus-visible_hover-border-color: rgba( var(--rgb_grey-16), var(--five-tenths) );
	--button_not_disabled_focus-visible_hover-color: rgb( var(--rgb_grey-20) );
	--color: rgb( var(--rgb_grey-20) );
	--color_muted-text: rgb( var(--rgb_grey-16) );
	--color_tooltip: rgb( var(--rgb_grey-22) );
	--fieldset-border-color: rgba( var(--rgb_grey-12), var(--five-tenths) );
	--glyph-button-color: rgb( var(--rgb_grey-15) );
	--glyph-button_active-background-color: rgba( var(--rgb_grey-3), var(--ninety-five-hundredths) );
	--glyph-button_active-color: rgb( var(--rgb_grey-24) );
	--glyph-button_active-text-shadow-color: rgba( var(--rgb_grey-2), var(--five-tenths) );
	--glyph-button_focus-visible_hover-background-color: rgba( var(--rgb_grey-4), var(--ninety-five-hundredths) );
	--glyph-button_focus-visible_hover-color: rgb( var(--rgb_grey-22) );
	--glyph-button_focus-visible_hover-text-shadow-color: rgba( var(--rgb_grey-3), var(--five-tenths) );
	--h1_h2_h3-border-bottom-color: rgba( var(--rgb_grey-10), var(--two-tenths) );
	--h1_h2_h3_h4_h5_h6-color: rgba( var(--rgb_grey-22), var(--ninety-five-hundredths) );
	--h1_h2_h3_h4_h5_h6-text-shadow-color: rgba( var(--rgb_black), var(--two-tenths) );
	--h4_h5_h6-text-decoration-color: rgba( var(--rgb_grey-6), var(--two-tenths) );
	--input_select_textarea-border-bottom-color: rgba( var(--rgb_grey-18), var(--eight-tenths) );
	--input_select_textarea-color: rgb( var(--rgb_grey-20) );
	--input_select_textarea_focus-visible-background-color: rgba( var(--rgb_grey-2), var(--ninety-five-hundredths) );
	--input_select_textarea_focus-visible-color: rgb( var(--rgb_grey-22) );
	--menu-background-color: rgba( var(--rgb_grey-2), var(--ninety-five-hundredths) );
	--menu-border-color: rgba( var(--rgb_grey-12), var(--five-tenths) );
	--menu-heading-background-color: rgba( var(--rgb_grey-22), var(--one-tenth) );
	--menu-heading-color: rgb( var(--rgb_grey-15) );
	--menu-heading-text-shadow-color: rgba( var(--rgb_grey-2), var(--eight-tenths) );
	--menu-li-a_active_button_not_disabled_active-background-color: rgba( var(--rgb_grey-4), var(--ninety-five-hundredths) );
	--menu-li-a_active_button_not_disabled_active-color: rgb( var(--rgb_grey-22) );
	--menu-li-a_focus-visible_hover_button_not_disabled_focus-visible_hover-background-color: rgba( var(--rgb_grey-8), var(--two-tenths) );
	--menu-li-a_focus-visible_hover_button_not_disabled_focus-visible_hover-color: rgb( var(--rgb_grey-20) );
	--outline-color: rgba( var(--rgb_purple), var(--eight-tenths) );
	--panel-background-color: rgba( var(--rgb_grey-6), var(--one-tenth) );
	--panel-border-color: rgba( var(--rgb_grey-12), var(--five-tenths) );
	--popover-background-color: rgba( var(--rgb_purple-dark), var(--ninety-five-hundredths) );
	--popover-border-color: rgba( var(--rgb_white), var(--eight-tenths) );
	--surface-background-color: rgba( var(--rgb_grey-8), var(--eight-tenths) );
	--table-background-color: rgba( var(--rgb_grey-3), var(--ninety-five-hundredths) );
	--table-border-color: rgba( var(--rgb_grey-8), var(--five-tenths) );
	--table-border-color_accent: rgb( var(--rgb_orange) );
	--table-color: rgb( var(--rgb_grey-18) );
	--table-tbody-tr_focus-visible_hover-background-image:
		linear-gradient(
			rgba(24, 42, 55, 0.42) 20%,
			rgba( 24, 42, 55, var(--four-tenths) ) 40%,
			rgba( 24, 42, 55, var(--four-tenths) ) 60%,
			rgba(24, 42, 55, 0.42) 80%
		),
		linear-gradient(
			135deg,
			rgba( 0, 24, 0, var(--one-hundredth) ) 20%,
			rgba( 0, 22, 0, var(--two-hundredths) ),
			rgba( 0, 24, 0, var(--one-hundredth) ) 80%
		),
		linear-gradient(
			45deg,
			rgba( 0, 0, 24, var(--one-hundredth) ) 20%,
			rgba( 0, 0, 22, var(--two-hundredths) ),
			rgba( 0, 0, 24, var(--one-hundredth) ) 80%
		)
	;
	--table-tbody-tr_nth-child_odd-background-color: rgba( var(--rgb_grey-15), var(--five-hundredths) );
	--table-td_th-border-color: rgba( var(--rgb_grey-24), var(--five-hundredths) );
	--table-th-background-color: rgba( var(--rgb_white), var(--one-hundredth) );
	--table-th-color: rgb( var(--rgb_grey-20) );
	--table-thead-tr-background-color: rgba( var(--rgb_grey-6), var(--ninety-eight-hundredths) );
	--table_accent-tbody-tr_nth-child_even-background-color: rgba( var(--rgb_grey-8), var(--two-tenths) );
	--table_accent-tbody-tr_nth-child_odd-background-color: rgba( var(--rgb_grey-6), var(--two-tenths) );
	--table_accent-thead-border-color: rgba( var(--rgb_white), var(--two-tenths) );
}

:root .light {
	--a-color: rgb( var(--rgb_grey-10) );
	--a_active-color: rgb( var(--rgb_pink) );
	--a_focus-visible_hover-color: rgb( var(--rgb_blue) );
	--backdrop-background-color: rgba( var(--rgb_white), var(--eight-tenths) );
	--background-color: rgb( var(--rgb_white) );
	--box-shadow-color_light: rgba( var(--rgb_black), var(--one-sixth) );
	--box-shadow-color_medium: rgba( var(--rgb_black), var(--one-third) );
	--button-background-color: rgba( var(--rgb_grey-25), var(--ninety-five-hundredths) );
	--button-border-color: rgba( var(--rgb_grey-16), var(--five-tenths) );
	--button-color: rgb( var(--rgb_grey-8) );
	--button-text-shadow-color: rgba( var(--rgb_grey-15), var(--five-tenths) );
	--button_accent-background-color: rgba( var(--rgb_pastel-blue-pale-light), var(--ninety-five-hundredths) );
	--button_accent-color: rgb( var(--rgb_grey-8) );
	--button_accent_not_disabled_active-background-color: rgba( var(--rgb_pastel-blue-pale), var(--ninety-five-hundredths) );
	--button_accent_not_disabled_active-color: rgb( var(--rgb_grey-4) );
	--button_accent_not_disabled_focus-visible_hover-background-color: rgba( var(--rgb_pastel-blue-pale-light), var(--ninety-five-hundredths) );
	--button_accent_not_disabled_focus-visible_hover-color: rgb( var(--rgb_grey-6) );
	--button_not_disabled_active-background-color: rgba( var(--rgb_grey-25), var(--ninety-five-hundredths) );
	--button_not_disabled_active-border-color: rgba( var(--rgb_grey-8), var(--five-tenths) );
	--button_not_disabled_active-color: rgb( var(--rgb_grey-4) );
	--button_not_disabled_focus-visible_hover-background-color: rgba( var(--rgb_grey-24), var(--ninety-five-hundredths) );
	--button_not_disabled_focus-visible_hover-border-color: rgba( var(--rgb_grey-12), var(--five-tenths) );
	--button_not_disabled_focus-visible_hover-color: rgb( var(--rgb_grey-6) );
	--color: rgb( var(--rgb_grey-8) );
	--color_muted-text: rgb( var(--rgb_grey-10) );
	--color_tooltip: rgb( var(--rgb_grey-4) );
	--fieldset-border-color: rgba( var(--rgb_grey-20), var(--five-tenths) );
	--glyph-button-color: rgb( var(--rgb_grey-8) );
	--glyph-button_active-background-color: rgba( var(--rgb_grey-25), var(--ninety-five-hundredths) );
	--glyph-button_active-color: rgb( var(--rgb_grey-4) );
	--glyph-button_active-text-shadow-color: rgba( var(--rgb_grey-2), var(--five-tenths) );
	--glyph-button_focus-visible_hover-background-color: rgba( var(--rgb_grey-24), var(--ninety-five-hundredths) );
	--glyph-button_focus-visible_hover-color: rgb( var(--rgb_grey-6) );
	--glyph-button_focus-visible_hover-text-shadow-color: rgba( var(--rgb_grey-2), var(--five-tenths) );
	--h1_h2_h3-border-bottom-color: rgba( var(--rgb_grey-10), var(--two-tenths) );
	--h1_h2_h3_h4_h5_h6-color: rgba( var(--rgb_grey-5), var(--ninety-five-hundredths) );
	--h1_h2_h3_h4_h5_h6-text-shadow-color: rgba( var(--rgb_black), var(--two-tenths) );
	--h4_h5_h6-text-decoration-color: rgba( var(--rgb_grey-6), var(--two-tenths) );
	--input_select_textarea-border-bottom-color: rgba( var(--rgb_grey-10), var(--ninety-five-hundredths) );
	--input_select_textarea-color: rgb( var(--rgb_grey-5) );
	--input_select_textarea_focus-visible-background-color: rgba( var(--rgb_white), var(--ninety-five-hundredths) );
	--input_select_textarea_focus-visible-color: rgb( var(--rgb_grey-2) );
	--menu-background-color: rgba( var(--rgb_grey-25), var(--ninety-five-hundredths) );
	--menu-border-color: rgba( var(--rgb_grey-20), var(--five-tenths) );
	--menu-heading-background-color: rgba( var(--rgb_black), var(--five-hundredths) );
	--menu-heading-color: rgb( var(--rgb_grey-8) );
	--menu-heading-text-shadow-color: rgba( var(--rgb_grey-18), var(--eight-tenths) );
	--menu-li-a_active_button_not_disabled_active-background-color: rgba( var(--rgb_black), var(--five-hundredths) );
	--menu-li-a_active_button_not_disabled_active-color: rgb( var(--rgb_grey-4) );
	--menu-li-a_focus-visible_hover_button_not_disabled_focus-visible_hover-background-color: rgba( var(--rgb_black), var(--two-hundredths) );
	--menu-li-a_focus-visible_hover_button_not_disabled_focus-visible_hover-color: rgb( var(--rgb_grey-8) );
	--outline-color: rgba( var(--rgb_blue), var(--eight-tenths) );
	--panel-background-color: rgba( var(--rgb_grey-18), var(--five-hundredths) );
	--panel-border-color: rgba( var(--rgb_grey-20), var(--five-tenths) );
	--popover-background-color: rgba( var(--rgb_white), var(--ninety-five-hundredths) );
	--popover-border-color: rgba( var(--rgb_black), var(--eight-tenths) );
	--surface-background-color: rgba( var(--rgb_grey-25), var(--ninety-five-hundredths) );
	--table-background-color: rgba( var(--rgb_grey-25), var(--ninety-five-hundredths) );
	--table-border-color: rgba( var(--rgb_grey-20), var(--five-tenths) );
	--table-border-color_accent: rgb( var(--rgb_blue) );
	--table-color: rgb( var(--rgb_grey-6) );
	--table-tbody-tr_focus-visible_hover-background-image:
		linear-gradient(
			rgba( var(--rgb_pastel-blue-pale), 0.42 ) 20%,
			rgba( var(--rgb_pastel-blue-pale), var(--four-tenths) ) 40%,
			rgba( var(--rgb_pastel-blue-pale), var(--four-tenths) ) 60%,
			rgba( var(--rgb_pastel-blue-pale), 0.42 ) 80%
		),
		linear-gradient(
			135deg,
			rgba( 0, 240, 0, var(--one-hundredth) ) 20%,
			rgba( 0, 220, 0, var(--two-hundredths) ),
			rgba( 0, 240, 0, var(--one-hundredth) ) 80%
		),
		linear-gradient(
			45deg,
			rgba( 0, 0, 240, var(--one-hundredth) ) 20%,
			rgba( 0, 0, 220, var(--two-hundredths) ),
			rgba( 0, 0, 240, var(--one-hundredth) ) 80%
		)
	;
	--table-tbody-tr_nth-child_odd-background-color: rgba( var(--rgb_grey-8), var(--five-hundredths) );
	--table-td_th-border-color: rgba( var(--rgb_grey-2), var(--one-tenth) );
	--table-th-background-color: rgba( var(--rgb_black), var(--five-hundredths) );
	--table-th-color: rgb( var(--rgb_grey-5) );
	--table-thead-tr-background-color: rgba( var(--rgb_grey-24), var(--ninety-eight-hundredths) );
	--table_accent-tbody-tr_nth-child_even-background-color: rgba( var(--rgb_grey-25), var(--four-tenths) );
	--table_accent-tbody-tr_nth-child_odd-background-color: rgba( var(--rgb_pastel-green-pale), var(--four-tenths) );
	--table_accent-thead-border-color: rgba( var(--rgb_black), var(--two-tenths) );
}
/* #endregion */


/* #region * */
* {
	transition: outline var(--transition-duration_medium);
}

*:focus-visible {
	outline: medium double var(--outline-color);
}
/* #endregion */


/* #region [popover] */
[popover] {
	backdrop-filter: blur(4px);
	background-color: var(--popover-background-color);
	border: var(--border-width_medium) solid var(--popover-border-color);
	border-radius: var(--border-radius_small);
	box-shadow: 0 var(--box-shadow-offset_large) var(--box-shadow-color_medium);
	color: var(--color);
	padding: 0;
	transition:
		display var(--transition-duration_medium) allow-discrete,
		opacity var(--transition-duration_medium),
		overlay var(--transition-duration_medium) allow-discrete
	;
}

[popover]:not(:popover-open) {
	opacity: 0;
}
/* #endregion */


/* #region ::backdrop */
dialog::backdrop {
	backdrop-filter: blur(4px);
	background-color: var(--backdrop-background-color);
	transition:
		display var(--transition-duration_short) allow-discrete,
		opacity var(--transition-duration_short),
		overlay var(--transition-duration_short) allow-discrete
	;
}

dialog:not([open])::backdrop {
	opacity: 0;
}
/* #endregion */


/* #region <body> */
body {
	background-color: var(--background-color);
	color: var(--color);
	font-family: sans-serif;
	margin: 0;
}
/* #endregion */


/* #region <button> */
button {
	background-color: var(--button-background-color);
	border: var(--border-width_small) solid var(--button-border-color);
	border-radius: var(--border-radius_small);
	box-shadow: none;
	color: var(--button-color);
	font-family: sans-serif;
	font-size: 1rem;
	font-variant: small-caps;
	padding: var(--padding_extra-extra-small) var(--padding_extra-small);
	text-shadow: var(--text-shadow-offset_medium) var(--text-shadow-offset_medium) var(--button-text-shadow-color);
	transition:
		background-color var(--transition-duration_medium),
		border-color var(--transition-duration_medium),
		color var(--transition-duration_medium),
		scale var(--transition-duration_long)
	;
}

button:not(:disabled) {
	cursor: pointer;
}

button:disabled {
	cursor: not-allowed;
	opacity: var(--five-tenths);
}

button:not(:disabled):focus-visible,
button:not(:disabled):hover {
	background-color: var(--button_not_disabled_focus-visible_hover-background-color);
	border-color: var(--button_not_disabled_focus-visible_hover-border-color);
	color: var(--button_not_disabled_focus-visible_hover-color);
	scale: var(--scale-x-large);
}

button:not(:disabled):active {
	background-color: var(--button_not_disabled_active-background-color);
	border-color: var(--button_not_disabled_active-border-color);
	color: var(--button_not_disabled_active-color);
	outline: var(--outline-color) double medium;
	scale: var(--scale-x-large-less);
}

button.Landscape_accent {
	background-color: var(--button_accent-background-color);
	color: var(--button_accent-color);
}

button:not(:disabled).Landscape_accent:focus-visible,
button:not(:disabled).Landscape_accent:hover {
	background-color: var(--button_accent_not_disabled_focus-visible_hover-background-color);
	color: var(--button_accent_not_disabled_focus-visible_hover-color);
}

button:not(:disabled).Landscape_accent:active {
	background-color: var(--button_accent_not_disabled_active-background-color);
	color: var(--button_accent_not_disabled_active-color);
}
/* #endregion */


/* #region <a> | <button>.link */
a,
button.Landscape_link {
	color: var(--a-color);
	cursor: pointer;
	display: inline-block;
	text-decoration: underline;
	transition:
		color var(--transition-duration_medium),
		scale var(--transition-duration_long)
	;
}

a:focus-visible,
a:hover,
button.Landscape_link:focus-visible,
button.Landscape_link:hover {
	color: var(--a_focus-visible_hover-color);
	text-decoration: underline;
	scale: var(--scale-large);
}

a:active,
button.Landscape_link:active {
	color: var(--a_active-color);
	text-decoration: underline double;
	scale: var(--scale-large-less);
}
/* #endregion */


/* #region <button>.link */
button.Landscape_link {
	background-color: unset;
	border: unset;
	border-radius: unset;
	font-size: unset;
	font-variant: unset;
	padding: unset;
	text-align: start;
	text-shadow: unset;
}

button.Landscape_link:focus-visible,
button.Landscape_link:hover {
	background-color: unset;
}

button.Landscape_link:active {
	background-color: unset;
	outline: unset;
}
/* #endregion */


/* #region <pre> > <code> */
pre > code {
	background-color: var(--panel-background-color);
	border-radius: var(--border-radius_small);
	display: block;
	margin: var(--margin_small) 0;
	overflow: auto;
	padding: var(--padding_small);
}
/* #endregion */


/* #region <fieldset> */
fieldset {
	border: var(--border-width_medium) solid var(--fieldset-border-color);
	border-radius: var(--border-radius_small);
	margin: 0;
	padding: var(--padding_small);
}

fieldset + fieldset {
	margin-top: var(--margin_medium);
}
/* #endregion */


/* #region <h1> | <h2> | <h3> | <h4> | <h5> | <h6> */
h1,
h2,
h3,
h4,
h5,
h6 {
	color: var(--h1_h2_h3_h4_h5_h6-color);
	margin: 0 0 var(--padding_small);
	text-shadow: var(--text-shadow-offset_medium) var(--text-shadow-offset_medium) var(--h1_h2_h3_h4_h5_h6-text-shadow-color);
}

h1,
h2,
h3 {
	border-bottom: var(--border-width_medium) solid var(--h1_h2_h3-border-bottom-color);
}

h4,
h5,
h6 {
	text-decoration: underline solid var(--h4_h5_h6-text-decoration-color) 10%;
}
/* #endregion */


/* #region <input> | <label> | <select> */
input[type="checkbox"]:not(:disabled),
input[type="radio"]:not(:disabled),
select:not(:disabled),
label:has(
	input[type="checkbox"]:not(:disabled),
	input[type="radio"]:not(:disabled),
	select:not(:disabled)
) {
	cursor: pointer;
}

label:has(input[type="radio"]) {
	margin-left: var(--margin_extra-small);
	margin-right: var(--margin_extra-small);
}
/* #endregion */


/* #region <input> | <select> */
input,
select {
	overflow: hidden;
	text-overflow: ellipsis;
}

input:hover,
select:hover {
	scale: var(--scale-x-large);
}

input:focus-visible,
select:focus-visible {
	scale: var(--scale-x-large-less);
}
/* #endregion */


/* #region <input> | <textarea> */
input[readonly],
textarea[readonly] {
	opacity: var(--five-tenths);
}
/* #endregion */


/* #region <textarea> */
textarea:hover {
	scale: var(--scale-large);
}

textarea:focus-visible {
	scale: var(--scale-large-less);
}
/* #endregion */


/* #region <input> | <select> | <textarea> */
input,
select,
textarea {
	background-color: transparent;
	border: var(--border-width_medium) solid transparent;
	border-bottom-color: var(--input_select_textarea-border-bottom-color);
	box-sizing: border-box;
	color: var(--input_select_textarea-color);
	padding: var(--padding_extra-extra-small) var(--padding_extra-small);
	transition:
		background-color var(--transition-duration_medium),
		border-color var(--transition-duration_medium),
		color var(--transition-duration_medium),
		scale var(--transition-duration_long)
	;
}

input:disabled,
select:disabled,
textarea:disabled {
	cursor: not-allowed;
	opacity: var(--five-tenths);
}

input:invalid,
input:out-of-range,
select:invalid,
textarea:invalid {
	border-color: rgba( var(--rgb_red), var(--eight-tenths) );
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	background-color: var(--input_select_textarea_focus-visible-background-color);
	color: var(--input_select_textarea_focus-visible-color);
}
/* #endregion */


/* #region <label> | .label */
.Landscape_label,
label {
	font-variant: small-caps;
	font-weight: bold;
}
/* #endregion */


/* #region <legend> */
legend {
	font-variant: small-caps;
}
/* #endregion */


/* #region <menu> */
menu {
	background-color: var(--menu-background-color);
	border: var(--border-width_medium) solid var(--menu-border-color);
	border-radius: var(--border-radius_small);
	list-style-type: none;
	margin: auto;
	padding: var(--padding_medium);
	text-align: center;
	user-select: none;
}
/* #endregion */


/* #region <menu> > <li> <a> | <menu> > <li> <button> */
menu > li a {
	border-radius: var(--border-radius_small);
	color: var(--button-color);
	font-size: 1rem;
	text-decoration: none;
	text-shadow: var(--text-shadow-offset_medium) var(--text-shadow-offset_medium) var(--button-text-shadow-color);
}

menu > li a:focus-visible,
menu > li a:hover {
	color: var(--button_not_disabled_focus-visible_hover-color);
	scale: var(--scale-x-large);
	text-decoration: none;
}

menu > li a:active {
	color: var(--button_not_disabled_active-color);
	outline: var(--outline-color) double medium;
	scale: var(--scale-x-large-less);
	text-decoration: none;
}

menu > li :is(
	a,
	button
) {
	background-color: transparent;
	border-style: none;
	box-sizing: border-box;
	font-variant: small-caps;
	margin: 0;
	padding: var(--padding_small) var(--padding_medium);
	transition:
		background-color var(--transition-duration_medium),
		color var(--transition-duration_medium),
		scale var(--transition-duration_long)
	;
	width: 100%;
}

menu > li a:focus-visible,
menu > li a:hover,
menu > li button:not(:disabled):focus-visible,
menu > li button:not(:disabled):hover {
	background-color: var(--menu-li-a_focus-visible_hover_button_not_disabled_focus-visible_hover-background-color);
	color: var(--menu-li-a_focus-visible_hover_button_not_disabled_focus-visible_hover-color);
}

menu > li a:active,
menu > li button:not(:disabled):active {
	background-color: var(--menu-li-a_active_button_not_disabled_active-background-color);
	color: var(--menu-li-a_active_button_not_disabled_active-color);
}
/* #endregion */


/* #region <p> */
p {
	margin: 0;
}

p + p {
	margin-top: var(--margin_small);
}
/* #endregion */


/* #region <table> */
table {
	border-collapse: collapse;
	box-sizing: border-box;
	width: 100%;
}

td {
	vertical-align: top;
}

th {
	vertical-align: middle;
}

tbody > tr {
	transition: background-image var(--transition-duration_medium);
}

tbody > tr:nth-child(odd) {
	background-color: var(--table-tbody-tr_nth-child_odd-background-color);
}

tbody > tr:focus-visible,
tbody > tr:hover {
	background-image: var(--table-tbody-tr_focus-visible_hover-background-image);
}
/* #endregion */


/* #region <table> | .grid-table */
.Landscape_grid-table,
table {
	background-color: var(--table-background-color);
	border: var(--border-width_medium) solid var(--table-border-color);
	border-radius: var(--border-radius_small);
	color: var(--table-color);
}

.Landscape_grid-table_header-cell,
.Landscape_grid-table_table-cell,
td,
th {
	border-color: var(--table-td_th-border-color);
	border-style: solid;
	border-width: var(--border-width_medium) var(--border-width_small);
	padding: var(--padding_extra-extra-small) var(--padding_extra-small);
}

.Landscape_grid-table_header-cell,
th {
	background-color: var(--table-th-background-color);
	color: var(--table-th-color);
	font-weight: var(--font-weight_heavy);
	text-align: center;
}

.Landscape_grid-table_header-row > .Landscape_grid-table_header-cell,
thead > tr {
	background-color: var(--table-thead-tr-background-color);
}

.Landscape_grid-table_table-cell,
td {
	border-width: 0 var(--border-width_small);
}

:is(
	.Landscape_grid-table,
	table
) :is(
	input,
	select,
	textarea
) {
	width: 100%;
}
/* #endregion */


/* #region <table>.accent */
table.Landscape_accent thead {
	border: var(--border-width_small) solid var(--table_accent-thead-border-color);
}

table.Landscape_accent > tbody > tr:nth-child(even) {
	background-color: var(--table_accent-tbody-tr_nth-child_even-background-color);
}

table.Landscape_accent > tbody > tr:nth-child(odd) {
	background-color: var(--table_accent-tbody-tr_nth-child_odd-background-color);
}
/* #endregion */


/* #region <table>.borderless-table */
.Landscape_borderless-table,
.Landscape_borderless-table .Landscape_grid-table_header-cell,
.Landscape_borderless-table .Landscape_grid-table_table-cell,
.Landscape_borderless-table td,
.Landscape_borderless-table th {
	border-style: none;
}
/* #endregion */


/* #region .box */
.Landscape_box {
	box-shadow: 0 var(--box-shadow-offset_small) var(--box-shadow-color_medium);
}
/* #endregion */


/* #region .flex-column */
.Landscape_flex-column {
	flex: 1 1;
	margin: 0 var(--margin_small);
}

.Landscape_flex-column:first-of-type {
	margin-left: 0;
}

.Landscape_flex-column:last-of-type {
	margin-right: 0;
}

.Landscape_flex-column.Landscape_flex-column_centered {
	flex: 0 1 auto;
}

.Landscape_flex-column.Landscape_flex-column_compact {
	flex: 0 1;
}

.Landscape_flex-column_container {
	display: flex;
	justify-content: center;
	width: 100%;
}

.Landscape_flex-column_container.Landscape_flex-column_dividers > .Landscape_flex-column {
	margin: 0;
}

.Landscape_flex-column_container.Landscape_flex-column_dividers > .Landscape_flex-column + .Landscape_flex-column {
	border-left: var(--border-width_small) solid rgba( var(--rgb_grey-8), var(--five-tenths) );
}
/* #endregion */


/* #region .flex-row */
.Landscape_flex-row {
	flex: 1 1;
	margin: var(--margin_small) 0;
}

.Landscape_flex-row:first-of-type {
	margin-top: 0;
}

.Landscape_flex-row:last-of-type {
	margin-bottom: 0;
}

.Landscape_flex-row.Landscape_flex-row_compact {
	flex: 0 1;
}

.Landscape_flex-row_container {
	display: flex;
	flex-direction: column;
	height: 100%;
	justify-content: center;
}
/* #endregion */


/* #region .glyph-button */
.glyph-button {
	background-color: transparent;
	border-radius: 50%;
	border-style: none;
	color: var(--glyph-button-color);
	flex: none;
	height: 1.4rem;
	line-height: 1.4rem;
	margin: var(--margin_extra-small);
	padding: 0;
	text-align: center;
	transition:
		background-color var(--transition-duration_medium),
		color var(--transition-duration_medium),
		opacity var(--transition-duration_medium),
		scale var(--transition-duration_long),
		text-shadow var(--transition-duration_medium)
	;
	width: 1.4rem;
}

.glyph-button:not(:disabled):focus-visible,
.glyph-button:not(:disabled):hover {
	background-color: var(--glyph-button_focus-visible_hover-background-color);
	color: var(--glyph-button_focus-visible_hover-color);
	text-shadow: var(--text-shadow-offset_medium) var(--text-shadow-offset_medium) var(--glyph-button_focus-visible_hover-text-shadow-color);
}

.glyph-button:not(:disabled):active {
	background-color: var(--glyph-button_active-background-color);
	color: var(--glyph-button_active-color);
	text-shadow: var(--text-shadow-offset_medium) var(--text-shadow-offset_medium) var(--glyph-button_active-text-shadow-color);
}
/* #endregion */


/* #region .grid-table */
.Landscape_grid-table {
	display: grid;
	gap: 0;
}

.Landscape_grid-table_header-cell {
	overflow: hidden;
	white-space: nowrap;
}

.Landscape_grid-table_header-cell,
.Landscape_grid-table_table-cell {
	border-color: transparent;
	grid-column: span 1 / span 1;
	text-overflow: ellipsis;
}

.Landscape_grid-table_header-row,
.Landscape_grid-table_table-row {
	display: contents;
}
/* #endregion */


/* #region .hover-text */
.Landscape_hover-text {
	opacity: 0;
	transition: opacity var(--transition-duration_short);
}

.Landscape_hover-text:focus-visible,
.Landscape_hover-text:hover,
.Landscape_hover-text_container:focus-visible .Landscape_hover-text,
.Landscape_hover-text_container:hover .Landscape_hover-text {
	opacity: 1;
}
/* #endregion */


/* #region .interactive */
.Landscape_interactive:not(:disabled) {
	cursor: pointer;
	transition: scale var(--transition-duration_long);
}

.Landscape_interactive:not(:disabled):focus-visible,
.Landscape_interactive:not(:disabled):hover {
	scale: var(--scale-x-large);
}

.Landscape_interactive:not(:disabled):active,
.Landscape_interactive:not(:disabled).Landscape_active {
	scale: var(--scale-x-large-less);
}
/* #endregion */


/* #region .menu-heading */
menu .Landscape_menu-heading {
	background-color: var(--menu-heading-background-color);
	border-radius: var(--border-radius_large);
	color: var(--menu-heading-color);
	font-size: 0.8em;
	font-variant: small-caps;
	letter-spacing: 0.05em;
	margin: var(--margin_small);
	padding: var(--padding_extra-small) var(--padding_small);
	text-align: center;
	text-shadow: var(--text-shadow-offset_large) var(--text-shadow-offset_large) var(--menu-heading-text-shadow-color);
}
/* #endregion */


/* #region .panel */
.Landscape_panel {
	background-color: var(--panel-background-color);
	border: var(--border-width_medium) solid var(--panel-border-color);
	border-radius: var(--border-radius_small);
	padding: var(--padding_medium);
}
/* #endregion */


/* #region .panel.sticky */
.Landscape_panel.Landscape_sticky {
	background-color: var(--popover-background-color);
	box-shadow: 0 var(--box-shadow-offset_small) var(--box-shadow-color_medium);
	padding: var(--padding_small);
	position: sticky;
	width: fit-content;
}
/* #endregion */


/* #region .required-field-indicator */
.Landscape_required-field-indicator::before {
	color: rgba( var(--rgb_red), var(--eight-tenths) );
	content: var(--content_required-field);
	font-size: 0.9rem;
	font-style: italic;
}
/* #endregion */


/* #region .scrollable */
.Landscape_scrollable {
	box-sizing: border-box;
	height: 100%;
	overflow: auto;
	width: 100%;
}

.Landscape_scrollable_x {
	box-sizing: border-box;
	max-width: 100%;
	overflow-x: auto;
	width: auto;
}

.Landscape_scrollable_y {
	box-sizing: border-box;
	height: auto;
	max-height: 100%;
	overflow-y: auto;
}
/* #endregion */


/* #region .section-heading */
.Landscape_section-heading {
	border-bottom: var(--border-width_small) solid rgba( var(--rgb_grey-8), var(--two-tenths) );
	color: rgb( var(--rgb_grey-15) );
	font-size: 1.15rem;
	font-weight: var(--font-weight_medium);
	margin-bottom: var(--margin_extra-small);
	padding-bottom: var(--padding_extra-extra-small);
	text-shadow: var(--text-shadow-offset_medium) var(--text-shadow-offset_medium) rgba( var(--rgb_grey-22), var(--eight-tenths) );
}
/* #endregion */


/* #region .shadow */
.Landscape_shadow {
	box-shadow: 0 var(--box-shadow-offset_small) var(--box-shadow-offset_large) var(--box-shadow-color_light);
}
/* #endregion */


/* #region .surface */
.Landscape_surface {
	background-color: var(--surface-background-color);
	background-image:
		linear-gradient(
			rgba( var(--rgb_black), var(--five-hundredths) ) 20%,
			rgba( var(--rgb_grey-2), var(--five-hundredths) ) 40%,
			rgba( var(--rgb_grey-2), var(--five-hundredths) ) 60%,
			rgba( var(--rgb_black), var(--five-hundredths) ) 80%
		),
		linear-gradient(
			150deg,
			rgba( 0, 240, 0, var(--one-hundredth) ) 20%,
			rgba( 0, 220, 0, var(--two-hundredths) ),
			rgba( 0, 240, 0, var(--one-hundredth) ) 80%
		),
		linear-gradient(
			30deg,
			rgba( 0, 0, 240, var(--one-hundredth) ) 20%,
			rgba( 0, 0, 220, var(--two-hundredths) ),
			rgba( 0, 0, 240, var(--one-hundredth) ) 80%
		)
	;
}
/* #endregion */


/* #region ul.inline */
ul.Landscape_inline {
	display: inline;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

ul.Landscape_inline li {
	display: inline;
}

ul.Landscape_inline li:not(:last-of-type)::after {
	content: ',';
}
/* #endregion */


/* #region ul.tags */
ul.Landscape_tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

ul.Landscape_tags li {
	align-items: center;
	border: var(--border-width_medium) solid rgba( var(--rgb_grey-12), var(--five-tenths) );
	border-radius: var(--border-radius_small);
	display: inline-flex;
	gap: 0.5em;
	padding: 0.25em;
}

ul.Landscape_tags li button {
	font-size: 0.8em;
}
/* #endregion */


/* #region .tooltip */
.Landscape_tooltip::before {
	color: var(--color_tooltip);
	content: var(--content_information-source);
	cursor: help;
	font-weight: normal;
}
/* #endregion */