@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&family=Open+Sans:wght@400;600&display=swap";body{font-family:Open Sans,sans-serif;margin:0;padding:1rem;padding-top:160px;background-color:var(--primary-color);color:var(--text-color);min-height:100vh;box-sizing:border-box;display:flex;flex-direction:column;text-align:center;transition:background-color .5s ease}h1,h2,h3,h4,h5,h6{font-family:Montserrat,sans-serif;font-weight:700}:root{--text-color: #ffffff;--primary-color: #E55A47;--primary-color-rgb: 229, 90, 71;--secondary-color: #4682b4;--secondary-color-rgb: 70, 130, 180;--dark-bg: #2c2c2c;--font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif}#google-auth-btn{background-color:#546e7a;width:100%;margin-top:15px}.buttons{display:flex;justify-content:center;align-items:center;gap:20px}button{font-family:var(--font-family);font-size:1.2rem;padding:10px 20px;border:none;border-radius:8px;cursor:pointer;color:#fff;transition:background-color .3s ease,transform .2s ease}.modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#0009}.modal-content{background-color:var(--dark-bg);margin:15% auto;padding:30px;border:1px solid #888;border-radius:15px;width:80%;max-width:400px;color:var(--text-color);position:relative}.close-button{color:#aaa;float:right;font-size:28px;font-weight:700;position:absolute;top:10px;right:15px}.close-button:hover,.close-button:focus{color:#fff;text-decoration:none;cursor:pointer}.modal-content h2{margin-top:0}.modal-content .input-group{margin-bottom:20px}.modal-content label{display:block;margin-bottom:8px}.modal-content input{width:100%;max-width:150px;padding:10px;border-radius:5px;border:1px solid #555;background-color:#333;color:#fff;font-size:1rem;margin:0 auto}#save-settings-btn{background-color:transparent;color:var(--primary-color);border:2px solid var(--primary-color);width:100%;transition:background-color .3s ease,color .3s ease}#save-settings-btn:hover{background-color:var(--primary-color);color:#fff}.auth-button{position:fixed;top:20px;right:20px;background:none;border:none;cursor:pointer;color:var(--text-color);font-size:1.5rem;z-index:1000}.pomodoro-container{padding:40px;border-radius:20px;width:100%;background-color:var(--dark-bg);box-shadow:0 10px 25px #0003;position:relative;max-width:500px;margin:0 auto;box-sizing:border-box}.site-header{display:flex;align-items:center;justify-content:center;gap:15px;margin-bottom:20px}.site-header h1{font-size:2rem;margin:0;color:#eee}.timer-icon{width:30px;height:30px}#phase-title{font-size:2rem;margin-bottom:20px;color:var(--primary-color);transition:color .5s ease}#timer{font-size:6rem;font-weight:700;margin-bottom:30px}button:hover{transform:translateY(-2px)}#toggle-btn{background-color:var(--primary-color)}#skip-btn{background-color:var(--secondary-color)}#settings-btn{background:none;border:2px solid #aaa;border-radius:50%;width:45px;height:45px;padding:5px;display:flex;align-items:center;justify-content:center}#settings-btn svg{width:24px;height:24px;fill:#aaa}footer{margin-top:auto;font-size:.8rem;color:#ccc;text-align:center;padding:15px 0}footer a{color:#fff;text-decoration:underline}.user-page-main{display:flex;justify-content:center;align-items:center;height:100%;width:100%;max-width:1000px;margin:0 auto;padding:0 1rem}.user-card{background-color:var(--dark-bg);padding:40px;border-radius:20px;box-shadow:0 10px 25px #0003;text-align:center;width:100%;min-height:60vh;display:flex;flex-direction:column;justify-content:flex-start;position:relative;gap:20px}.stats-grid-container{display:none;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;width:100%;margin-top:20px}.back-button{position:absolute;top:20px;left:20px;font-size:1.5rem;color:#fff;text-decoration:none;background-color:#ffffff1a;border-radius:50%;width:40px;height:40px;display:flex;justify-content:center;align-items:center;transition:background-color .3s ease;margin-bottom:45px}.back-button:hover{background-color:#fff3}.user-card h1{color:var(--text-color);margin-top:0;margin-bottom:20px;grid-column:1 / -1;text-align:center}#logout-btn{background-color:transparent;color:#f8f8f8;border:2px solid #f8f8f8;font-weight:700;font-size:.9rem;padding:5px 8px;transition:background-color .3s ease,color .3s ease;margin-top:30px;align-self:center;width:fit-content}#logout-btn:hover{background-color:#f8f8f8;color:#222}.stat-card{background-color:#ffffff1a;padding:20px;border-radius:10px;box-shadow:0 4px 15px #0000004d;border:1px solid rgba(255,255,255,.2);transition:transform .2s ease-in-out,box-shadow .2s ease-in-out;margin-bottom:20px}.stat-card:hover{transform:translateY(-7px);box-shadow:0 10px 25px #00000080}.stat-card h3,.stat-card h4{color:var(--text-color);margin-top:0;margin-bottom:10px}.stat-card p{margin-bottom:5px;color:var(--text-color)}.total-pomodoros{background-color:rgba(var(--primary-color-rgb),.25);border-color:var(--primary-color);grid-column:1 / -1;text-align:center;box-shadow:0 6px 20px rgba(var(--primary-color-rgb),.4)}.total-pomodoros h3{font-size:1.8rem}.total-pomodoros p{font-size:2.5rem;font-weight:700;color:var(--text-color)}.period-summary{grid-column:1 / -1}.period-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;margin-top:15px}.daily-stats{background-color:rgba(var(--primary-color-rgb),.3);border-color:var(--primary-color);box-shadow:0 2px 8px rgba(var(--primary-color-rgb),.3)}.weekly-stats{background-color:rgba(var(--secondary-color-rgb),.3);border-color:var(--secondary-color);box-shadow:0 2px 8px rgba(var(--secondary-color-rgb),.3)}.monthly-stats{background-color:#ffffff40;border-color:#ffffff80;box-shadow:0 2px 8px #fff3}.overview-stats{background-color:rgba(var(--primary-color-rgb),.15);border-color:var(--primary-color);grid-column:1 / -1;box-shadow:0 4px 12px rgba(var(--primary-color-rgb),.2)}.peak-hours-stats{background-color:rgba(var(--secondary-color-rgb),.15);border-color:var(--secondary-color);grid-column:1 / -1;box-shadow:0 4px 12px rgba(var(--secondary-color-rgb),.2)}.user-card ul{list-style:none;padding:0}.user-card ul li{margin-bottom:5px;color:var(--text-color)}.loader{border:16px solid #f3f3f3;border-radius:50%;border-top:16px solid #3498db;width:120px;height:120px;-webkit-animation:spin 2s linear infinite;animation:spin 2s linear infinite}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}to{-webkit-transform:rotate(360deg)}}@media (max-width: 600px){.pomodoro-container{width:95%;padding:20px}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}