.icon.active svg{fill:var(--color-primary)}nav{position:fixed;bottom:0;width:100%;display:grid;grid-auto-flow:column;box-sizing:border-box;background-color:var(--color-background);box-shadow:0 -2px 15px -4px #d3d3d3;align-items:center}nav a{padding:var(--gap);border-bottom:4px solid transparent;justify-content:center;display:flex;flex-direction:column;align-items:center}nav a.active{border-bottom-color:var(--color-primary)}nav .title{font-size:.8rem;text-transform:capitalize}nav coffee-image-upload{transform:scale(1.3)}nav coffee-image-upload .title{font-size:.9rem}:root{--gap--s: .4rem;--gap: 1rem;--gap--l: 1.4rem;--color-background: white;--color-background--subtle: rgba(250, 250, 250, .4);--color-background--alternative: #d4d4d4;--color-border: black;--color-border--alternative: #c5c5c5;--color-text: black;--color-text--primary: black;--color-primary: #e1a76d;--color-secondary: rgb(212 177 165 / 30%);--color-shadow: #505050;--color-success: #008000;--color-error: #b72b2b;--color-danger: #b72b2b;--border-radius: 18px;--z-index--xs: 10;--z-index--s: 20;--z-index--m: 30;--z-index--l: 40;--z-index--xl: 50;--tile-height: 240px}@media (prefers-color-scheme: dark){:root{--color-background: #121212;--color-background--subtle: rgba(32, 32, 32, .4);--color-background--alternative: #2f2f2f;--color-border: #e0e0e0;--color-border--alternative: #868686;--color-text: #e0e0e0;--color-text--primary: #272727;--color-secondary: rgba(255, 255, 255, .1);--color-shadow: rgba(0, 0, 0, .5);--color-success: #00ff00;--color-error: #b72b2b;--color-danger: #b72b2b}}html,body{background-color:var(--color-background);color:var(--color-text);margin:0;padding:0;min-height:100%;font-family:Arial,Helvetica,sans-serif}body{padding-bottom:100px}main{max-width:1440px;margin:0 auto;padding:0}h1,h2,h3,h4,h5{margin:var(--gap) 0;padding:0}section{margin:var(--gap--l) 0;padding:0 var(--gap)}ul,li{margin:0;padding:0}li{list-style:none}a{text-decoration:none;color:inherit}button,a{position:relative;border:2px solid transparent;&:active{top:2px}&:focus-visible{border-color:var(--color-primary)!important;outline:none}}a[href],.in-progress{&:after{content:" ";position:absolute;inset:0;background:center no-repeat url(/icons/loader.svg) var(--color-background--subtle);display:none;opacity:0;transition-property:display opacity;transition-duration:.4s;transition-timing-function:ease-in-out;transition-behavior:allow-discrete;transition-delay:.3s}&:not(button):after{border-radius:var(--border-radius)}&.button:after{background-color:var(--color-background)}&:active:after{display:block;opacity:1;@starting-style{opacity:0}}}a[href].in-progress,button.in-progress{&:after{display:block;opacity:1;@starting-style{opacity:0}}}svg{fill:var(--color-text)}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;border:0;padding:0;white-space:nowrap;clip-path:inset(100%);clip:rect(0 0 0 0);overflow:hidden}.emphasized{font-weight:700;font-size:1.5rem}.carousel{overflow-x:auto;scroll-snap-type:x mandatory;scroll-marker-group:before}.carousel>*{scroll-snap-align:start}.carousel::scroll-marker-group{z-index:var(--z-index--xs);display:flex;justify-content:center;gap:var(--gap);position:absolute;top:var(--gap);justify-self:anchor-center}.carousel>*::scroll-marker{content:"";border:2px solid var(--color-primary);border-radius:50%;width:1em;height:1em;background-color:transparent;transition:background-color .8s ease-out}.carousel>*::scroll-marker:target-current{background-color:var(--color-background)}.hidden{display:none}.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:var(--gap);overflow:hidden;align-items:center}.tiles>*{height:var(--tile-height);display:flex;flex-direction:column;justify-content:center;overflow:hidden;border-radius:var(--border-radius)}.tiles img{display:block;width:100%;height:auto}@view-transition{navigation: auto;}