:root{--header: #162840;--backdrop: #16284099;--shadow: #1628404d;--background: #edf4fb;--outline: #b8ccde;--bttn-primary: #2a5f8f;--bttn-secondary: #5b9ec9;--header-text: #8aaec8;--muted-text: #5a7a94;--red-text: #b03a28;--text: #1a2e42}*{margin:0;box-sizing:border-box}body{color:var(--text);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:16px;background-color:var(--background)}.bttn{padding:9px 18px;border-radius:8px;background-color:transparent;border:none;transition:background .15s ease-in-out,color .15s ease-in-out}button:hover{cursor:pointer}.bttn-primary{background-color:var(--bttn-primary);color:#fff}.bttn-primary:hover{background-color:var(--bttn-secondary)}.bttn-secondary{border:1.5px solid var(--bttn-primary)}.bttn-secondary:hover{background-color:var(--bttn-primary);color:#fff}.bttn-x{font-size:2em;color:var(--muted-text);border:none;background-color:transparent}.bttn-x:hover{color:var(--red-text)}.bttn-nav{border:none;border-bottom:3px solid transparent;background-color:transparent;transition:border .15s ease-in-out,background .15s ease-in-out;height:60px;padding:0 18px;color:var(--header-text)}.bttn-nav:hover,.bttn-nav-active{background-color:#5b9fc926;color:#fff}.bttn-nav-active{border-color:var(--bttn-secondary)}label{color:var(--muted-text);font-size:1.1em;transition:color .15s ease-in-out}input{outline:none;border:1.5px solid var(--outline);padding:9px 12px;border-radius:8px;width:100%;margin-top:5px;transition:border .15s ease-in-out;font-size:1em}input:focus{border-color:var(--bttn-primary)}.modal-form-block:focus-within label{color:var(--text)}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}#modal-container{display:flex;align-items:center;justify-content:center;position:fixed;width:100dvw;height:100dvh;background-color:var(--backdrop);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:99}#modal-wrapper{border-radius:14px;background-color:#fff;border:1px solid var(--outline);width:100%;max-width:700px;overflow:hidden}#modal-header{padding:10px 18px;border-bottom:1px solid var(--outline);background-color:var(--background);display:flex;flex-direction:row;align-items:center;justify-content:space-between}#modal-form-content{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:20px}#modal-form-actions{display:flex;flex-direction:row;justify-content:space-evenly;align-items:center;background-color:var(--background);border-top:1px solid var(--outline);padding:8px 0}header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;background-color:var(--header);position:sticky;top:0;color:var(--header-text);box-shadow:0 2px 16px var(--shadow);height:60px;z-index:98}header h1{padding:0 20px}header>button{margin:0 20px}.header-pages{display:flex;flex-direction:row;align-items:center}@media(max-width:830px){.header-pages{font-size:.5em}.header-pages-actions{position:fixed;bottom:0;width:100dvw;background-color:var(--header);display:flex;align-items:center;justify-content:space-evenly}}main{display:flex;align-items:center;justify-content:center;width:100dvw}.page{margin-top:40px;width:100%;max-width:700px}.page-header{display:flex;flex-direction:row;align-items:center;justify-content:space-between;margin:10px 10px 30px}@media(max-width:830px){.page-header{font-size:.8em}}.page-content{background-color:#fff;border-radius:14px;border:1px solid var(--outline);box-shadow:0 2px 12px var(--shadow);overflow:hidden;display:flex;flex-direction:column;align-items:stretch;justify-content:center;margin:10px 10px 70px}.page-grid-header{padding:12px 0;background-color:var(--background);color:var(--muted-text)}.page-grid{padding:9px 18px}h2{padding:10px 0;border-bottom:2px solid var(--header)}.inventory-item{display:grid;grid-template-columns:2fr 1fr .5fr;border-bottom:1.5px solid var(--outline);align-items:center;padding:9px 18px;gap:20px}@media(max-width:830px){.inventory-item{grid-template-columns:1.5fr 1fr 1fr}}.inventory-item:has(+h2),.inventory-item:last-child,.inventory-item:first-child *{border:none}.inventory-item *{border-right:1.5px solid var(--outline)}.inventory-item-title{font-weight:700;font-size:1.1em}