.navbar{position:fixed;top:0;width:100%;display:flex;justify-content:space-between;line-height:2;height:3rem;background:#fff}.navbar__left,.navbar__right{flex:1}.navbar__buttons{display:flex;height:100%}.navbar__title{display:block;height:100%;padding:0 .5rem;font-size:1.5rem}.navbar__right .navbar__buttons{justify-content:flex-end}.navbar__button{display:block;line-height:3;padding:0 1rem;flex:0 0 auto;cursor:pointer}.navbar__button,.navbar__button select{height:100%;border:none;background:none}.navbar__button select,.weapon{width:100%}.weapon{text-align:center;border-collapse:collapse;margin-bottom:1rem}.weapon td{border:1px solid #000}.armor{width:100%;text-align:center;border-collapse:collapse;margin-bottom:1rem}.armor td{border:1px solid #000}.sheet-layout{display:flex;flex-wrap:nowrap;flex-direction:row;overflow-x:auto}@media(max-width:750px){.sheet-layout{flex-direction:column}}.sheet-layout>*{padding:0 1rem;flex:1;min-width:30em;box-sizing:border-box}@media(max-width:750px){.sheet-layout>* .sheet-layout>*{padding-bottom:1rem 0;width:100%;min-width:auto;box-sizing:border-box}}body{margin:0}body,button,html,input,select{font-family:monospace}main{padding-top:3rem}table{border-spacing:1rem .5rem;border-collapse:separate}input{text-align:center;border:1px solid #eee}input[readonly]{background-color:#eee}.capitalize{text-transform:capitalize}.uppercase{text-transform:uppercase}.bold{font-weight:700}.full-width{width:100%}textarea.notes{box-sizing:border-box;padding:1rem;width:100%;border:1px solid #eee;line-height:2rem;resize:vertical}@media(max-width:750px){.hide-mobile{display:none}}.form{display:flex;flex-direction:column}.form__row{display:flex;justify-content:space-between}@media(max-width:750px){.form__row--xs-col{flex-direction:column}}.form__field{flex:1;padding:0 .5rem 1rem}.form__heading{width:100%;margin:.5rem;border-bottom:1px solid #000}.form__label{position:relative;display:block;padding-bottom:.5rem;font-weight:700}.form__label--required:after{position:absolute;content:"*";top:-.2rem;color:red}.form__input{display:block;width:100%;box-sizing:border-box}.modal{display:flex;flex-direction:column;height:100%;width:40rem;height:auto;margin:0 auto}@media(max-width:750px){.modal{height:inherit;width:inherit;margin:inherit}}.modal .modal__header{flex:0}.modal .modal__body{flex:1;padding:0 1rem 1rem}.modal .modal__footer{flex:0;display:flex}.modal .modal__footer>button{display:block;flex:1;padding:.5rem;border-radius:0}.modal .modal__footer>button:not(:last-child){border-right:0}