*,:before,:after{box-sizing:border-box}*{margin:0}@media (prefers-reduced-motion:no-preference){html{interpolate-size:allow-keywords}}body{-webkit-font-smoothing:antialiased;padding-inline:1rem;font-size:14px;line-height:1.5}img,picture,video,canvas,svg{max-width:100%;display:block}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}:root{--color-primary:#1a1a1a;--color-success:#4bbf73;--color-info:#1f9bcf;--color-warning:#f0ad4e;--color-danger:#d9534f;--color-accent:var(--color-info);--color-muted:light-dark(color-mix(in oklab, CanvasText 50%, Canvas),color-mix(in oklab, CanvasText 70%, Canvas));--color-muted-2:light-dark(color-mix(in oklab, CanvasText 10%, Canvas),color-mix(in oklab, CanvasText 15%, Canvas));--color-hover:light-dark(color-mix(in oklab, CanvasText 3%, Canvas),color-mix(in oklab, CanvasText 10%, Canvas));--color-input-border:light-dark(color-mix(in oklab, CanvasText 20%, Canvas),color-mix(in oklab, CanvasText 50%, Canvas));--padding-main-inline:1rem;--padding-main-block:.5rem}@view-transition{navigation:auto}html{color-scheme:light dark;text-size-adjust:100%;font-family:system-ui,sans-serif;font-weight:400;@media (prefers-reduced-motion:no-preference){scroll-behavior:smooth}}body{padding-inline:var(--padding-main-inline);accent-color:var(--color-accent);font-size:14px;&:has(:popover-open){overflow:hidden}}main{flex-direction:column;gap:2lh;max-inline-size:100ch;margin:auto auto 1lh;display:flex;container:main/inline-size}h1,h2,h3,h4,h5,h6{text-align:center;text-transform:uppercase;letter-spacing:2px;padding-bottom:.5rem;font-weight:400}h1{font-size:1.5rem}a{text-decoration:none;&:link,&:visited{color:unset}&:hover{text-decoration:underline}&.block{text-transform:uppercase;justify-content:center;padding-top:1lh;display:flex}}form{max-inline-size:40ch;flex-direction:column;gap:1lh;width:100%;margin:auto;display:flex;& fieldset{display:inherit;flex-direction:inherit;border:none;gap:.5lh;padding:0}& label,& legend{text-box-trim:trim-both;text-box-edge:cap alphabetic;font-size:1rem}& footer{padding-top:.5rem;font-size:.75rem}&.form-inline{flex-direction:row;place-content:center flex-end;gap:2em;max-width:100%;display:flex;& div{display:flex;& label{align-self:center}}}& div.form-row-actions{align-items:center;gap:.5rem;display:flex}}button{color:canvastext;cursor:pointer;background-color:color-mix(in srgb, Canvas 90%, CanvasText);border:0;border-radius:6px;padding:1cap 2cap;&:has(svg){justify-content:center;align-items:center;gap:1cap;display:flex}& svg.button-icon{--size:1.65cap;flex:0 0 var(--size);width:var(--size);height:var(--size)}&:hover{background-color:color-mix(in srgb, Canvas 85%, CanvasText)}&.blended{background-color:canvas;&:hover{background-color:color-mix(in srgb, Canvas 95%, CanvasText)}}&.button-danger:hover{color:#fff;background-color:var(--color-danger)}}input:not([type=checkbox]),select,textarea{color:canvastext;border:1px var(--color-input-border) solid;border-radius:5px;padding:.5em 1em}input[type=checkbox]:has(+label){margin-right:.5ch;padding:0}select{appearance:none;background-color:canvas}@supports (appearance:base-select){select{appearance:base-select}}textarea{resize:block}input[type=date]{width:fit-content;display:block}form:not([novalidate]){:is(& input:user-valid,& select:user-valid,& textarea:user-valid){border-color:var(--color-success)}:is(& input:user-invalid,& select:user-invalid,& textarea:user-invalid){border-color:var(--color-danger)}}.invalid-feedback{display:none}form.was-validated .form-group:has(:user-invalid){& .invalid-feedback{color:var(--color-danger);display:block}}.form-group{gap:.5cap;display:grid}.form-group-inline{grid-template-columns:repeat(2,1fr);align-items:end;gap:1ch;display:grid}html{height:100dvh}main{place-items:center;min-height:100svh;display:grid;& p{text-align:center}&.error-message{& h1{padding:0;border-right:1px solid canvastext;padding-inline-end:1rem}& h2{vertical-align:middle;padding:0;padding-inline-start:1rem;display:inline-block}}}
