:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5}*{margin:0;box-sizing:border-box}body{--bg-primary: #182737;--bg-secondary: #27405C;--bg-secondary-opacity: #27405CF7;--color-primary: #cccccc;--color-warning: #FFA500;background-color:var(--bg-primary);color:var(--color-primary)}body[data-theme=light]{--bg-primary: #C3D2E0;--bg-secondary: #A7BBCE;--bg-secondary-opacity: #A7BBCEF7;--color-primary: #182737;--color-warning: #7b0737}.app-container{display:flex;flex-direction:column;min-height:100dvh}.main-heading{font-size:1.75rem;text-align:center;letter-spacing:.1em}.sub-heading{font-size:1.25rem;font-weight:500;width:fit-content;letter-spacing:.15em}p,.label--visible{font-size:1rem}.p--large{font-size:1.125rem;font-weight:600}.p--italic{font-style:italic;letter-spacing:.1em}.p--warning{color:var(--color-warning);font-weight:500;margin:0 auto;letter-spacing:.05em}a{color:var(--color-primary);text-decoration:none;letter-spacing:.175em;width:fit-content}.link{background-color:var(--bg-secondary);padding:.5em 1em;border:2px solid var(--color-primary);border-radius:.5em}.nav-link--bare{font-size:1rem;padding:.25em 1em;border-radius:.3em}.nav-link--border{font-size:1rem;margin-bottom:-2px;padding:.5em 1em;border-bottom:2px solid var(--color-primary)}.a--icon:hover,.a--icon:focus,.a--icon:active{background-color:var(--bg-primary)}.link:hover,.link:focus,.link:active{background-color:var(--bg-primary);box-shadow:0 0 .5em var(--color-primary)}.nav-link--border:hover,.nav-link--border:focus,.nav-link--bare:hover,.nav-link--bare:focus{box-shadow:0 0 .5em var(--color-primary)}.nav-link--border:hover,.nav-link--border:focus,.nav-link--border--active{margin-bottom:unset;border-bottom:unset;border-radius:.3em;outline:2px solid var(--color-primary)}.nav-link--border--active{background-color:var(--bg-primary)}.nav-link--bare:hover,.nav-link--bare:focus,.nav-link--bare--active{outline:2px solid var(--color-primary)}.nav-link--bare--active{background-color:var(--bg-primary)}.icon{font-size:2rem;background-color:var(--bg-secondary);padding:.1em;border-radius:.1em;cursor:pointer;outline:1px solid var(--color-primary)}.icon--link{margin-bottom:-6px}.close-icon{margin-left:auto}.a--icon:hover .icon,.a--icon:focus .icon,.a--icon:active .icon,.icon:hover,.icon:focus,.icon:active{background-color:var(--bg-primary);outline:1px solid var(--color-primary);box-shadow:0 0 .25em var(--color-primary)}.input{font-family:inherit;font-size:1rem;background-color:var(--bg-secondary);color:var(--color-primary);width:0;min-width:4.5em;height:fit-content;padding:.25em;border:1px solid var(--color-primary);border-radius:.3em;cursor:pointer}.input::placeholder{color:var(--color-primary)}.input:hover,.input:focus,.input:active{background-color:var(--bg-primary);outline:1px solid var(--color-primary);box-shadow:0 0 .5em var(--color-primary)}input[type=checkbox]:hover,input[type=checkbox]:focus,input[type=checkbox]:active{outline:1px solid var(--color-primary);box-shadow:0 0 .5em var(--color-primary);cursor:pointer}.select-wrapper{display:flex;align-items:center;gap:1em}.select{font-family:inherit;font-size:1rem;background-color:var(--bg-secondary);color:var(--color-primary);width:fit-content;padding:.25em 2em .25em .5em;border:1px solid var(--color-primary);border-radius:.3em;cursor:pointer;box-sizing:border-box;appearance:none;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--color-primary) 50%),linear-gradient(135deg,var(--color-primary) 50%,transparent 50%),linear-gradient(to right,var(--bg-secondary),var(--bg-secondary));background-position:calc(100% - 1em) 50%,calc(100% - .625em) 50%,100% 0;background-size:.375em .375em,.375em .375em,2.5em 2.5em;background-repeat:no-repeat}.select--large{font-size:1.25rem;padding:.25em 3em .25em .75em;background-position:calc(100% - 1.125em) 50%,calc(100% - .7em) 50%,100% 0;background-size:.425em .425em,.425em .425em,2.5em 2.5em}.select:hover,.select:focus,.select:active{background-color:var(--bg-primary);--bg-secondary: var(--bg-primary);outline:1px solid var(--color-primary);box-shadow:0 0 .5em var(--color-primary)}.label{position:absolute;clip:rect(1px,1px,1px,1px);padding:0;border:0;height:1px;width:1px;overflow:hidden}.label--visible{cursor:pointer}header{display:flex;align-items:center;justify-content:space-between;padding:0 1.25em;background-color:var(--bg-secondary);box-shadow:0 0 7px var(--color-primary)}.header--small{display:flex;align-items:center;padding:.5em 0}.header--large{padding:.75em 0}.nav-bar--vertical{position:absolute;top:0;left:-300px;display:flex;flex-direction:column;gap:2.5em;width:300px;height:100vh;padding:2em;background-color:var(--bg-secondary-opacity);box-shadow:2px 2px 4px 1px var(--color-primary);-webkit-animation:slide .5s forwards;animation:slide .5s forwards}.nav-bar--horizontal{display:flex;gap:2em}@-webkit-keyframes slide{to{left:0}}@keyframes slide{to{left:0}}footer{display:flex;justify-content:center;align-items:center;padding:.75em 0;background-color:var(--bg-secondary);box-shadow:0 0 7px var(--color-primary);color:var(--color-primary);font-weight:300;letter-spacing:.1em}.main-container{display:flex;flex-direction:column;align-items:center;gap:1em;margin:2em auto auto;padding:0 1em;width:100%}.home-container{align-items:center;gap:4em;width:100%;margin:auto}.calculators-section{display:grid;gap:2em;width:100%;padding:1em 0 3em}.calculator-item-wrapper{display:flex;flex-direction:column;gap:2em;background-color:var(--bg-secondary);width:100%;max-width:600px;margin:0 auto;padding:1em;border:1px solid var(--color-primary);border-radius:.5em}.pct-item-wrapper{max-width:700px}.form{display:flex;flex-direction:column;gap:1em}.inner-wrapper{display:flex;align-items:center;gap:.5em}.flex-column{flex-direction:column;width:100%}.space-between{display:flex;justify-content:space-between;width:100%}.result-wrapper{background-color:var(--bg-primary);padding:.5em 1em;border-radius:.3em}@media (min-width: 480px){.main-container{padding:0 2em}.calculator-item-wrapper{padding:2em}}@media (min-width: 768px){.main-heading{font-size:2rem}.link{font-size:1.125rem}.input{min-width:6em}.main-container{padding:0 2em}.pct-form{flex-direction:row;gap:.5em}}@media (min-width: 1024px){.sub-heading{font-size:1.5rem}}