.text-center{text-align:center}body,html{font-size:.9rem}h1{font-size:3rem;margin:1.5rem 0}h2{font-size:2.5rem;margin:1.25rem 0}h3{font-size:2rem;margin:1rem 0}h4{font-size:1.5rem;margin:.75rem 0}h5{font-size:1.25rem;margin:.5rem 0}html,body{margin:0;padding:0;font-family:Arial,sans-serif;background-color:#eee}svg:focus{outline:none}.fa-spinner.spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:scale(1) rotate(0)}to{transform:scale(1) rotate(360deg)}}.card.user-bar{align-items:center;display:flex;gap:.5rem;justify-content:space-between}.card.user-bar .welcome{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.button{display:inline-flex;align-items:center;justify-content:center;padding:.5rem .75rem;font-size:.9rem;font-weight:400;text-decoration:none;cursor:pointer;border:none;transition:background-color .3s ease,transform .2s ease;border-radius:2rem}.button:active{transform:translateY(0)}.button--primary{background-color:#63a39e;color:#fff;box-shadow:0 4px 8px #63a39e33}.button--primary:hover{background-color:#589590}.button--secondary{background-color:#e57373;color:#fff;box-shadow:0 4px 8px #e5737333}.button--secondary:hover{background-color:#e15d5d}.button--neutral{background-color:#f5f1e8;color:#333;border:1px solid #D8D8D2}.button--neutral:hover{background-color:#f0ebdd}.button--rounded{border-radius:1000px}.button--small{padding:.25rem .5rem;font-size:.8rem}.button--large{padding:.75rem 1rem;font-size:1.4rem}.button:disabled{cursor:not-allowed;filter:grayscale(80%) brightness(95%);opacity:.7;transform:none;box-shadow:none}.button__group{display:flex}.button__group .button{transform:none}.button__group .button+.button:not(:last-child){border-radius:0}.button__group .button:first-child{border-top-right-radius:0;border-bottom-right-radius:0}.button__group .button:last-child{border-top-left-radius:0;border-bottom-left-radius:0}.card{display:block;padding:1rem;margin-bottom:1.5rem;font-size:1rem;font-weight:400;text-decoration:none;border:none;box-shadow:0 0 1.5rem #00000026;border-radius:16px}.card--primary{background-color:#356161;color:#dee2e1}.card--white{background-color:#fff;color:#303b3a}.card--neutral{background-color:#f7f3ed;color:#303b3a}.card--warning{background-color:#f4ebd6;color:#303b3a}.app{height:100vh;background-color:#eee;color:#2f3942}.app .metrics small{font-size:.9rem}.app .page{padding:1.5rem;height:calc(100vh - 3rem);display:flex;flex-direction:column;width:100%;max-width:600px;margin:0 auto}@media (max-width: 768px){.app .page{max-width:100%;width:auto}}.app .cols-2{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:1.5rem}.app .cols-2>*{flex:.5}.app .chart-card{flex:1;display:flex;flex-direction:column}.app .action-card{justify-content:center;display:flex;align-items:center;gap:1rem;margin-bottom:0}.app .action-card .center-buttons{margin:-1rem 0;flex:0 auto}.app .action-card .left-buttons{flex:1;text-align:right;display:flex;gap:.5rem;justify-content:flex-end;align-items:center}.app .action-card .right-buttons{flex:1}.app .action-card button{width:auto;aspect-ratio:1}.app .action-card button.increment{height:calc(100% + 2rem)}.modal-header{display:flex;justify-content:space-between;align-items:flex-start;width:100%;margin-bottom:0}.modal-close-button{background:none;border:none;font-size:1.5rem;color:#666;cursor:pointer;padding:0;transition:color .2s ease}.modal-close-button:hover{color:#000}.modal-quantity-input{display:flex;flex-direction:column;align-items:center;gap:15px}.modal-quantity-input .modal-quantity-value{font-size:4rem;font-weight:800;color:#333;line-height:1;margin:1.5rem 0}.modal-quantity-input .quantity-controls{display:flex;align-items:center;gap:10px;justify-content:center;background-color:#f5f3e9;border:1px solid #D8D8D2;margin-bottom:2rem;padding:.5rem;border-radius:1000px}.modal-quantity-input .quantity-controls .button{aspect-ratio:1/1;width:auto}.modal-quantity-input .quantity-input-field{background-color:transparent;border:none;padding:0;margin:0;font-size:1.2rem;text-align:center;color:#333;width:100%;-moz-appearance:textfield}.modal-quantity-input .quantity-input-field::-webkit-outer-spin-button,.modal-quantity-input .quantity-input-field::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.modal-quantity-input .quantity-input-field:focus{outline:none}.modal-actions{display:flex;justify-content:space-between;width:100%;gap:1.5rem}.modal-actions .button{flex-grow:1}.modal{--top: 50%}.modal__box{position:fixed;top:var(--top);left:50%;transform:translate(-50%,calc(-1 * var(--top)));background-color:#f5f2e9d9;width:80%;padding:20px;border-radius:5px;box-shadow:0 10px 25px #0000001a}.modal__overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000059;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.modal.fade-in .modal__box{opacity:0;transform:scale(.9),translate(-50%,-50%);animation:modalFadeIn .3s forwards}.modal.fade-in .modal__overlay{opacity:0;animation:bgFadeIn .3s forwards}.modal.fade-out .modal__box{opacity:1;transform:scale(1),translate(-50%,-50%);animation:modalFadeOut .3s forwards}.modal.fade-out .modal__overlay{opacity:.5;animation:bgFadeOut .3s forwards}@keyframes modalFadeIn{to{opacity:1;transform:scale(1),translate(-50%,-50%)}}@keyframes modalFadeOut{to{opacity:0;transform:scale(.9),translate(-50%,-50%)}}@keyframes bgFadeIn{to{opacity:.5}}@keyframes bgFadeOut{to{opacity:0}}.chart-container{flex:1}
