:root{--clr-bg:#1a1a1a;--clr-fg:#fff;--clr-primary:#55afaf;--font-size:16px}body{margin:0;padding:0;position:relative;color:var(--clr-fg);background-color:var(--clr-bg);font-size:var(--font-size);font-family:monospace}.page{display:block;max-width:640px;margin:0 auto;padding:32px}.page .pageContent{display:flex;flex-direction:column;grid-gap:32px;gap:32px}.btn{border:none;border-radius:0;padding:8px 16px;background-color:var(--clr-primary);color:var(--clr-fg);font-size:var(--font-size);font-family:monospace;text-transform:uppercase;letter-spacing:4px;cursor:pointer;-webkit-transition:text-shadow .2s,opacity .2s,-webkit-box-shadow .2s,-webkit-transform .2s;transition:text-shadow .2s,opacity .2s,-webkit-box-shadow .2s,-webkit-transform .2s;transition:text-shadow .2s,box-shadow .2s,transform .2s,opacity .2s;transition:text-shadow .2s,box-shadow .2s,transform .2s,opacity .2s,-webkit-box-shadow .2s,-webkit-transform .2s}.btn.btn--alternate{background-color:transparent;border:1px solid var(--clr-primary)}.btn:hover{-webkit-box-shadow:4px 3px 4px 0;box-shadow:4px 3px 4px 0;-webkit-transform:scale(1.05);transform:scale(1.05)}.btn:active,.btn:focus,.btn:hover{text-shadow:0 0 4px #000,4px 3px 2px #000}.btn:active,.btn:focus{outline:none}.btnGroup{display:flex;justify-content:flex-start;align-items:center;grid-gap:8px;gap:8px}.btnGroup.btnGroup--horz{flex-direction:row}.btnGroup.btnGroup--vert{flex-direction:column}.input{font-family:monospace;font-size:14px;opacity:.8;-webkit-transition:opacity .2s;transition:opacity .2s}.input:active,.input:focus,.input:hover{opacity:1}.input:active,.input:focus{outline:none}