/*
ooooooooo.                                    .   
`888   `Y88.                                .o8   
 888   .d88'  .ooooo.   .oooo.o  .ooooo.  .o888oo 
 888ooo88P'  d88' `88b d88(  "8 d88' `88b   888   
 888`88b.    888ooo888 `"Y88b.  888ooo888   888   
 888  `88b.  888    .o o.  )88b 888    .o   888 . 
o888o  o888o `Y8bod8P' 8""888P' `Y8bod8P'   "888" 
*/                                                
                                                  
/* Custom tailored CSS reset */                                                

:root {
  overflow-wrap: break-word; 
  -moz-tab-size: 4;
  tab-size: 4;
  -webkit-tap-highlight-color: transparent; 
}

/* Consistent box-sizing rules */
/* Set `background-repeat: no-repeat` to all elements and pseudo elements */
/* Set min-width to 0 for flexbox children not overflowing the container */
:where(*, *::before, *::after) {
  box-sizing: border-box;
  background-repeat: no-repeat; 
  min-width: 0;
}

/* Inherit text-decoration and vertical align to ::before and ::after pseudo elements */
:where(::before, ::after) {
  text-decoration: inherit; 
  vertical-align: inherit;
}

/* Prevent font size inflation */
html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

/* Remove margin on all sides */
/* Set body height */
/* Set automatic hyphenation as standard for breaking lines */
:where(body) {
  margin: 0;
  min-height: 100vh;
  hyphens: auto;
}

/* A elements that don't have a class get default styles */
:where(a:not([class])) {
  text-decoration-skip-ink: auto;
  color: currentColor;
}

/* Make images easier to work with */
:where(img, picture) {
  max-width: 100%;
  display: block;
  height: auto;
}

:where(menu, ul, ol) {
  list-style: none;
  padding: 0;
  margin: 0;
}

:where(hr) {
  height: 0;
}

/* Get rid of border for <iframe> */
:where(iframe) {
	border-style: none;
}

/* Add the correct vertical alignment of <progress> in Chrome, Firefox, and Opera */
:where(progress) {
	vertical-align: baseline;
}

/* Restore the font weight unset by the previous rule */
:where(optgroup) {
	font-weight: bold; 
}

/* Change the alignment on media elements and some form elements in all browsers. */
:where(audio, canvas, iframe, img, svg, video, [type=range]) {
  vertical-align: middle;
}

/* Change the svg fill color to match the text color in all browsers. */
:where(svg:not([fill])) {
  fill: currentColor;
}

/* Collapse table border spacing in all browsers, correct table border color inheritance and remove text indentation from table contents */
:where(table) {
  border-collapse: collapse;
  border-color: inherit;
  text-indent: 0;
}

/*
ooooooooooooo                                                                           oooo                    
8'   888   `8                                                                           `888                    
     888      oooo    ooo oo.ooooo.   .ooooo.   .oooooooo oooo d8b  .oooo.   oo.ooooo.   888 .oo.   oooo    ooo 
     888       `88.  .8'   888' `88b d88' `88b 888' `88b  `888""8P `P  )88b   888' `88b  888P"Y88b   `88.  .8'  
     888        `88..8'    888   888 888   888 888   888   888      .oP"888   888   888  888   888    `88..8'   
     888         `888'     888   888 888   888 `88bod8P'   888     d8(  888   888   888  888   888     `888'    
    o888o         .8'      888bod8P' `Y8bod8P' `8oooooo.  d888b    `Y888""8o  888bod8P' o888o o888o     .8'     
              .o..P'       888                 d"     YD                      888                   .o..P'      
              `Y8P'       o888o                "Y88888P'                     o888o                  `Y8P'       
*/                                                                                                              

