body{margin:0;background-color:var(--bg-color);font-family:Nunito Sans,sans-serif;font-optical-sizing:auto;font-style:normal;min-height:100vh}.themed{transition-property:background-color,color,border,text-decoration;transition-duration:.4s;transition-timing-function:ease-out}.disable-transitions,.disable-transitions *{transition:none!important}.content{display:flex;flex-flow:row wrap;width:100%}.content-col,.content-row{background-color:var(--bg-color-up1);color:var(--text-color);padding:.5em 1em;margin:1em;box-shadow:0 0 1em -4px var(--shadow-color);border-radius:8px}.content-col{flex:1 0 auto}.content-row{flex:0 0 calc(100% - 4em)}.inputBox{margin-bottom:1.5em;max-width:calc(100vw - 4em);display:flex;flex-flow:column wrap;align-items:stretch}.inputBox .invalidHint{display:none;line-height:0}.inputBox .invalidHint p{margin:0;transform:translateY(1em)}.inputBox:has([invalid]){color:var(--error-text-color)}.inputBox:has([invalid]) input{color:var(--error-text-color);border-color:var(--error-text-color)}.inputBox:has([invalid]) .invalidHint{display:inline-block}.inputBox span,.inputBox input,.inputBox textarea{display:block}.inputBox span{margin:.75em 0 .25em 2px;font-size:1.5em}.inputBox span.hint{font-size:1em;display:inline;text-decoration:underline dotted var(--text-color) 2px}.inputBox span span{display:inline;font-size:1em}.inputBox input{font-size:1em;background-color:var(--bg-color-up2);color:var(--text-color);outline:none;border:1px solid #888;padding:.5em;border-radius:6px;flex:0 1 auto}.inputBox div.resizer{font-size:1em;width:auto;display:inline-block;visibility:hidden;position:fixed;padding:.5em}.inputBox button{width:min-content;font-size:1.25em;padding:.5em .75em;border-radius:6px;border:1px outset var(--bg-color-up2);background-color:var(--bg-color-up2);color:var(--text-color);cursor:pointer}.inputBox button:hover{transition-duration:.05s}.inputBox button:active{border:1px inset var(--bg-color-up1);background-color:var(--bg-color-up1)}.inputBox button:active span{transform:translate(1px,1px)}.inputBox button span{margin:0}.content-col.createServer{max-width:1000px}.content-col.createServer .inputBox:has(#cardHolder){display:block;margin-top:2em}.passwordInput{display:flex}.passwordInput input{flex:1 1 auto}.passwordInput .passwordShowBtn{width:0;height:0;flex:0 0 auto;align-self:end;display:none}.passwordInput .passwordShowBtn .innerBtn{width:min-content;transform:translate(calc(-100% - .5em),-200%);cursor:pointer}#cardHolder{display:flex;flex-flow:row wrap;gap:1rem;align-items:stretch;justify-content:flex-start}#cardHolder .card{width:6.7em;height:9.4em;display:flex;flex-flow:column nowrap;align-items:center;border-radius:.6rem;background-color:var(--bg-color-up2);border:1px solid #888;cursor:pointer;-webkit-user-select:none;user-select:none}#cardHolder .card .textHolder{max-width:100%;height:100%;overflow:hidden;display:flex;flex-flow:row nowrap;align-items:center}#cardHolder .card .textHolder h1{font-size:3em;display:inline-block;-webkit-user-select:none;user-select:none;margin:0}#cardHolder .card .buttonHolder{width:0;height:0;align-self:flex-end;opacity:0;visibility:hidden;transition:visibility 0s linear .5s,opacity .5s ease-out}#cardHolder .card:hover .buttonHolder{visibility:visible;opacity:1;transition:visibility 0s,opacity .5s ease-out}#cardHolder .card .removeBtn{flex:1 1 auto;position:relative;top:-1em;left:-1em;width:2em;height:2em;border-radius:8px;background-color:var(--error-color);color:#fff;-webkit-user-select:none;user-select:none}#cardHolder .card .removeBtn span{display:inline-block;margin:50%;transform:translate(-50%,-50%)}#cardHolder .card.addCard{border:4px dashed var(--header-bg-color);margin:-2px;color:var(--header-bg-color);background:none}#cardHolder .card[highlight=pending]{box-shadow:0 0 1em -4px #daaa0b}#cardHolder .card[highlight=ok]{box-shadow:0 0 1em -4px #59d719}.overlay{position:absolute;inset:0;background-color:#00000080;color:var(--text-color);cursor:pointer;display:flex;flex-flow:row nowrap;align-items:center;justify-content:center}.overlay .modify-card{background-color:var(--bg-color-up1);filter:drop-shadow(0 0 1em var(--shadow-color));border-radius:1rem;padding:1em 2em;cursor:auto;font-size:1.5em}.overlay .modify-card div{padding:.5em}.overlay .modify-card div:last-child{float:right}.overlay .modify-card input,.overlay .modify-card button{font-size:1em;background-color:var(--bg-color-up2);color:var(--text-color);border:1px solid var(--bg-color-up2);padding:.5em .75em;border-radius:.6rem;outline:none;transition:filter .5s ease-out,border-color .5s ease-out}.overlay .modify-card input:hover,.overlay .modify-card button:hover{filter:drop-shadow(0 0 8px var(--shadow-color))}.overlay .modify-card input:active,.overlay .modify-card input:focus,.overlay .modify-card button:active,.overlay .modify-card button:focus{filter:drop-shadow(0 0 6px var(--shadow-color));border-color:var(--header-bg-color)}.overlay .modify-card button{cursor:pointer}div#viewServer{color:var(--text-color);width:100%;padding:1em}div#viewServer .issueInput{display:flex;flex-flow:row nowrap;align-items:end;gap:4px}div#viewServer .issueInput .inputBox button{padding:.2em .5em;transform:translateY(2px)}div#viewServer span.userTag{overflow-x:hidden;text-overflow:ellipsis;text-wrap:nowrap;max-width:calc(100% - 12px)}.header{padding:.25em 1.25em;background-color:var(--header-bg-color);position:sticky;display:flex;justify-content:space-between;align-items:center}.header h2{color:var(--header-text-color)}.header #themeBtn{cursor:pointer;-webkit-user-select:none;user-select:none}.header #themeBtn .material-symbols-outlined{font-size:2em;color:var(--header-text-color)}div#viewClient{color:var(--text-color);width:100%;padding:1em}
