:is(.beer,beer-css){.field{--_input:3rem;--_start:1.2rem;--_middle:calc(var(--_input, 0)/2);border-radius:.25rem .25rem 0 0;min-block-size:var(--_input);display:flex;flex-direction:column}.field.fill{--_background:var(--surface-variant);background-color:unset!important;color:unset!important}.field.fill>:is(input,select,textarea){background-color:var(--_background);z-index:0}.field.small{--_input:2.5rem;--_start:1rem}.field.large{--_input:3.5rem;--_start:1.4rem}.field.extra{--_input:4rem;--_start:1.6rem}.field.border{border-radius:.25rem}.field[class*=round].small{border-radius:1.25rem}.field[class*=round]{border-radius:1.5rem}.field[class*=round].large{border-radius:1.75rem}.field[class*=round].extra{border-radius:2rem}.field>:is(i,img,svg,progress.circle,a){position:absolute;inset:calc(var(--_input, 0)/2 - .75rem) auto auto auto;cursor:pointer;z-index:10;inline-size:1.5rem;block-size:1.5rem;margin:auto 0;pointer-events:none}.field>:is(a,.front){pointer-events:all!important}.field>a>:is(i,img,svg,progress.circle,a){inline-size:1.5rem;block-size:1.5rem}.field:dir(rtl)>:is(i,img,svg,progress.circle,a):first-child,.field>:is(i,img,svg,progress.circle,a){inset:calc(var(--_middle, 0) - .75rem) 1rem auto auto}.field:dir(rtl)>:is(i,img,svg,progress.circle,a),.field>:is(i,img,svg,progress.circle,a):first-child{inset:calc(var(--_middle, 0) - .75rem) auto auto 1rem}.field.invalid>i{color:var(--error)}.field>progress.circle{border-width:.1875rem}.field>:is(input,textarea,select){all:unset;position:relative;display:flex;align-items:center;box-sizing:border-box;border-radius:inherit;border:.0625rem solid transparent;padding:0 .9375rem;font-family:inherit;font-size:1rem;min-block-size:var(--_input);outline:none;z-index:1;background:none;resize:none;text-align:start;cursor:text}input::-webkit-date-and-time-value{text-align:start}:is(input,select,textarea):is(:-webkit-autofill,:autofill){-webkit-background-clip:text;-webkit-text-fill-color:var(--on-surface)}.field>:is(input,textarea,select):focus{border:.125rem solid transparent;padding-inline:.875rem}.field>textarea:not([rows]){field-sizing:content;max-block-size:12rem}:not(.field)>input:is([type^=date],[type^=time],[type=month],[type=week]),input::-webkit-calendar-picker-indicator,input[type=color],input[type=file]{opacity:0;position:absolute;inset:0;inline-size:100%;block-size:100%;margin:0;padding:0;border:0;outline:0;z-index:2!important}@media (pointer:fine){.field>input::-webkit-calendar-picker-indicator{z-index:-1!important}}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button,input::-webkit-search-cancel-button,input::-webkit-search-decoration,input::-webkit-search-results-button,input::-webkit-search-results-decoration{display:none}input[type=number]{appearance:textfield}.field.border>:is(input,textarea,select){border-color:var(--outline)}.field.border>:is(input,textarea,select):focus{border-color:var(--primary)}.field[class*=round]>:is(input,textarea,select){padding-inline:1.4376rem}.field[class*=round]>:is(input,textarea,select):focus{padding-inline:1.375rem}.field.prefix>:is(input,textarea,select){padding-inline-start:2.9375rem}.field.prefix>.slider{margin-inline-start:3.5rem}.field.prefix>:is(input,textarea,select):focus{padding-inline-start:2.875rem}.field.suffix>:is(input,textarea,select){padding-inline-end:2.9375rem}.field.suffix>.slider{margin-inline-end:3.5rem}.field.suffix>:is(input,textarea,select):focus{padding-inline-end:2.875rem}.field:not(.border,[class*=round])>:is(input,textarea,select){border-block-end-color:var(--outline)}.field:not(.border,[class*=round])>:is(input,textarea,select):focus{border-block-end-color:var(--primary)}.field[class*=round]:not(.border)>:is(input,textarea,select):focus,.field[class*=round]:not(.border,.fill)>:is(input,textarea,select){box-shadow:var(--elevate1)}.field[class*=round]:not(.border,.fill)>:is(input,textarea,select):focus{box-shadow:var(--elevate2)}.field.invalid:not(.border,[class*=round])>:is(input,textarea,select),.field.invalid:not(.border,[class*=round])>:is(input,textarea,select):focus{border-block-end-color:var(--error)}.field.invalid.border>:is(input,textarea,select),.field.invalid.border>:is(input,textarea,select):focus{border-color:var(--error)}.field:has(>:disabled){opacity:.5;cursor:not-allowed}.field>:disabled{cursor:not-allowed}.field>select{user-select:none}@-moz-document url-prefix(){.field>select:focus{background-color:var(--surface)}.field.fill>select:focus{background-color:var(--surface-variant)}.field>select:focus+label{z-index:1}}.field>select>option{background-color:var(--surface)}.field>:is(input,select){padding-block-start:1rem}.field.border:not(.fill)>:is(input,select),.field:not(.label)>:is(input,select){padding-block-start:0}.field>textarea{padding-block-start:var(--_start)!important}.field>textarea:focus{padding-block-start:calc(var(--_start, 0) - .01rem)!important}.field.border:not(.fill)>textarea,.field:not(.label)>textarea{padding-block-start:calc(var(--_start, 0) - .5rem)!important}.field.border:not(.fill)>textarea:focus,.field:not(.label)>textarea:focus{padding-block-start:calc(var(--_start, 0) - .51rem)!important}.field.label>label{--_start:1rem;position:absolute;inset:-.5rem .9375rem 0 var(--_start);display:flex;block-size:calc(var(--_input, 0) + 1rem);line-height:calc(var(--_input, 0) + 1rem);font-size:1rem;transition:all .2s;gap:.25rem;white-space:nowrap;pointer-events:none}.field.label:dir(rtl)>label{inset:-.5rem calc(var(--_start) - .0625rem) 0 .9375rem}.field.label[class*=round]>label{inset:-.5rem 1.9375rem 0 var(--_start)}.field.label[class*=round]:dir(rtl)>label{inset:-.5rem var(--_start) 0 1.9375rem}.field.label.border.prefix:not(.fill)>:is(label.active,:focus+label,[placeholder]:not(:placeholder-shown)+label,select+label){--_start:1rem}.field.label.border.prefix[class*=round]:not(.fill)>:is(label.active,:focus+label,[placeholder]:not(:placeholder-shown)+label,select+label),.field.label[class*=round]>label{--_start:1.5rem}.field.label.prefix>label{--_start:3rem}.field.label>:is(label.active,:focus+label,[placeholder]:not(:placeholder-shown)+label,select+label){block-size:2.5rem;line-height:2.5rem;font-size:.75rem}.field.label.border:not(.fill)>:is(label.active,:focus+label,[placeholder]:not(:placeholder-shown)+label,select+label){block-size:1rem;line-height:1rem}.field.label.border:not(.fill)>label:after{content:"";display:block;margin:.5rem 0 0;border-block-start:.0625rem solid var(--outline);block-size:1rem;transition:none;flex:auto}.field.label.border:not(.fill)>:focus+label:after{border-block-start:.125rem solid var(--primary)}.field.label.border:not(.fill)>:is(input,textarea):is(:focus,[placeholder]:not(:placeholder-shown),.active),.field.label.border:not(.fill)>select{clip-path:polygon(-2% -2%,.75rem -2%,.75rem .5rem,calc(100% - 1rem) .5rem,calc(100% - 1rem) -2%,102% -2%,102% 102%,-2% 102%)}.field.label.border:not(.fill):dir(rtl)>:is(input,textarea):is(:focus,[placeholder]:not(:placeholder-shown),.active),.field.label.border:not(.fill):dir(rtl)>select{clip-path:polygon(-2% -2%,1rem -2%,1rem .5rem,calc(100% - .75rem) .5rem,calc(100% - .75rem) -2%,102% -2%,102% 102%,-2% 102%)}.field.label.border[class*=round]:not(.fill)>:is(input,textarea):is(:focus,[placeholder]:not(:placeholder-shown),.active),.field.label.border[class*=round]:not(.fill)>select{clip-path:polygon(-2% -2%,1.25rem -2%,1.25rem .5rem,calc(100% - 2rem) .5rem,calc(100% - 2rem) -2%,102% -2%,102% 102%,-2% 102%)}.field.label.border[class*=round]:not(.fill):dir(rtl)>:is(input,textarea):is(:focus,[placeholder]:not(:placeholder-shown),.active),.field.label.border[class*=round]:not(.fill):dir(rtl)>select{clip-path:polygon(-2% -2%,2rem -2%,2rem .5rem,calc(100% - 1.25rem) .5rem,calc(100% - 1.25rem) -2%,102% -2%,102% 102%,-2% 102%)}.field.label>:focus+label{color:var(--primary)}.field.label.invalid>label,.field.label.invalid>label:after{color:var(--error)!important;border-color:var(--error)!important}.field.label>label>a{block-size:inherit;line-height:inherit;inline-size:1rem}.field.label>label>a>:is(i,img,svg){block-size:1rem;line-height:1rem;inline-size:1rem;font-size:1rem}.field>output{display:inline-block;font-size:.75rem;background:none!important;padding:.25rem 1rem;line-height:1.25rem;align-self:start}.field>output.invalid{color:var(--error)!important}.field[class*=round]>output{padding:.25rem 1.5rem}.field.invalid>output:not(.invalid),.field:not(.invalid)>output.invalid{display:none}.field.invalid>output.invalid~menu,.field:not(.invalid)>output:not(.invalid)~menu{inset:auto auto 1.75rem 0}table td>.field{margin:0}fieldset{border-radius:.25rem;padding:1rem;border:.0625rem solid var(--outline-variant)}fieldset>legend{margin:0 -.25rem;padding:0 .25rem}fieldset>legend+*{margin-block-start:0!important}}