/* Correct font size of <h1> */
:where(h1) {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Correct the inheritance and scaling of font size in all browsers and correct the odd `em` font sizing in all browsers. */
:where(code, kbd, samp, pre) {
  font-family: monospace, monospace;
  font-size: 0.9375em;
}

:where(pre) {
  overflow: auto;
}

/* Add consistent font size for <small> in all browsers. */
:where(small) {
  font-size: 0.875em;
}

/* Adjust the Line-height of sub and sup (https://gist.github.com/unruthless/413930) */
:where(sub, sup) {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

:where(sub) {
  bottom: -0.25em;
}

:where(sup) {
  top: -0.5em;
}

/*
oooooooooooo                                                     oooo                                                        .            
`888'     `8                                                     `888                                                      .o8            
 888          .ooooo.  oooo d8b ooo. .oo.  .oo.         .ooooo.   888   .ooooo.  ooo. .oo.  .oo.    .ooooo.  ooo. .oo.   .o888oo  .oooo.o 
 888oooo8    d88' `88b `888""8P `888P"Y88bP"Y88b       d88' `88b  888  d88' `88b `888P"Y88bP"Y88b  d88' `88b `888P"Y88b    888   d88(  "8 
 888    "    888   888  888      888   888   888       888ooo888  888  888ooo888  888   888   888  888ooo888  888   888    888   `"Y88b.  
 888         888   888  888      888   888   888       888    .o  888  888    .o  888   888   888  888    .o  888   888    888 . o.  )88b 
o888o        `Y8bod8P' d888b    o888o o888o o888o      `Y8bod8P' o888o `Y8bod8P' o888o o888o o888o `Y8bod8P' o888o o888o   "888" 8""888P' 
*/                                                                                                                                                                                                                                                                                

/* Inherit fonts for inputs and buttons */
:where(input, button, textarea, select, optgroup) {
  font: inherit;
}

/* Add consistent border for <fieldset> in all browsers. */
:where(fieldset) {
  border: 1px solid #a0a0a0;
}

/* Specify textarea resizability */
:where(textarea) {
	resize: vertical; 
}

/* Make sure certain form elements are not tiny */
:where(textarea:not([rows]), optgroup, [type=text]) {
  min-width: 16rem;
}

/* Correct the odd appearance of <input type="search"> in Chrome and Safari */
:where([type='search']) {
	-webkit-appearance: textfield; 
	outline-offset: -2px;
}
  
:where([type='search']::-webkit-search-decoration) {
  -webkit-appearance: none;
}

/* Add pointer cursor to various elements */
:where(button, summary, [type=radio], [type=submit], [type=checkbox], [type=color], [type=button], [type=reset], [type=range], [type=file], [type=file]::-webkit-file-upload-button) {
    cursor: pointer;
}

/* The selectors above don't work in Firefox when the following :has selector is added */
:where(label:has([type=checkbox], [type=radio])) {
  cursor: pointer;
}

/* Replace pointer cursor in disabled elements */
:where([disabled]) {
cursor: not-allowed;
}

/*
      .o.                                                        o8o   .o8        o8o  oooo   o8o      .               
     .888.                                                       `"'  "888        `"'  `888   `"'    .o8               
    .8"888.      .ooooo.   .ooooo.   .ooooo.   .oooo.o  .oooo.o oooo   888oooo.  oooo   888  oooo  .o888oo oooo    ooo 
   .8' `888.    d88' `"Y8 d88' `"Y8 d88' `88b d88(  "8 d88(  "8 `888   d88' `88b `888   888  `888    888    `88.  .8'  
  .88ooo8888.   888       888       888ooo888 `"Y88b.  `"Y88b.   888   888   888  888   888   888    888     `88..8'   
 .8'     `888.  888   .o8 888   .o8 888    .o o.  )88b o.  )88b  888   888   888  888   888   888    888 .    `888'    
o88o     o8888o `Y8bod8P' `Y8bod8P' `Y8bod8P' 8""888P' 8""888P' o888o  `Y8bod8P' o888o o888o o888o   "888"     .8'     
                                                                                                           .o..P'      
                                                                                                           `Y8P'       
*/                                                                                                                     

/* Specify the progress cursor of updating elements */
:where([aria-busy='true']) {
  cursor: progress;
}
  
/* Specify the pointer cursor of trigger elements */
:where([aria-controls]) {
  cursor: pointer;
}

/* Specify the unstyled cursor of disabled, not-editable, or otherwise inoperable elements */
:where([aria-disabled='true']) {
  cursor: not-allowed;
}

/* Change the display on visually hidden accessible elements in all browsers (opinionated). */

:where([aria-hidden="false" i][hidden]) {
  display: initial;
}

:where([aria-hidden="false" i][hidden]:not(:focus)) {
  clip: rect(0, 0, 0, 0);
  position: absolute;
}

/*
oooooooooo.                                                                                                                   o8o   .o88o.  o8o            
`888'   `Y8b                                                                                                                  `"'   888 `"  `"'            
 888     888 oooo d8b  .ooooo.  oooo oooo    ooo  .oooo.o  .ooooo.  oooo d8b          .oooo.o oo.ooooo.   .ooooo.   .ooooo.  oooo  o888oo  oooo   .ooooo.  
 888oooo888' `888""8P d88' `88b  `88. `88.  .8'  d88(  "8 d88' `88b `888""8P         d88(  "8  888' `88b d88' `88b d88' `"Y8 `888   888    `888  d88' `"Y8 
 888    `88b  888     888   888   `88..]88..8'   `"Y88b.  888ooo888  888     8888888 `"Y88b.   888   888 888ooo888 888        888   888     888  888       
 888    .88P  888     888   888    `888'`888'    o.  )88b 888    .o  888             o.  )88b  888   888 888    .o 888   .o8  888   888     888  888   .o8 
o888bood8P'  d888b    `Y8bod8P'     `8'  `8'     8""888P' `Y8bod8P' d888b            8""888P'  888bod8P' `Y8bod8P' `Y8bod8P' o888o o888o   o888o `Y8bod8P' 
                                                                                               888                                                         
                                                                                              o888o                                                        
*/                                                                                                                                                         

/* Remove the margin on controls in Safari. */

:where(button, input, select) {
  margin: 0;
}

/* Correct the inability to style buttons in iOS and Safari. */

:where(button, [type="button" i], [type="reset" i], [type="submit" i]) {
  -webkit-appearance: button;
}

/* Add the correct font weight in Chrome, Edge, and Safari. */

:where(b, strong) {
  font-weight: bolder;
}

/* Add the correct text decoration in Safari. */

:where(abbr[title]) {
  text-decoration: underline;
  text-decoration: underline dotted;
}

/* Add the correct display in Safari. */

:where(details > summary:first-of-type) {
  display: list-item;
}

/* Add the correct styles in Safari. */

:where(dialog) {
  background-color: white;
  border: solid;
  color: black;
  height: -moz-fit-content;
  height: fit-content;
  left: 0;
  margin: auto;
  padding: 1em;
  position: absolute;
  right: 0;
  width: -moz-fit-content;
  width: fit-content;
}

:where(dialog:not([open])) {
  display: none;
}

/* Correct the cursor style of increment and decrement buttons in Safari. */

:where(::-webkit-inner-spin-button, ::-webkit-outer-spin-button) {
   height: auto;
 }

 /* Correct the text style of placeholders in Chrome, Edge, and Safari. */

 :where(::-webkit-input-placeholder) {
  color: inherit;
  opacity: 0.54;
}

/* Remove the inner padding in Chrome, Edge, and Safari on macOS. */

:where(::-webkit-search-decoration) {
  -webkit-appearance: none;
}

/* Correct the inability to style upload buttons in iOS and Safari and change font properties to `inherit` in Safari. */

:where(::-webkit-file-upload-button) {
  -webkit-appearance: button; 
  font: inherit; 
}