:root{--blue:#0d1b2f;--l_blue:#1b2a41;--grey:#b2b2b2;--green:#1db980;--d_green:#137d56;--red:orangered}*{margin:0;padding:0;font-family:sans-serif}body{background-color:#1b262c}.all{display:flex}.right{background-color:var(--blue);border-radius:24px;width:80vw;margin:10px 10px 10px 0}.logo{margin:30px}.fin{color:#3086ff;font-size:2.6em;font-weight:700}.flow{color:#fff;font-size:2.6em}.left{background-color:var(--blue);border-radius:24px;width:20vw;height:97vh;margin:10px}.blue{background-color:#3086ff!important}.sec{height:66vh}.sec button:hover{cursor:pointer;background-color:var(--d_green);transition:all .1s linear}.dashboard{color:#fff;background-color:var(--green);border:none;border-radius:12px;width:240px;margin:0 20px;padding:12px;font-size:1.2em}.transactions,.insights{color:#fff;background-color:var(--green);border:none;border-radius:12px;width:240px;margin:20px 20px 0;padding:12px;font-size:1.2em}.line{border:.5px solid #767676;width:250px;margin:auto}.active{color:var(--grey);margin:24px}.role{gap:10px;display:flex}.role button:hover{cursor:pointer;background-color:#bababa}.admin{background-color:#ddd;border:1px solid #000;border-radius:8px;width:100px;margin:0 10px 0 30px;padding:5px;font-size:1.1em}.viewer{background-color:#ddd;border:1px solid #000;border-radius:8px;width:100px;padding:5px;font-size:1.1em}.grey{background-color:gray!important}.over{color:#fff}.over div:first-child{margin:16px 0 -28px 30px;font-size:2em}.over div:nth-child(2){color:var(--grey);margin:32px 32px 16px}.cards{color:#fff;display:flex}.bal,.inc,.exp{background-color:var(--l_blue);width:300px;color:var(--grey);border:1px solid #fff;border-radius:20px;margin:auto;padding:10px}.wallet,.up,.down{padding:4px 12px;font-size:30px}.bal div:nth-child(3){color:#fff;margin:10px;font-size:1.4em;font-weight:700}.inc div:nth-child(3){color:#1db980;margin:10px;font-size:1.4em;font-weight:700}.exp div:nth-child(3){color:var(--red);margin:10px;font-size:1.4em;font-weight:700}.data{justify-content:center;display:flex}.graph1{color:#fff;background-color:var(--l_blue);border-radius:20px;flex-direction:column;width:600px;height:200px;margin:28px 0 28px 28px;display:flex;overflow:hidden}.graph1 div{margin:10px}.graph2{color:#fff;background-color:var(--l_blue);border-radius:20px;width:33vw;height:200px;margin:28px;display:flex}.graph2 div{margin:10px}.graph-title{color:#fff;padding:12px 16px 0;font-size:.95em;font-weight:600}.recent{color:#fff;background-color:#1b2a41;border-radius:20px;justify-self:center;width:74vw;height:27vh}.recent-header{color:#fff;justify-content:space-between;align-items:center;padding:16px 20px 10px;font-size:1.1em;font-weight:600;display:flex}.recent-header button{color:#3086ff;cursor:pointer;background:0 0;border:none;font-size:.8em}.recent-header button:hover{text-decoration:underline}.recent-row{color:#fff;border-bottom:1px solid #ffffff12;align-items:center;gap:14px;padding:10px 20px;display:flex}.recent-row:last-child{border-bottom:none}.recent-icon{background-color:var(--blue);border-radius:10px;justify-content:center;align-items:center;width:36px;height:36px;font-size:1.4em;display:flex}.recent-info{flex:1}.recent-info div{font-size:.95em;font-weight:500}.recent-info small{color:var(--grey);font-size:.78em}.recent-t{max-height:17vh;overflow-y:auto;padding:0!important}.recent-t::-webkit-scrollbar{width:6px}.recent-t::-webkit-scrollbar-track{background:var(--l_blue)}.recent-t::-webkit-scrollbar-thumb{background:var(--grey);border-radius:12px}.recent-t::-webkit-scrollbar-thumb:hover{background:var(--green)}.top{color:#fff;justify-content:space-between;align-items:center;padding:10px;font-size:2.4em;display:flex}.head{margin:20px}.add button{color:#fff;background-color:var(--l_blue);cursor:pointer;border:1px solid gray;border-radius:8px;margin:20px;padding:10px;font-size:.5em}.add button:hover{background-color:var(--green);color:#000}.filter{background-color:var(--l_blue);border-radius:16px;align-items:center;gap:12px;margin:30px;padding:12px 16px;display:flex}.filter input{color:#fff;background-color:var(--blue);border:1px solid gray;border-radius:16px;flex:2;padding:12px 16px;font-size:14px}.filter select{color:#fff;background-color:var(--blue);cursor:pointer;border:1px solid gray;border-radius:16px;flex:1;padding:12px 16px;font-size:14px}.filter input:focus,.filter select:focus{border-color:var(--green);outline:none}input:hover,select:hover{background-color:var(--l_blue)}.details{color:var(--grey);letter-spacing:1px;background-color:#243550;border-radius:12px 12px 0 0;grid-template-columns:1fr 2fr 1.2fr 1.2fr 1.2fr 1fr;align-items:center;gap:10px;margin:16px 30px 0;padding:14px 24px;font-size:.78em;font-weight:600;display:grid}.tx-row{color:#fff;border-bottom:1px solid #ffffff12;grid-template-columns:1fr 2fr 1.2fr 1.2fr 1.2fr 1fr;align-items:center;gap:10px;margin:0 30px;padding:14px 24px;font-size:.92em;display:grid}.tx-row:last-child{border-bottom:none}.tx-row:hover{background-color:#1f3045}.income-amt{color:var(--green);font-weight:600}.expense-amt{color:var(--red);font-weight:600}.badge-inc{color:var(--green);background-color:#0d3d25;border-radius:20px;width:fit-content;padding:4px 12px;font-size:.85em;font-weight:600}.badge-exp{color:var(--red);background-color:#3d1a0d;border-radius:20px;width:fit-content;padding:4px 12px;font-size:.85em;font-weight:600}.badge-cat{color:var(--grey);background-color:#1e2e42;border:1px solid #ffffff20;border-radius:20px;width:fit-content;padding:4px 12px;font-size:.85em}.actions{gap:8px;display:flex}.actions button{cursor:pointer;background:0 0;border:none;border-radius:6px;padding:4px 6px;font-size:1em}.actions button:hover{background-color:#1f3045}.viewer-details,.viewer-row{grid-template-columns:1fr 2fr 1.2fr 1.2fr 1.2fr}.tx-scroll{max-height:55vh;overflow-y:auto}.tx-scroll::-webkit-scrollbar{width:6px}.tx-scroll::-webkit-scrollbar-track{background:var(--l_blue)}.tx-scroll::-webkit-scrollbar-thumb{background:var(--grey);border-radius:12px}.tx-scroll::-webkit-scrollbar-thumb:hover{background:var(--green)}.modal-overlay{z-index:100;background-color:#0009;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.modal{background-color:var(--l_blue);border-radius:16px;flex-direction:column;gap:16px;width:420px;padding:28px;display:flex}.modal-top{color:#fff;justify-content:space-between;align-items:center;display:flex}.modal-top h2{font-size:1.4em}.modal-close{color:var(--grey);cursor:pointer;background:0 0;border:none;font-size:1.2em}.modal-close:hover{color:var(--red)}.modal-field{flex-direction:column;gap:6px;display:flex}.modal-field label{color:var(--grey);text-transform:uppercase;letter-spacing:.5px;font-size:.82em}.modal-field input,.modal-field select{background-color:var(--blue);color:#fff;border:1px solid gray;border-radius:10px;padding:10px 14px;font-size:14px}.modal-field input:focus,.modal-field select:focus{border-color:var(--green);outline:none}.modal-row{grid-template-columns:1fr 1fr;gap:12px;display:grid}.modal-btns{gap:10px;margin-top:4px;display:flex}.btn-cancel{color:var(--grey);cursor:pointer;background:0 0;border:1px solid gray;border-radius:10px;flex:1;padding:10px;font-size:14px}.btn-cancel:hover{border-color:var(--red);color:var(--red)}.btn-add{background:var(--green);color:#000;cursor:pointer;border:none;border-radius:10px;flex:1;padding:10px;font-size:14px;font-weight:600}.btn-add:hover{background:var(--d_green);color:#fff}input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=date]::-webkit-calendar-picker-indicator{display:none}.header1{color:#fff;padding:20px 20px 10px;font-size:2.4em}.header2{color:gray;padding:0 20px;font-size:1.2em}.grid-box{color:#fff;display:grid}.ins-cards{grid-template-columns:repeat(3,1fr);gap:16px;margin:24px 20px 16px;display:grid}.ins-card{background-color:var(--l_blue);color:#fff;border-radius:12px;padding:20px}.ins-emoji{margin-bottom:10px;font-size:1.8em}.ins-label{color:var(--grey);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px;font-size:.78em}.ins-value{margin-bottom:4px;font-size:1.5em;font-weight:700}.ins-sub{color:var(--grey);font-size:.82em}.ins-chart-box{background-color:var(--l_blue);color:#fff;border-radius:12px;margin:16px 20px;padding:20px}.ins-chart-title{margin-bottom:16px;font-size:1em;font-weight:600}@media (width<=768px){.all{flex-direction:column}.left{width:95vw;height:auto;margin:10px auto}.sec button{width:100%!important}.right{width:95vw;margin:0 auto 10px}.cards,.data{flex-direction:column;align-items:center}.graph1,.graph2,.recent{width:90vw!important}.filter{flex-direction:column}.ins-cards{grid-template-columns:1fr!important}.details,.tx-row,.viewer-details,.viewer-row{padding:10px 8px;font-size:.7em}}