@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{transform:scale(1);opacity:.7;filter:drop-shadow(0 0 4px #aaf)}50%{transform:scale(1.2);opacity:1;filter:drop-shadow(0 0 12px #ccf)}}@keyframes wait{0%,80%{transform:rotate(0)}to{transform:rotate(360deg)}}form{&:focus{outline:none}h2:focus,h3:focus{outline:none}fieldset{display:flex;flex-direction:column;align-items:center;gap:.5lh;padding:0 1.5lh;text-align:center;width:100%;background-color:#fefefe;border:2px groove #efefef;legend{background-color:#fefefe;border:2px groove #efefef;padding:.3lh;display:flex;gap:.5lh;svg.icon{height:1lh;aspect-ratio:1}}>div{display:flex;align-items:center;gap:.5lh;justify-content:space-between;margin:.5lh;&.wide{width:100%}&.column{flex-direction:column}div{display:flex;flex-direction:column}}}input,select,button,meter,progress{font:inherit;padding:.3lh}input,select,button{border:1px solid #777;box-shadow:2px 2px #aaa}input:autofill{font:inherit}[type=checkbox]{aspect-ratio:1 / 1;width:1lh}[type=color]{width:5rem;height:3rem;padding:0}button{user-select:none;background-color:#fff;display:flex;gap:.1lh;transition:transform .1s linear;&:focus-visible{outline:none}&:active{box-shadow:0 0 #aaa;transform:translate(2px,2px)}&[disabled]{svg.icon{fill:#aaa}}svg.icon{height:1lh;aspect-ratio:1}i{display:inline-block;font-style:normal;img{height:1em;max-width:100%;vertical-align:middle}}span{display:inline-block}&.big{width:15dvw;aspect-ratio:1 / 1;flex-direction:column;align-items:center;justify-content:center;gap:.5lh}&.reverse{flex-direction:row-reverse}}input:focus{background-color:#eee3;outline:none}hr{width:100%}.validate:valid{outline:.8lh solid #0f01}.validate:invalid{outline:.8lh solid #f001}.loading{&:not(.big)>svg{display:none}&:not(.big)>i{display:none}>span{visibility:hidden;position:relative;&:before{content:"↻";position:absolute;visibility:visible;width:100%;font-size:1.3rem;text-align:center;padding:.2lh;user-select:none;pointer-events:none;font-size-adjust:.5;text-box-edge:cap alphabetic;text-box-trim:trim-both;animation:spin 1s linear infinite}}}.waiting{animation:wait 4s linear infinite}.accept{background-color:color-mix(in srgb,#0f0 30%,transparent)}.reject{background-color:color-mix(in srgb,#f00 30%,transparent)}.review{background-color:color-mix(in srgb,#ff0 30%,transparent)}.accept.noundo{background-color:color-mix(in srgb,#f00 30%,transparent)}.reject.noundo{background-color:color-mix(in srgb,#0f0 30%,transparent)}.choice{display:flex;align-items:center;gap:1lh;justify-content:center}.badge{user-select:none;align-self:center;pointer-events:none;.icon{height:3lh}}.spin{animation:spin 1s linear infinite}.action{display:flex;flex-direction:column;align-items:center;gap:.3lh}}:modal{font:normal 1rem/1.5;overscroll-behavior:contain;container:modal / size;&:focus{outline:none}&[open]{width:100%;max-width:800px;height:100dvh;margin:auto;overflow:auto;padding:0;border:none;box-shadow:5px 5px #999;outline:1px solid #777;&::backdrop{backdrop-filter:none;background-color:#afe4}+&::backdrop{backdrop-filter:none;background-color:transparent}>:first-child:not(link,nav){overflow:auto;flex-grow:1;display:flex;flex-direction:column;align-items:center;gap:1lh;padding:1lh;min-height:100%}>form{display:flex;flex-direction:column;gap:1lh;padding:2lh}>.center.horizontal{align-items:center}>.center.vertical{justify-content:center;min-height:100%}>.left{display:flex;flex-direction:column;gap:1lh;align-items:stretch;padding:2lh 6lh;p{padding:0;a{cursor:pointer}}p:has(button){text-align:center}}>.spinner{justify-content:center}>.reconnect{justify-content:center}>.error{height:100vh;justify-content:center;padding-inline:3lh;.message{border:.3rem insert #aaa;background-color:#eee}}>.hide{display:none}}}*{margin:0;padding:0;box-sizing:border-box}:modal[open]{>.figure{cursor:pointer;justify-content:center;figure{figcaption{text-align:center;word-break:break-word;a{color:inherit}}}}>.user{padding:2lh;figure{.avatar-preview{font-size:5rem}[name=user-name]{text-align:center}}.avatar-selector{display:flex;flex-direction:row;flex-wrap:wrap;gap:.3rem;justify-content:center;i{font-style:normal;cursor:pointer;transition:transform .2s linear;border-radius:.3rem;&:hover{transform:scale(1.3);outline:.3rem solid #0f07}&.selected{outline:.3rem solid #0007;&:hover{transform:scale(1)}}}}}}