.content{display:flex;flex-direction:column;justify-content:lef;align-items:center;padding:10px;margin:2px 30px}h1{margin:20px 0}.input-group{margin-bottom:10px;width:100%;max-width:400px}.input-group input,.input-group select,.input-group button{width:100%;padding:10px;margin-bottom:10px;border:1px solid #000000;border-radius:4px;box-sizing:border-box}.input-group button{background-color:#00f;color:#fff;border:none;cursor:pointer;margin-top:10px;box-shadow:"0 4px 8px #000",}.input-group button:hover{background-color:#00008b;box-shadow:"0 4px 8px #000",}.chart-container{margin:20px 0}.chart-container:hover{background-color:#e0f7fa}.summary{margin:20px auto;padding:10px;text-align:left;width:100%;max-width:400px;border-radius:5px}.summary h2{margin-bottom:10px}.summary p{margin:5px 0;display:flex;justify-content:space-between}.summary .amount{margin-left:auto;padding:2px 5px;border-radius:4px}.summary .income{background-color:#d4edda;color:#155724}.summary .expense{background-color:#f8d7da;color:#721c24}.dark-mode-toggle{position:fixed;bottom:20px;right:30px;background:#ffffff3a;border:1px solid #ccc;color:#333;font-size:24px;cursor:pointer;border-radius:50%;width:50px;height:50px;display:flex;align-items:center;justify-content:center;padding:0;box-shadow:0 2px 5px #0003;outline:none}.dark-mode-toggle:focus{outline:none}.App.dark-mode .dark-mode-toggle{color:#ffdd57}.App.dark-mode,.App.dark-mode .content{background-color:#2c2c2c;color:#fff}.App.dark-mode .input-group input,.App.dark-mode .input-group select,.App.dark-mode .input-group button{background-color:#504e70;color:#fff}.App.dark-mode .input-group button{background-color:#00f}.App.dark-mode .summary{background-color:#3a3a3a;color:#fff;box-shadow:0 0 7px #ddd9d9}.improvements{margin:20px auto;padding:10px;text-align:left;width:100%;max-width:400px;border-radius:5px;background-color:#90ee9080;box-shadow:0 0 10px #0000001a}.improvements.negative{background-color:#ff634780}.improvement{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.improvement button{background:none;border:none;color:inherit;cursor:pointer;font-size:16px}.improvement button:hover{color:red}.analysis{margin:20px auto;padding:10px;text-align:left;width:100%;max-width:400px;border-radius:5px;background-color:#90ee9080;box-shadow:0 0 10px #0000001a}.message{padding:10px;border-radius:5px;margin-top:10px;color:#fff}.positive{background-color:#d4edda;color:#155724}.negative{background-color:#f8d7da;color:#721c24}.modal{display:flex;justify-content:center;align-items:center;position:fixed;overflow:scroll;background-color:#0006}.modal-content{background-color:#fefefe;margin:auto;padding:20px;border:1px solid #888;width:100%;max-width:500px;text-align:center;position:relative}.close{color:#aaa;position:absolute;top:10px;right:10px;font-size:28px;font-weight:700}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer}.wishlist-notification{margin:20px auto;padding:10px;text-align:center;width:100%;max-width:400px;border-radius:5px;background-color:#ffeb3b;box-shadow:0 0 10px #0000001a;color:#000}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}@media (max-width: 1024px){.App{padding:15px}.input-group,.summary,.analysis,.improvements{max-width:80%}}@media (max-width: 768px){.App{padding:10px}.input-group,.summary,.analysis,.improvements{max-width:90%}}@media (max-width: 358px){.App{padding:5px}.input-group,.summary,.analysis,.improvements{max-width:90%}}.notification{position:fixed;bottom:20px;right:20px;background-color:#00800080;color:#fff;padding:10px 20px;border-radius:8px;box-shadow:0 4px 6px #0000001a;font-size:16px;animation:fade-in-out 3s ease-in-out}@keyframes fade-in-out{0%{opacity:0;transform:translateY(10px)}10%{opacity:1;transform:translateY(0)}90%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(10px)}}.visitor-counter{position:fixed;bottom:15px;left:25px;display:flex;align-items:center;background-color:#f0f0f0b0;color:#000;padding:5px 10px;border-radius:8px;border:1px solid #000;box-shadow:0 0 5px red}.visitor-counter .icon{margin-left:10px;color:#333}.visitor-counter span{font-size:16px;font-weight:700;margin-left:10px}body{font-family:Arial,sans-serif;padding:5px;display:flex;justify-content:center;align-items:center;height:100vh;width:100%;text-align:center;background-color:#070707b6;box-sizing:border-box}.App{width:100%;height:100vh;margin:10px auto;padding:20px;background-color:#fff;box-shadow:0 0 10px #0000001a;border-radius:8px;overflow-y:auto;position:relative;box-sizing:border-box}.chart-container{margin:10px auto;border-radius:15px;box-shadow:0 0 10px #f5bfbf}.chart-container:hover{background-color:#d2dfe0}