:root{--dark: 0, 0%;--light: 0, 0%;--base-h: 170;--base: var(--base-h), 5%;--warning: 0, 100%, 50%;--green: 120, 100%, 43%;--red: 8, 100%, 60%;--below-menu-zIndex: 3;--menu-zIndex: 5;--menu-btn-zIndex: 10;--page_padding: 3.2rem;--input_padding: 0.8rem;--input_border: 1px solid hsl(var(--base), 10%, 0.2);--input_border_radius: 0.4rem;--body-bg: hsl(var(--base), 98%);--shadow-color: 0deg 0% 64%;--shadow-elevation-low: 0.2px 0.2px 0.4px hsl(var(--shadow-color) / 0.08), 0.8px 0.7px 1.5px -0.4px hsl(var(--shadow-color) / 0.49);--shadow-elevation-medium: 0.2px 0.2px 0.4px hsl(var(--shadow-color) / 0.07), 1.3px 1.1px 2.5px -0.2px hsl(var(--shadow-color) / 0.33), 3.8px 3.4px 7.3px -0.4px hsl(var(--shadow-color) / 0.58);--shadow-elevation-high: 0.2px 0.2px 0.4px hsl(var(--shadow-color) / 0.08), 2.8px 2.6px 5.5px -0.1px hsl(var(--shadow-color) / 0.25), 5.6px 5.1px 10.9px -0.2px hsl(var(--shadow-color) / 0.42), 10.2px 9.3px 19.9px -0.3px hsl(var(--shadow-color) / 0.59), 18.3px 16.7px 35.7px -0.4px hsl(var(--shadow-color) / 0.76);--dark-main-text-color: var(--base), 85%;--dark-main-background-color: var(--base), 0%;--dark-card-background-color: var(--base-h), 5%, 25%;--dark-card-text-color: var(--base), 85%;--dark-body-bg: var(--base), 20%;--dark-highlight: calc(var(--base-h) - 80), 80%;--dark-highlight-2: calc(var(--base-h) + 80), 80%;--dark-text-color: hsl(var(--base), 100%, 0.8);--dark-blue500: 249, 56%, 45%;--dark-yellow500: 36, 100%, 51%;--dark-base-color: var(--base-h), 35%, 30%;--dark-link-color: hsl(var(--highlight), 60%);--dark-link-hover: hsl(var(--highlight), 40%);--dark-link-visited: hsl(var(--highlight), 50%)}:root[color-mode=dark]{--main-text-color: var(--dark-main-text-color);--main-background-color: var(--dark-main-background-color);--card-background-color: var(--dark-card-background-color);--card-text-color: var(--dark-card-text-color);--body-bg: var(--dark-body-bg);--highlight: var(--dark-highlight);--highlight-2: var(--dark-highlight-2);--text-color: var(--dark-text-color);--blue500: var(--dark-blue500);--yellow500: var(--dark-yellow500);--base-color: var(--dark-base-color);--selection-background: hsl(var(--main-text-color));--selection-text-color: hsl(var(--main-background-color));--link-color: var(--dark-link-color);--link-hover: var(--dark-link-hover);--link-visited: var(--dark-link-visited)}@media(prefers-color-scheme: dark){:root{--main-text-color: var(--dark-main-text-color);--main-background-color: var(--dark-main-background-color);--card-background-color: var(--dark-card-background-color);--card-text-color: var(--dark-card-text-color);--body-bg: var(--dark-body-bg);--highlight: var(--dark-highlight);--highlight-2: var(--dark-highlight-2);--text-color: var(--dark-text-color);--blue500: var(--dark-blue500);--yellow500: var(--dark-yellow500);--base-color: var(--dark-base-color);--selection-background: hsl(var(--main-text-color));--selection-text-color: hsl(var(--main-background-color));--link-color: var(--dark-link-color);--link-hover: var(--dark-link-hover);--link-visited: var(--dark-link-visited)}}:root,:root[color-mode=light]{--main-text-color: var(--base), 10%;--main-background-color: var(--base), 90%;--card-background-color: var(--base-h), 5%, 95%;--card-text-color: var(--base), 10%;--body-bg: var(--base), 90%;--highlight: calc(var(--base-h) + 80), 70%;--highlight-2: calc(var(--base-h) - 80), 80%;--text-color: hsl(var(--base), 20%);--blue500: 249, 56%, 23%;--yellow500: 41, 100%, 57%;--base-color: var(--base-h), 50%, 70%;--selection-background: hsl(var(--base-h), 40%, 50%);--selection-text-color: hsl(var(--main-background-color));--link-color: hsl(var(--highlight), 40%);--link-hover: hsl(var(--highlight), 50%);--link-visited: hsl(var(--highlight), 30%)}:root ::-moz-selection{background:var(--selection-background);color:var(--selection-text-color)}:root ::selection{background:var(--selection-background);color:var(--selection-text-color)}:root ::backdrop{background:rgba(51,51,51,.8)}.container-queries .card{display:flex;flex-direction:column;row-gap:.8rem;background:hsl(var(--base-h), 60%, 20%);padding:2rem;border-radius:.8rem;overflow:hidden}.container-queries .card .title{font-size:2.4rem;color:hsl(var(--base-h), 70%, 98%)}.container-queries .card .description{color:hsl(var(--base-h), 70%, 90%)}.container-queries .block.container-inline{container:display__block/inline-size}.container-queries .block.container-inline .card{--new-base-h: var(--base-h);background:hsl(var(--new-base-h), 60%, 20%);margin-block:1.6rem}@container display__block (min-width: 300px){.container-queries .block.container-inline .card{--new-base-h: calc(var(--base-h) + 30)}}@container display__block (min-width: 600px){.container-queries .block.container-inline .card{--new-base-h: calc(var(--base-h) + 60)}}@container display__block (min-width: 900px){.container-queries .block.container-inline .card{--new-base-h: calc(var(--base-h) + 90)}}.container-queries .container-inline-size{container-type:inline-size}.container-queries article.flex{--article-gap: 2.4rem;display:flex;flex-wrap:wrap;gap:var(--article-gap)}.container-queries .first-section{container:cards__wrapper/inline-size}.container-queries .first-section .card{--new-base-h: var(--base-h);background:hsl(var(--new-base-h), 60%, 20%)}@container cards__wrapper (min-width: 300px){.container-queries .first-section .card{--new-base-h: calc(var(--base-h) + 30)}}@container cards__wrapper (min-width: 600px){.container-queries .first-section .card{--new-base-h: calc(var(--base-h) + 60)}}@container cards__wrapper (min-width: 900px){.container-queries .first-section .card{--new-base-h: calc(var(--base-h) + 90)}}.container-queries .second-section{container:cards__wrapper/inline-size}.container-queries .second-section .card{container:card/inline-size;width:100cqi;padding:0}.container-queries .second-section .card .content{padding:1.6rem}.container-queries .second-section .card .hero_img{aspect-ratio:1;overflow:hidden}.container-queries .second-section .card .hero_img img{aspect-ratio:1}@container card (max-width: 350px){.container-queries .second-section .description{display:none}}@container cards__wrapper  (min-width: 600px){.container-queries .second-section .card{display:grid;grid-template-columns:1fr 1fr}}@container cards__wrapper  (min-width: 960px){.container-queries .second-section .card{display:grid;grid-template-columns:1fr 1fr;max-width:calc(50% - var(--article-gap)/2)}.container-queries .second-section .card .hero_img{aspect-ratio:3/4;height:100%;width:100%}.container-queries .second-section .card .hero_img .image-w-placeholder{height:100%}}.container-queries .page__wrapper{display:grid;grid-template-columns:1fr 4fr;background:hsl(calc(var(--base-h) - 50), 60%, 95%);padding:3.2rem;gap:3.2rem;resize:horizontal;overflow:hidden;max-width:calc(100vw - var(--page-padding)*2)}.container-queries select{width:100%}.container-queries .search__wrapper label{font-size:2rem;font-weight:600}.container-queries .layout.three-col{display:grid;min-height:75vh}@media(min-width: 768px){.container-queries .layout.three-col{grid-template-columns:2fr 5fr 1fr}}.container-queries .layout.three-col .zoom,.container-queries .layout.three-col .selected,.container-queries .layout.three-col .all{display:grid;grid-template-rows:max-content auto;padding:.8rem}.container-queries .layout.three-col .zoom__wrapper,.container-queries .layout.three-col .selected__wrapper,.container-queries .layout.three-col .all__wrapper{padding:.8rem}.container-queries .layout.three-col .zoom{background:hsl(var(--base-h), 50%, 95%)}.container-queries .layout.three-col .selected{background:hsl(var(--base-h), 50%, 95%)}.container-queries .layout.three-col .all{background:hsl(var(--base-h), 50%, 90%);padding:1.6rem}.container-queries .layout.three-col .zoom__wrapper{padding:6.4rem 1.6rem}.container-queries .layout.three-col .all__wrapper{display:grid;grid-template-columns:repeat(2, 1fr);grid-auto-rows:max-content;gap:1.6rem}.container-queries .layout.three-col .selected__wrapper{display:grid;gap:.8rem;grid-auto-rows:max-content}