@import"https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap";.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.flex{display:flex}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.read-the-docs{color:#888}.main{display:flex;flex-direction:column;min-height:100vh;width:100vw;overflow:hidden}.main nav{box-sizing:border-box;overflow:hidden;padding:10px 20px;height:12vh;display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid #eee}.button{height:45px;display:flex;justify-content:center}.skeleton-wrapper>span{flex:1;display:flex;flex-direction:column}.main nav h1.brand{font-size:3rem;margin:0;-webkit-background-clip:text;background-clip:text;color:transparent}nav .back-wrapper{width:1rem;font-size:xx-large;line-height:1px}.main nav .nav-container{display:flex;gap:.5rem;flex-direction:column}.main nav .nav-container a{padding:10px;border-radius:1rem}.container{padding:1.5rem;height:88vh;overflow:scroll;width:100%}.top-stats{display:flex;justify-content:space-between}.container h3{margin:0;margin-bottom:1rem}.add-payment-container{flex:1;min-width:200px;overflow:scroll;padding:10px 20px;padding-bottom:1rem}.paid-by-container{display:flex;gap:1rem;flex-wrap:wrap}.paid-by-item{display:flex;flex-direction:column;background-color:#fff;width:110px;border-radius:10px;box-sizing:border-box;overflow:hidden}.paid-by-item.active{outline:2px dashed #747bff}.paid-by-item img{width:100%;height:100%}.paid-by-item span{padding:0 10px;flex:1}.payment-item{background-color:#fff;box-shadow:0 0 3px #ccc;padding:10px 8px;border-radius:1rem;display:flex;gap:1rem}.payment-item .right{display:flex;flex-direction:column;align-items:flex-end}.payment-item .amount{font-weight:900;flex:1}.payment-item .date{color:gray}.payment-item .credit{color:#3ba471f7}.payment-item .debit{color:tomato}.payment-item .debit:before{content:"- "}.payment-item .credit:before{content:"+ "}.payment-item .left{width:50px;background-color:#f1f1f1;border-radius:10px;display:flex;justify-content:center;align-items:center}.payment-item .mid{display:flex;flex-direction:column;gap:.5rem;flex:1}.payment-item .chip{width:20px;height:20px;border-radius:50%;display:grid;place-content:center;background-color:#8489f8;text-transform:capitalize;color:#fff;padding:5px}.sidebar{-webkit-backdrop-filter:blur(3rem);backdrop-filter:blur(3rem);padding:10px 1rem;position:fixed;overflow:hidden;top:0;width:100%;height:100%;box-sizing:border-box;right:0;z-index:1;display:flex;flex-direction:column}.sidebar .logout{margin-top:auto;display:flex;align-items:center;justify-content:center;gap:.5rem}.sidebar .icon,.icon{font-size:xx-large}.sidebar .header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.payment-list{display:flex;flex-direction:column;gap:1.5rem;padding-bottom:1rem}.nav-container a.active{background-color:#8ba7c05c;color:#000}@media screen and (min-width: 1024){.card{height:100%;padding:2em;position:relative;border-radius:1rem;flex:1}.card.groups{height:4vh;transition:all .2s ease}.card.expanded{height:12vh}.add-group{opacity:0;transition:all .2s ease}.add-group.fade-in{opacity:1}.add-group.fade-out{opacity:0}.chip{background-color:#695447;border-radius:18px;padding:2px 8px}.payment-item{display:grid;gap:10px;grid-template-columns:200px 100px 100px 200px 1fr;align-items:center}.group-item{box-sizing:border-box;display:grid;place-content:center;word-break:break-all;overflow:hidden;cursor:pointer;border:1px dashed #888;transition:all .2s;padding:5px 10px}.group-item.active{background-color:#8f536ba3;border:1px solid #888;border-radius:10px}nav a{padding:10px 20px;border-radius:1rem;transition:all .2s}}.add-payment .header{display:flex;align-items:center}.add-payment .header h3:first-child{flex:1}.add-payment .header .badge{background-color:#444;padding:4px 10px}.add-payment .category-list{display:flex;align-items:center;width:100%;overflow-x:scroll;padding:10px 0}.add-payment .icon-wrapper{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:10px 16px}.add-payment .icon-wrapper .icon{padding:10px;margin-bottom:8px;border-radius:1rem;font-size:4rem}.add-payment .icon-wrapper.active{outline:1px solid #8b8b8b;outline-offset:-1px;border-radius:1rem;background-color:#8080802b}.settle-up .form-item{margin:1rem 0px;display:flex;flex-direction:column;gap:10px}.settle-up .amount{border:none;width:100%;font-size:4em;background:#403e3e4d;color:#b4b4b4;font-weight:900;font-family:inherit;outline:none;padding:0 0 0 10px}.money-info h2{margin-top:0}.udhaari-item{padding:10px 1rem;border-radius:15px}.udhaari-item strong{font-weight:300;width:100%;text-overflow:ellipsis;white-space:nowrap;text-align:center;padding-inline:2px}.udhaari-item .left{overflow:hidden;flex-direction:column;width:75px;height:100%}.udhaari-item .left div{aspect-ratio:1/1;width:100%;height:60px}.udhaari-item img{width:100%;height:100%}.udhaari-item .mid{justify-content:center}.udhaari-item .mid .amount{font-weight:500}.udhaari-item .mid .arrow-wrapper{display:flex;flex-direction:column;align-items:center;gap:10px}.arrow-main{display:flex;align-items:center}.arrow-main .arrow-tail{width:100px;height:1px;background-color:#fff;position:relative}.arrow-main .arrow-tail svg{position:absolute;right:-10px;top:-7.5px}.loader{height:10px;width:100%;background:"linear-gradient(90deg, #ff6b6b, #f8e71c, #6bffb0)";position:fixed}@keyframes react-loading-skeleton{to{transform:translate(100%)}}.react-loading-skeleton{--base-color: #ebebeb;--highlight-color: #f5f5f5;--animation-duration: 1.5s;--animation-direction: normal;--pseudo-element-display: block;background-color:var(--base-color);width:100%;border-radius:.25rem;display:inline-flex;line-height:1;position:relative;-webkit-user-select:none;user-select:none;overflow:hidden}.react-loading-skeleton:after{content:" ";display:var(--pseudo-element-display);position:absolute;top:0;left:0;right:0;height:100%;background-repeat:no-repeat;background-image:var( --custom-highlight-background, linear-gradient( 90deg, var(--base-color) 0%, var(--highlight-color) 50%, var(--base-color) 100% ) );transform:translate(-100%);animation-name:react-loading-skeleton;animation-direction:var(--animation-direction);animation-duration:var(--animation-duration);animation-timing-function:ease-in-out;animation-iteration-count:infinite}@media (prefers-reduced-motion){.react-loading-skeleton{--pseudo-element-display: none}}@media (prefers-color-scheme: dark){:root{color:#213547;background-color:#fff;background-color:#242424;color:#ffffffde}a:hover{color:#747bff}h1.brand{background-image:linear-gradient(45deg,wheat,#143bb0)}button{background-color:#fce}.payment-item{background-color:#505050ad;box-shadow:none}.payment-item .left{background-color:#f1f1f126}.payment-item .amount.debit{color:#f99393}.nav-container{color:wheat}.sidebar a{font-size:x-large;color:#fff;font-weight:900}.sidebar a.active{background-color:#2a445b5e;color:wheat}}.sidebar a{font-size:x-large;font-weight:900}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}h1.brand{background-image:linear-gradient(45deg,#9b1e72,#2e4886)}a:hover{color:#747bff}button{background-color:#fce;color:#fff}.add-payment .icon-wrapper .icon{color:#fff}.settle-up .amount{background:#ffffff4d;color:#000}.arrow-main .arrow-tail{background-color:#000}}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark light;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;min-width:320px;min-height:100vh;font-family:jost}h1{font-size:3.2em;margin:0}p{margin:0}input,select{padding:10px 20px}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s;outline:none}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}