*{box-sizing:border-box;margin:0;padding:0}body{height:100vh;font-family:Outfit,sans-serif;letter-spacing:.3px;overflow-x:hidden}input,select,input[type=date],input::placeholder,button{font-family:Outfit,sans-serif}.games{padding:1rem}.spinner{position:fixed;top:50%;left:55%;transform:translate(-50%,-50%);z-index:9999}.spinner img{width:60px;height:60px}.grid{list-style-type:none;display:flex;flex-wrap:wrap;gap:1.5rem;justify-content:flex-start}.scroll{scrollbar-width:thin;scrollbar-color:#2e323d #171a21}.scroll::-webkit-scrollbar{width:8px}.scroll::-webkit-scrollbar-track{background:#1a1a1a;border-radius:10px}.scroll::-webkit-scrollbar-thumb{background-color:#444;border-radius:10px;border:2px solid #1a1a1a}.page-card{display:flex;flex-direction:column;background-color:#1d212a;border-radius:15px;padding:1rem 1.5rem;color:#ebecee}.page-card-header{display:flex;justify-content:space-between;margin-bottom:.75rem}.image-overlay-card{position:relative;border-radius:15px;overflow:hidden;display:flex;flex-direction:column;align-items:center;background-color:#1d212a}.image-overlay-card-content{position:relative;z-index:2;display:flex;align-items:center;gap:2rem;height:100%;padding-left:12px;padding-right:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}.image-overlay-card img{position:absolute;right:0;top:0;height:100%;width:80%;object-fit:cover;z-index:0}.image-overlay-bg-fade{position:absolute;right:0;top:0;width:80%;height:100%;background:linear-gradient(to left,#1d212a62,#1d212a);z-index:1}.clear-filters-button{display:flex;gap:.35rem;align-items:center;background:none;border:none;padding:0;margin:0;color:#3ea0d8;cursor:pointer;font-size:.9rem}.search-container{display:flex;align-items:center;background-color:#1d212a;border-radius:999px;width:400px;padding:.25rem .3rem;height:45px;gap:.5rem}.search-icon{color:#606972;margin-left:.8rem;font-size:1.1rem}.search-container input{flex:1;background:transparent;border:none;outline:none;color:#eee;font-size:.9rem;height:100%;padding-left:.5rem}.search-container input::placeholder{color:#606972}.search-button{background-color:#2e323d;color:#fff;border:none;border-radius:999px;padding:.4rem 1rem;font-weight:500;height:35px;cursor:pointer}.search-button:hover{background-color:#2a2e38}.input-error{border:2px solid #d84d4d}.input-error-text{color:#d84d4d;font-size:.875rem;margin-top:.25rem}.blue-button{background-color:#4297d8;color:#fff;padding:10px 24px;border:none;border-radius:8px;cursor:pointer;font-size:16px;transition:background-color .2s}.blue-button:hover{background-color:#2a7dbd}.blue-button-outline{background-color:transparent;border:1px solid #4297d8;color:#4297d8;padding:10px 24px;border-radius:8px;font-size:16px;cursor:pointer;transition:background-color .2s}.blue-button-outline:hover{background-color:#4297d828}.sidebar{width:100%;height:100vh;padding:0 20px;display:flex;flex-direction:column;border-right:1.95px solid rgb(41,47,53)}.sidebar-logo{display:flex;color:#fff;align-items:center;justify-content:center;font-size:20px;height:4.7rem}.sidebar-button{display:flex;align-items:center;font-size:1.05rem;gap:.75rem;padding:14px 20px;border-radius:999px;color:#a0a6ac;text-decoration:none;transition:background .2s,color .2s}.sidebar-button:hover{background-color:#1a2129}.sidebar-icon{font-size:1rem}.sidebar-nav-links{margin-top:3rem;display:flex;flex-direction:column;gap:.75rem}.sidebar-button.active{background-color:#151d25;color:#e4e5e9}.sidebar-container{position:relative}.sidebar-toggle{display:none;position:absolute;top:1rem;left:1rem;background:none;border:none;color:#fff;z-index:1001}@media (max-width: 768px){.sidebar-container{position:fixed;top:0;left:0;z-index:1000;height:100%;width:200px}.sidebar{height:100vh;background-color:#0e1118;border-right:1.95px solid rgb(41,47,53);padding-top:1rem}.sidebar-logo h1{font-size:1.2rem}.sidebar-button span{display:inline}}.sidebar-logo-img-mobile{display:none;height:2rem;width:auto;margin-left:.5rem}.sidebar-logo-text{display:block}@media (max-width: 480px){.sidebar-container{width:60px!important;min-width:60px;max-width:60px}.sidebar{width:60px!important;min-width:60px;max-width:60px;padding:0 4px;border-right:1px solid #23272f}.sidebar-logo{height:3rem;justify-content:center;align-items:center;padding:0}.sidebar-logo h1{font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-nav-links{margin-top:1rem;gap:.3rem}.sidebar-button{font-size:.8rem;padding:8px 4px;justify-content:center}.sidebar-button span{display:none}.sidebar-icon{font-size:1.1rem}.sidebar-logo-img-mobile{display:inline;height:1.4rem}.sidebar-logo-text{display:none}}.navbar{display:flex;border-bottom:1.95px solid rgb(41,47,53);padding:1rem 1.5rem;align-items:center;color:#fff;justify-content:space-between}.navbar-left h1{font-size:1.5rem;font-weight:500}.navbar-right{display:flex}.profile-button{width:42px;height:42px;border-radius:50%;background-color:#2e323d;border:none;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:background-color .25s ease}.profile-button:hover{background-color:#404553}.profile-button svg{color:#fff;font-size:20px}.profile-dropdown{position:absolute;right:0;top:90%;margin-top:1rem;background:#2d333d;border:1px solid #393b41;box-shadow:0 4px 8px #0000000d;border-radius:8px;z-index:100;min-width:150px;display:flex;flex-direction:column}.profile-dropdown hr{border:none;height:1px;background-color:#393b41}.logout-btn{display:flex;align-items:center;gap:.75rem;background:none;border:none;color:#fff;font-weight:500;cursor:pointer;width:100%;font-size:1rem;text-align:left;justify-content:flex-start;padding:.5rem 1rem;border-radius:6px}.logout-btn:hover{background-color:#3b414c;text-decoration:none}.profile-menu-wrapper{position:relative;display:inline-block}.profile-img{width:32px;height:32px;border-radius:50%;object-fit:cover}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background-color:#1a1d24;padding:30px;border-radius:8px;box-shadow:0 5px 15px #0000004d;text-align:center;color:#fff;max-width:400px;width:90%}.modal-content h2{margin-top:0;color:#4197da;font-size:1.8em}.modal-content p{font-size:1.1em;margin-bottom:25px;line-height:1.5;font-weight:300}.modal-buttons{display:flex;justify-content:center;gap:15px}.modal-cancel-btn,.modal-signup-btn{padding:12px 25px;border:none;border-radius:5px;font-size:1em;font-weight:700;cursor:pointer;transition:all .3s ease}.modal-cancel-btn{background-color:#343a40;color:#fff}.modal-cancel-btn:hover{background-color:#495057;transform:translateY(-2px)}.modal-signup-btn{background-color:#4197da;color:#fff}.modal-signup-btn:hover{background-color:#0265ce;transform:translateY(-2px)}.layout{display:flex;background-color:#0e1118;position:relative;height:100vh;overflow-x:hidden}.layout-right{flex:1;margin-left:285px;height:100vh;display:flex;flex-direction:column}.navbar-wrapper{position:fixed;top:0;width:calc(100% - 285px);z-index:10;box-shadow:0 4px 30px #0000001a;background:#0e11181e;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.sidebar-wrapper{position:fixed;top:0;left:0;height:100vh;width:285px;background-color:#0e1118;z-index:20}.main-content-wrapper{flex:1;overflow-y:auto;margin-top:80px}.main-content-inner{padding:1rem}@media (max-width: 768px){.sidebar-wrapper{width:200px}.layout-right{margin-left:200px}.navbar-wrapper{width:calc(100% - 200px)}}@media (max-width: 480px){.sidebar-wrapper{width:60px}.layout-right{margin-left:60px}.navbar-wrapper{width:calc(100% - 60px)}}.demo-banner{position:fixed;top:0;left:0;right:0;background:linear-gradient(135deg,#007bff,#4197da);color:#fff;padding:10px 20px;z-index:30;box-shadow:0 2px 10px #0003}.demo-banner-content{display:flex;height:2.5rem;justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto}.demo-banner-content span{font-weight:700;font-size:18px}.demo-banner-buttons{display:flex;gap:10px}.demo-signup-btn,.demo-exit-btn{padding:5px 15px;border:none;border-radius:4px;font-size:14px;font-weight:700;cursor:pointer;transition:all .3s ease}.demo-signup-btn{background-color:#fff;color:#007bff}.demo-signup-btn:hover{background-color:#f8f9fa;transform:translateY(-1px)}.demo-exit-btn{background-color:transparent;color:#fff;border:1px solid white}.demo-exit-btn:hover{background-color:#ffffff1a}@media (max-width: 768px){.demo-banner-content{flex-direction:column;gap:10px;text-align:center}.demo-banner{padding:15px 20px}.layout:has(.demo-banner) .main-content-wrapper{margin-top:140px}}.dashboard{height:100%;display:flex;flex-direction:column;padding:1.75rem 14rem;position:relative;gap:1rem;max-width:100vw;overflow-x:hidden}.dashboard p{color:#fff}.dashboard-top-cards{display:flex;gap:1rem;flex-wrap:nowrap}.dashboard-total-subs{justify-content:center;align-items:center}.dashboard-total-subs h3{font-weight:400}.dashboard-top-game{background-size:cover;background-position:center;background-repeat:no-repeat;position:relative;color:#fff;border-radius:12px;overflow:hidden;min-height:120px;width:100%;min-width:0;box-sizing:border-box;display:flex;align-items:stretch}.dashboard-top-game-overlay{background:#14182085;width:100%;height:100%;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:1rem;box-sizing:border-box}.dashboard-top-game-total{display:flex;flex-direction:column;align-items:center}.dashboard-top-game-total h1{font-size:2.8rem;color:#3b96df}.dashboard-top-game-total span{font-weight:400;font-size:1.2rem}.dashboard-top-game-title{font-size:2.2rem;font-weight:600;margin:0}.dashboard-top-game-label{font-size:1.2rem;color:#bbb}.dashboard p{color:#606972}.dashboard-total-spent{align-items:center;justify-content:center}.dashboard-total-spent h1{font-size:2.8rem;color:#d84d4d}.dashboard-total-spent h3{font-weight:400;font-size:1.2rem}.dashboard-search-container{display:flex;align-items:center;border-radius:999px;background-color:#171a20;width:220px;gap:.25rem;padding:.5rem}.dashboard-search-container .search-icon{color:#606972}.dashboard-search-container input{background:transparent;border:none;outline:none;color:#eee;font-size:.9rem;width:100%;margin:0;height:100%}.dashboard-search-container input::placeholder{color:#606972}.dashboard-games{min-height:500px}.top-game-content{margin-left:30px}@media (max-width: 768px){.dashboard{padding:1rem}.dashboard-total-spent{flex:1;align-items:center}.dashboard-total-subs{align-items:center;flex:1}.hide-on-mobile{display:none!important}}@media (max-width: 480px){.dashboard{padding:.5rem .2rem;gap:.5rem}.dashboard-top-cards{flex-direction:column;gap:.5rem;height:auto}.dashboard-top-game{min-width:100%;padding:.5rem 0;min-height:90px}.dashboard-top-game-overlay{gap:.7rem;padding:0rem .5rem;flex-direction:column}.dashboard-top-game-title{font-size:1.2rem;margin-left:0;align-items:flex-start}.dashboard-top-game-title h1{font-size:1.1rem}.dashboard-top-game-total h1{font-size:1.5rem}.dashboard-total-subs h3,.dashboard-top-game-total span,.dashboard-total-spent h3{font-size:.9rem}.dashboard-total-spent h1{font-size:2rem}.dashboard-search-container{width:100%;padding:.3rem;font-size:.9rem}.dashboard-games{min-height:300px}.top-game-content{margin-left:0}.dashboard-search-container input{font-size:.8rem}.dashboard-search-container .search-icon{font-size:1rem}.dashboard-search-container input::placeholder{font-size:.8rem}.page-card-header{display:flex;flex-direction:column;align-items:flex-start;gap:.4rem}.page-card-header h2{order:0;font-size:1.1rem}.dashboard-search-container{order:1;width:100%;margin-top:.2rem}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.4rem}}.card-container{display:flex;flex-direction:column;gap:.6rem;white-space:normal;overflow-wrap:break-word;word-wrap:break-word;width:15rem;height:21rem;transition:transform .2s ease}.card-container:hover{transform:translateY(-5px)}.card{position:relative;background-color:transparent;color:gray;overflow:hidden;border-radius:12px;box-shadow:0 4px 10px #0000001e}.card-container:hover .card-overlay-disabled{opacity:1}.card-image{width:100%;height:100%;object-fit:cover}.card-image-disabled{width:100%;height:100%;filter:grayscale(100%) brightness(.6);object-fit:cover}.card-overlay{all:unset;position:absolute;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease-in-out;cursor:pointer}.card-container:hover .card-overlay{opacity:1}.overlay-add-icon{color:#fffc;font-size:2.6rem}.card-title{font-size:1.3rem;color:#fff;text-align:center;font-weight:400}@media (max-width: 768px){.card-container{width:12rem;height:18rem}.card-title{font-size:18px}}@media (max-width: 480px){.card-container{width:100%;height:15rem;gap:.3rem}.card-title{font-size:.95rem}.overlay-add-icon{font-size:1.7rem}}.panel-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;z-index:999}.panel p{color:#61656e}.panel{position:fixed;top:50%;left:50%;transform:translate(-50%,-55%);width:45vw;height:80%;background:#1d212a;box-shadow:-2px 0 10px #0003;z-index:1000;overflow-y:auto;padding:1.5rem 3.5rem;display:flex;flex-direction:column;border-radius:12px}.panel,.expenses-scroll{scrollbar-width:thin;scrollbar-color:#2e323d #171a21}.panel::-webkit-scrollbar,.expenses-scroll::-webkit-scrollbar{width:8px}.panel::-webkit-scrollbar-track,.expenses-scroll::-webkit-scrollbar-track{background:#1a1a1a;border-radius:10px}.panel::-webkit-scrollbar-thumb,.expenses-scroll::-webkit-scrollbar-thumb{background-color:#444;border-radius:10px;border:2px solid #1a1a1a}.panel-header{display:flex;justify-content:flex-start;align-items:center;margin-bottom:.45rem}.close-button{background:none;border:none;font-size:1.5rem;line-height:1;cursor:pointer;color:#fff}.panel-content{flex:1;display:flex;flex-direction:column;gap:1rem}.panel-game-details{display:flex;gap:1.3rem;justify-content:space-between}.panel-game-details-left{display:flex;flex-direction:column;gap:1rem}.panel-game-details-total{display:flex;flex-direction:column;justify-content:center;background-color:#2d323d;border-radius:15px;padding:1rem 1.5rem;color:#ebecee}.delete-game-button{display:flex;gap:.5rem;justify-content:center;align-items:center;background-color:#c44141;color:#fff;border:none;padding:.5rem 1rem;font-size:.95rem;border-radius:999px;max-width:10rem;cursor:pointer;transition:background-color .2s ease}.delete-game-button:hover{background-color:#c43131}.delete-game-button:active{background-color:#b82020}.panel-game-details-left p{color:#ebecee;font-size:1.2rem}.panel-game-details-total h1{font-size:2.8rem;color:#d84d4d;text-shadow:1px 1px 3px rgba(0,0,0,.3)}.panel-game-details-total span{font-weight:400;font-size:1.2rem;text-shadow:1px 1px 3px rgba(0,0,0,.3)}.panel-game-details h1{color:#fff;font-size:3rem}.panel-image-container{width:17rem;height:22rem;border-radius:6px;overflow:hidden;flex-shrink:0;display:flex;align-items:center;justify-content:center}.panel-image-container img{width:100%;height:100%;object-fit:cover;border-radius:10px}.panel h4,.panel label{color:#fff}.panel hr{border:none;height:2px;background-color:#2e323d;margin:1rem 0;width:100%}.panel select,.panel input{background-color:#2d323d;width:100%;padding:.5rem;margin-bottom:1rem;border:none;border-radius:6px;caret-color:#fff;outline:none;color:#fff}.panel input:focus{border:1px solid #61656d}.panel input::placeholder{color:#61656d}.panel input[type=date]{color:#61656d}.panel input[type=date]::-webkit-calendar-picker-indicator{filter:brightness(0) saturate(100%) invert(52%) sepia(9%) saturate(211%) hue-rotate(182deg) brightness(90%) contrast(88%);cursor:pointer}.panel input[type=number]::-webkit-outer-spin-button,.panel input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.panel input[type=number]{-moz-appearance:textfield}.panel-forms{display:flex;flex-direction:column;gap:1rem}.panel-forms-wrapper{display:flex;gap:1.75rem;border-radius:12px;border:2px solid #2e323d;padding:1rem}.panel-form-container{display:flex;flex-direction:column;gap:.75rem}.expense-form,.subscriptions-form{flex:1;margin-top:1rem;display:flex;flex-direction:column;gap:.5rem}.expense-form button,.subscriptions-form button{display:flex;gap:.5rem;justify-content:center;align-items:center;color:#fff;border:none;padding:.5rem 1rem;font-size:.95rem;border-radius:999px;min-width:8rem;max-width:10rem;transition:background-color .2s ease;align-self:center}.subscription-date{display:flex;gap:1rem;justify-content:space-between}.subscription-date .panel-form-container{flex:1}.expenses-scroll{flex:1;max-height:200px;overflow-y:auto;margin-top:1rem;padding-right:4px}.expense-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 1rem;border-radius:12px;background-color:#2e323d;margin-bottom:.75rem}.expense-info{flex-grow:1;display:flex;flex-direction:column}.expense-name{font-weight:600;font-size:16px;margin-bottom:.1rem;color:#fff}.expense-date{font-size:12px;color:#61656d;margin-top:.3rem}.expense-price{font-weight:600;font-size:16px;white-space:nowrap;color:#fff}.delete-expense{background-color:#c2504a;color:#2e323d;font-weight:700;border:none;border-radius:8px;padding:5px 8px;cursor:pointer;font-size:14px}.delete-expense:hover{background-color:#d66a64}.delete-expense:active{background-color:#e27872}.subscription-tag{display:inline-block;background-color:transparent;color:#787e8b;border:1.5px solid #787e8b;padding:4px 10px;border-radius:999px;font-size:.7rem;font-weight:500;text-transform:lowercase;margin-top:.25rem;max-width:6rem}@media (max-width: 768px){.panel{width:90vw}}.games{flex:1;height:100%;display:flex;flex-direction:column}.games-grid{list-style-type:none;display:flex;flex-wrap:wrap;gap:1.5rem;padding:2rem;justify-content:flex-start}.games p{color:#61656e;padding:1rem}@media (max-width: 480px){.search-container{width:100%;padding:.3rem .2rem;box-sizing:border-box}.search-container input{width:100%;font-size:.95rem;padding:.4rem .6rem}}.purchases{padding:1rem;display:flex;flex-direction:column;gap:1rem}.purchases p{color:#5a636f}.purchases-header{display:flex;gap:1rem;align-items:center}.purchases-container{display:flex;flex-direction:column;gap:1rem;padding:1rem;background-color:#1d212a;border-radius:15px}.purchases-container-header,.purchase-row{display:flex;align-items:center;padding:.5rem}.filter-type-container{display:flex;flex-direction:column;justify-content:flex-end;font-size:.95rem;gap:.3rem;height:45px}.filter-type-container label{color:#fff;font-size:.75rem;line-height:1;margin-left:.1rem}.filter-type-container select{background-color:#2d323d;width:100%;padding:.5rem;border:none;border-radius:6px;caret-color:#fff;outline:none;color:#fff}.sort-container{display:flex;gap:.5rem}.sort-container button{background:none;border:none;outline:none;color:#fff;font-size:1.1rem;cursor:pointer;padding:0;margin-top:10px}.purchase-col{flex:1;display:flex;align-items:center;justify-content:flex-start;padding:.5rem;color:#fff;box-sizing:border-box}.purchases-header .purchase-col{font-weight:700;color:#ccc}.purchase-row{background-color:#171a20;border-bottom:1px solid #303237}.purchase-game-img{width:40px;height:40px;border-radius:6px;overflow:hidden;flex-shrink:0;margin-right:.5rem}.purchase-game-img img{width:100%;height:100%;object-fit:cover}#game-title-image{display:flex;gap:1rem;justify-content:center;align-items:center}@media (max-width: 768px){.purchases-header{flex-direction:column;gap:1rem;align-items:flex-start}.sort-container,.filter-type-container{width:100%}.purchases-header-row{display:flex;flex-wrap:wrap;gap:.5rem;width:100%;justify-content:space-between;align-items:center}.purchases-container-header,.purchase-row{padding:.5rem}.purchase-col{font-size:.85rem;padding:.25rem .5rem}.purchase-game-img{display:none}#game-title-image{gap:.5rem;justify-content:flex-start}}@media (max-width: 480px){.purchases{padding:.5rem;gap:.5rem}.purchases-header{flex-direction:column;gap:.5rem;align-items:flex-start}.purchases-container{padding:.5rem;gap:.5rem}.purchases-container-header,.purchase-row{padding:.3rem .2rem;font-size:.85rem;flex-wrap:wrap}.purchase-col{font-size:.8rem;padding:.15rem .2rem}.purchase-game-img{width:28px;height:28px;margin-right:.3rem}#game-title-image{gap:.3rem}.sort-container,.filter-type-container{width:100%;font-size:.85rem;margin-top:.5rem}}.pagination{display:flex;gap:8px;justify-content:center;align-items:center;margin-top:20px}.pagination button{padding:6px 12px;border:none;border-radius:5px;background-color:#414858;color:#a3a8ae;cursor:pointer}.pagination button.active{background-color:#3a97dd;color:#fff}.pagination button:disabled{opacity:.5;cursor:default}.pagination span{padding:0 4px;color:#a3a8ae}.statistics{display:flex;flex-wrap:wrap;gap:1rem;margin-top:5rem;padding:1.75rem 2rem;width:100%;box-sizing:border-box;overflow-x:hidden}.statistics p{color:#61656e}.statistics-card{display:flex;flex-direction:column;align-items:center;height:100%;width:50vw;padding:1rem 1.5rem 3rem;background-color:#1d212a;border-radius:15px;color:#ebecee}.statistics-page-right{display:flex;flex-direction:column;flex:1;max-height:100%;gap:1rem}.sub-cost-total{display:flex;justify-content:center;align-items:center}.sub-cost-total h1{color:#3a96df}.statistics-card-header{align-self:flex-start;display:flex;justify-content:space-between;width:100%;padding:0px 1rem;align-items:center}.active-subs-card{display:flex;flex-direction:column;flex:1;overflow:hidden}.active-subscription-card{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.75rem}.subs-image-overlay-card{position:relative;border-radius:15px;overflow:hidden;display:flex;flex-direction:column;align-items:center;background-color:#0e1118;height:80px;border:2px solid #2e3138;flex:0 0 auto}.subs-image-overlay-card-content{position:relative;z-index:2;display:flex;align-items:center;gap:2rem;height:100%;padding-left:12px;padding-right:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}.subs-image-overlay-card img{position:absolute;right:0;top:0;height:100%;width:80%;object-fit:cover;z-index:0}.subs-image-overlay-bg-fade{position:absolute;right:0;top:0;width:80%;height:100%;background:linear-gradient(to left,#0e111860,#0e1118);z-index:1}.sub-days-remaining{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;margin-bottom:5px}.sub-days-remaining span{background-color:transparent;color:#fff;background-color:#313541;padding:4px 10px;border-radius:999px;font-size:.8rem;font-weight:500;text-transform:lowercase;margin-top:.25rem}.sub-name{display:flex;flex-direction:column;align-items:center;flex:1;margin-bottom:10px}.sub-cost{font-size:1.5rem}@media (max-width: 768px){.statistics{flex-direction:column;padding:1.75rem 1rem}.statistics-card{width:100%}}@media (max-width: 480px){.statistics{flex-direction:column;padding:0;margin:0;width:100%;box-sizing:border-box;overflow-x:hidden}.statistics-card,.statistics-page-right,.active-subs-card,.sub-cost-total{width:calc(100% - 2rem);min-width:0;box-sizing:border-box;padding:.75rem 0;margin:0 auto}}.settings{padding:2rem;max-width:700px;margin:0 auto}.settings-header{display:flex;gap:1rem}.settings-header p{margin-top:2px;color:#6e7079}.settings h2{font-size:2rem;margin-bottom:1.5rem}.settings-section{margin-bottom:2rem}.settings-section h3{margin-bottom:.5rem}.settings-section input{display:block;width:100%;padding:.75rem;margin-bottom:.5rem;background:#1c1f26;border:1px solid #333;border-radius:6px;color:#fff}.settings-section button{padding:.6rem 1.2rem;background-color:#4297d8;color:#fff;border:none;border-radius:6px;cursor:pointer;margin-right:.5rem}.settings-section.danger .delete-btn{background-color:#c64040;margin-top:.5rem}.login-wrapper{min-height:100vh;padding:10rem 0;background-color:#0e1118}.or-div{margin-top:1.2rem;margin-bottom:1rem;display:flex;align-items:center;text-align:center;color:#888;font-size:.8rem}.or-div:before,.or-div:after{content:"";flex:1;height:1px;background:#303237}.or-div span{padding:0rem .5rem}.login-container{width:100%;max-width:520px;margin:0 auto;padding:0 1rem}.login-card{display:flex;flex-direction:column;background-color:#1d212a;border-radius:1rem;padding:2rem;box-shadow:0 10px 15px #0000001a}.login-top{flex:1;color:#dfdfdf;gap:.8rem;display:flex;flex-direction:column;justify-content:center;align-items:center}.login-bot{display:flex;flex-direction:column}.input-wrapper{position:relative;display:inline-block}.input-wrapper input{padding-left:37px}.input-wrapper input::placeholder{color:#888}.input-icon{position:absolute;left:15px;top:50%;transform:translateY(-50%);color:#888;pointer-events:none}.register-link{position:relative;display:inline-block;cursor:pointer;color:#4297d8}.register-link:after{content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background-color:#4297d8;transition:width .3s ease}.register-link:hover{color:#62b0ec}.register-link:hover:after{width:100%;color:#62b0ec}.login-welcome{font-size:1.875rem;font-weight:500;margin-bottom:.25rem}.login-message{font-size:1rem;margin-bottom:.75rem;display:flex;gap:.5rem}.login-message span{color:#888}.login-label{display:block;font-weight:600;color:#dfdfdf}.login-grid{display:flex;flex-direction:column;gap:1.25rem;border:none;padding:0;margin:0}.login-field{display:flex;flex-direction:column;gap:.25rem}.login-field h2{font-weight:500}.login-input{border:1px solid #303237;color:#dfdfdf;padding:.5rem;border-radius:10px;height:45px;background-color:#0e1118}.full-width{width:100%}.login-submit{margin-top:1.25rem;display:flex;flex-direction:column;align-items:center;gap:.7rem}.login-submit button{width:100%}.login-submit button:active{transform:scale(.97)}.login-submit button:disabled{background-color:#9ca3af;cursor:default;opacity:.7}.login-link{color:#4297d8;font-weight:600;text-decoration:none}.google-login-button{display:flex;justify-content:center;align-items:center;width:100%}.login-options{display:flex;justify-content:space-between;align-items:center;font-size:.9rem;color:#dfdfdf}.remember-me{display:flex;align-items:center;gap:.4rem;cursor:pointer}.custom-checkbox{-moz-appearance:none;appearance:none;-webkit-appearance:none;width:18px;height:18px;border-radius:3px;background-color:#3a3f4d;cursor:pointer;position:relative;transition:all .2s ease}.custom-checkbox:checked{background-color:#4aa3ff}.custom-checkbox:checked:after{content:"";position:absolute;top:2px;left:6px;width:4px;height:10px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.custom-checkbox:focus{outline:none;box-shadow:none}.forgot-password{border:none;background-color:transparent;font-size:.9rem;font-weight:500}.google-button{background-color:#2d323d;color:#dfdfdf;border:none;border-radius:8px;padding:.7rem 1.5rem;font-size:1rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.3s ease all;width:100%;max-width:400px}.google-button:hover{background-color:#393f4d}.google-icon{margin-right:10px;width:22px}.signup-top{margin-bottom:3rem}.password-field{display:flex;flex-direction:column;gap:.5rem}.signup-button-container{margin-top:1.25rem;display:flex;flex-direction:column;gap:.5rem;align-items:center}.login-redirect{display:flex;gap:.5rem;color:#888}.password-description{color:#888;margin-bottom:.5rem}.recaptcha{margin-bottom:.5rem}.resend-code{background:none;border:none;padding:0;color:#4297d8;cursor:pointer;font-size:.9rem;font-weight:500}.code-top{margin-bottom:1rem}.code-bot{display:flex;flex-direction:column;justify-content:center;align-items:center;margin-top:1rem;gap:1rem}.code-input[type=number]::-webkit-inner-spin-button,.code-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.code-input[type=number]{-moz-appearance:textfield}.envelope-icon{width:40px;height:40px}.verify-description{text-align:center}.verify-description span{color:#4297d8}.landing{position:relative;background-color:#0e1118;min-height:100vh;overflow:hidden}.landing-body{position:relative;z-index:1;padding:5rem 2rem;display:flex;flex-direction:column;align-items:center;width:60vw;margin:0 auto}.landing-buttons{display:flex;gap:15px;justify-content:center;flex-wrap:wrap}.get-started-button{font-size:18px;padding:13px 28px}.demo-button{font-size:18px;padding:13px 28px;background-color:transparent;border:2px solid #4197da;color:#4197da;border-radius:5px;cursor:pointer;transition:all .3s ease;font-weight:500}.demo-button:hover{background-color:#4198da3a}.hero{text-align:center;width:100%;margin-bottom:8rem;margin-top:5rem}.hero h1{font-size:48px;margin-bottom:20px;color:#dfdfdf}.hero p{font-size:22px;color:#dfdfdf;margin-bottom:40px}.features{display:flex;justify-content:center;flex-direction:column;width:100%;gap:4rem}.features p{font-size:21px;color:#888}.features h3{font-size:30px;color:#dfdfdf}.feature-card{display:flex;gap:3.3rem}.feature-card div{display:flex;flex-direction:column}.feature-card img{background-color:#1a1d25;border:1px solid #2e3138;padding:.2rem;border-radius:10px;width:60%;height:100%;object-fit:cover;object-position:center top}.fade-background-wrapper{position:absolute;top:0;left:0;width:100%;height:50vh;overflow:hidden;z-index:0}.fade-background-wrapper img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}.image-tint{position:absolute;top:0;left:0;width:100%;height:100%;background:#0e11189d;z-index:1}.fade-overlay{position:absolute;bottom:0;left:0;width:100%;height:50%;background:linear-gradient(to bottom,#0e111800,#0e1118)}@media (max-width: 768px){.landing-body{width:90vw}}@media (max-width: 480px){.landing-body{width:100vw;padding:2rem}.feature-card{flex-direction:column}.feature-card img{width:100%}.feature-card div h3{font-size:24px}.feature-card div p{font-size:18px}.hero h1{font-size:36px}.hero p{font-size:18px}.get-started-button{font-size:16px;padding:10px 20px}.fade-background-wrapper img{object-position:center center}}.landing-navbar{display:flex;justify-content:space-between;align-items:center;padding:20px 40px;border-bottom:1px solid #2a2d35;background-color:#0e1118;position:relative;z-index:10}.landing-logo{font-size:32px;font-weight:700;color:#fff;background-color:transparent;border:none;cursor:pointer}.nav-buttons button{margin-left:10px}@media (max-width: 480px){.landing-navbar{padding:1.5rem 1rem}.landing-logo{font-size:1.5rem;padding:.2rem .6rem}.nav-buttons{gap:.2rem}.blue-button,.blue-button-outline{font-size:.9rem;padding:.3rem .7rem}}.footer{text-align:center;padding:30px;border-top:1px solid #2a2d35;margin-top:auto;color:#888;background-color:#1a1d26}.back-button{background-color:transparent;border:none;color:#4195d4;font-size:1rem;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:color .2s;padding:0}.back-button:hover{color:#73bbff}