@import"https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh}*{margin:0;padding:0;box-sizing:border-box;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}:root{--beige: #f5f5dc;--light-emerald: #E3BFC3;--emerald: #DD7A83;--dark-emerald: #DD7A83;--emerald-border: #DD7A83;--shadow-sm: 4px 4px 0px rgba(221, 122, 131, .3);--shadow-md: 6px 6px 0px rgba(221, 122, 131, .4);--shadow-lg: 8px 8px 0px rgba(221, 122, 131, .5)}body{font-family:"Press Start 2P",monospace;-webkit-font-smoothing:none;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#e3bfc3,#dd7a83);min-height:100vh}.app{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem 1rem;position:relative;overflow:hidden}.pixel-star,.pixel-heart,.pixel-cloud,.pixel-diamond{position:absolute;animation:float 6s ease-in-out infinite}.pixel-1{top:10%;left:15%;animation-delay:0s}.pixel-2{top:20%;right:20%;animation-delay:1s}.pixel-3{top:60%;left:10%;animation-delay:2s}.pixel-4{top:15%;right:10%;animation-delay:3s}.pixel-5{top:70%;right:15%;animation-delay:1.5s}.pixel-6{bottom:15%;left:20%;animation-delay:2.5s}.pixel-7{bottom:25%;right:25%;animation-delay:.5s}.pixel-8{top:40%;left:5%;animation-delay:3.5s}@keyframes float{0%,to{transform:translateY(0) rotate(0)}25%{transform:translateY(-10px) rotate(2deg)}50%{transform:translateY(-5px) rotate(-2deg)}75%{transform:translateY(-15px) rotate(1deg)}}.dashboard-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:2rem;width:100%;max-width:1400px;padding:2rem}.todo-section{background:linear-gradient(135deg,#e3bfc3f2,#e3bfc3d9);border:6px solid #DD7A83;border-radius:0;padding:2.5rem;box-shadow:var(--shadow-lg);position:relative;display:flex;flex-direction:column}.right-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto 1fr;gap:1.5rem}.mood-section{grid-column:1;grid-row:1}.music-section{grid-column:2;grid-row:1}.message-section{grid-column:1 / -1;grid-row:2}.notes-section{grid-column:1 / -1;grid-row:3}@keyframes fadeIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.title{font-size:1.2rem;font-weight:400;color:var(--dark-emerald);text-align:center;margin-bottom:2rem;letter-spacing:2px;text-shadow:3px 3px 0px rgba(255,255,255,.3)}.input-section{display:flex;gap:.75rem;margin-bottom:2rem;animation:slideIn .5s ease-out .1s backwards}@keyframes slideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.todo-input{flex:1;padding:.875rem 1.25rem;font-size:.65rem;color:var(--dark-emerald);background-color:#fff;border:4px solid var(--emerald);border-radius:0;outline:none;transition:all .1s ease;font-family:inherit}.todo-input::placeholder{color:#e3bfc3}.todo-input:focus{border-color:var(--dark-emerald);box-shadow:4px 4px #dd7a834d;transform:translate(-2px,-2px)}.add-button{width:50px;height:50px;border:4px solid #DD7A83;border-radius:0;background:linear-gradient(135deg,#dd7a83,#e3bfc3);color:#fff;font-size:1.5rem;font-weight:400;cursor:pointer;transition:all .1s ease;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm)}.add-button:hover{background:linear-gradient(135deg,#dd7a83,#c96873);transform:translate(-2px,-2px);box-shadow:6px 6px #dd7a8366}.add-button:active{transform:translate(0);box-shadow:2px 2px #dd7a8366}.add-icon{line-height:1}.todos-container{min-height:250px;max-height:450px;overflow-y:auto;margin-bottom:1rem;animation:slideIn .5s ease-out .2s backwards}.todos-container::-webkit-scrollbar{width:8px}.todos-container::-webkit-scrollbar-track{background:transparent}.todos-container::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#dd7a83,#e3bfc3);border-radius:4px}.todos-container::-webkit-scrollbar-thumb:hover{background:var(--dark-emerald)}.empty-state{text-align:center;padding:3rem 2rem;color:var(--dark-emerald)}.empty-icon{font-size:3.5rem;margin-bottom:1rem;opacity:.6;animation:bounce 2s infinite ease-in-out}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.empty-text{font-size:.6rem;opacity:.7;line-height:1.8}.todos-list{list-style:none;display:flex;flex-direction:column;gap:.75rem}.todo-item{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;background-color:#fff;border:4px solid var(--emerald);border-radius:0;transition:all .1s ease;animation:todoSlideIn .3s ease-out}@keyframes todoSlideIn{0%{opacity:0;transform:translate(-15px)}to{opacity:1;transform:translate(0)}}.todo-item:hover{border-color:var(--dark-emerald);box-shadow:4px 4px #dd7a834d;transform:translate(-2px,-2px)}.todo-content{display:flex;align-items:center;gap:1rem;flex:1}.checkbox{width:22px;height:22px;border:3px solid var(--emerald);border-radius:0;background-color:#fff;cursor:pointer;transition:all .1s ease;display:flex;align-items:center;justify-content:center;flex-shrink:0;padding:0}.checkbox:hover{border-color:var(--dark-emerald);box-shadow:2px 2px #dd7a834d}.todo-item.completed .checkbox{background:linear-gradient(135deg,#dd7a83,#e3bfc3);border-color:var(--emerald)}.checkmark{color:#fff;font-weight:700;font-size:.75rem}.todo-text{flex:1;font-size:.65rem;color:var(--dark-emerald);transition:all .1s ease;word-break:break-word;line-height:1.8}.todo-item.completed .todo-text{text-decoration:line-through;opacity:.5}.delete-button{width:28px;height:28px;border:none;border-radius:0;background-color:transparent;color:var(--emerald);font-size:1.5rem;cursor:pointer;transition:all .1s ease;display:flex;align-items:center;justify-content:center;opacity:0;line-height:1;padding:0}.todo-item:hover .delete-button{opacity:1}.delete-button:hover{background-color:#fef2f2;color:#dc2626;transform:scale(1.1)}.delete-button:active{transform:scale(.9)}.footer{text-align:center;margin-top:1.5rem;animation:slideIn .5s ease-out .3s backwards}.clear-button{padding:.75rem 1.75rem;border:4px solid var(--emerald);border-radius:0;background-color:#fff;color:var(--dark-emerald);font-size:.6rem;font-weight:400;cursor:pointer;transition:all .1s ease;box-shadow:var(--shadow-sm);font-family:inherit}.clear-button:hover{background:linear-gradient(135deg,#dd7a83,#e3bfc3);color:#fff;border-color:var(--dark-emerald);transform:translate(-2px,-2px);box-shadow:6px 6px #dd7a8366}.clear-button:active{transform:translate(0);box-shadow:2px 2px #dd7a8366}@media(max-width:1024px){.dashboard-grid{grid-template-columns:1fr;gap:1.5rem;padding:1.5rem}.right-grid{grid-template-columns:1fr;grid-template-rows:auto auto auto auto}.music-section{grid-column:1;grid-row:2}.message-section{grid-column:1;grid-row:3}.notes-section{grid-column:1;grid-row:4}}@media(max-width:640px){.dashboard-grid{padding:1rem}.todo-section{padding:2rem 1.5rem}.title{font-size:.9rem}.todo-input{font-size:.6rem;padding:.75rem 1rem}.add-button{width:45px;height:45px;font-size:1.3rem}.todo-item{padding:.875rem 1rem}.todo-text{font-size:.6rem}}.music-player{background:linear-gradient(135deg,#e3bfc3f2,#e3bfc3d9);border:4px solid #DD7A83;padding:1.5rem;display:flex;flex-direction:column;gap:1rem;height:100%}.music-header{font-size:.7rem;color:#dd7a83;text-align:center;margin-bottom:.5rem}.album-cover{background:#fff;border:4px solid #DD7A83;aspect-ratio:1;display:flex;align-items:center;justify-content:center;margin-bottom:.5rem;overflow:hidden;position:relative}.cover-image{width:100%;height:100%;object-fit:cover;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges;filter:contrast(1.1) saturate(1.2)}.cover-emoji{font-size:4rem;filter:grayscale(.2)}.track-info{text-align:center;margin-bottom:.5rem}.track-title{font-size:.6rem;color:#dd7a83;margin-bottom:.3rem;line-height:1.6}.track-artist{font-size:.5rem;color:#dd7a83;opacity:.7;line-height:1.6;margin-bottom:.2rem}.track-duration{font-size:.45rem;color:#dd7a83;opacity:.5;line-height:1.6}.equalizer{display:flex;align-items:flex-end;justify-content:center;gap:4px;height:40px;margin:.5rem 0}.bar{width:6px;background:#dd7a83;height:var(--height);transition:height .1s ease}.bar.playing{animation:bounce .8s ease-in-out infinite;animation-delay:var(--delay)}@keyframes bounce{0%,to{height:20%}50%{height:var(--height)}}.controls{display:flex;gap:.5rem;justify-content:center;margin-top:auto}.control-btn{background:#fff;border:3px solid #DD7A83;color:#dd7a83;font-size:.7rem;padding:.5rem .8rem;cursor:pointer;transition:all .1s ease;font-family:inherit}.control-btn:hover{background:linear-gradient(135deg,#dd7a83,#e3bfc3);color:#fff;transform:translate(-2px,-2px);box-shadow:4px 4px #dd7a834d}.control-btn:active{transform:translate(0);box-shadow:2px 2px #dd7a834d}.play-btn{padding:.5rem 1rem}.mood-tracker{background:linear-gradient(135deg,#e3bfc3f2,#e3bfc3d9);border:4px solid #DD7A83;padding:1rem;display:flex;flex-direction:column;margin-bottom:0;gap:.8rem;height:50%;flex-grow:1}.mood-header{font-size:.65rem;color:#dd7a83;text-align:center}.mood-date{font-size:.5rem;color:#dd7a83;opacity:.7;text-align:center}.mood-selector{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}.mood-btn{background:#fff;border:3px solid #DD7A83;font-size:1.5rem;padding:.5rem;cursor:pointer;transition:all .1s ease;aspect-ratio:1;display:flex;align-items:center;justify-content:center}.mood-btn:hover{transform:translate(-2px,-2px);box-shadow:4px 4px #dd7a834d}.mood-btn.selected{background:linear-gradient(135deg,#dd7a83,#e3bfc3);box-shadow:4px 4px #dd7a834d}.mood-btn:active{transform:translate(0);box-shadow:2px 2px #dd7a834d}.notes-container{background:linear-gradient(135deg,#e3bfc3f2,#e3bfc3d9);border:4px solid #DD7A83;padding:1.5rem;display:flex;flex-direction:column;gap:1rem;height:100%}.notes-header{font-size:.65rem;color:#dd7a83;text-align:center}.notes-textarea{flex:1;background:#fff;border:3px solid #DD7A83;padding:1rem;font-size:.6rem;color:#dd7a83;font-family:inherit;resize:none;outline:none;line-height:1.8;transition:all .1s ease}.notes-textarea::placeholder{color:#e3bfc3}.notes-textarea:focus{box-shadow:4px 4px #dd7a834d;transform:translate(-2px,-2px)}.daily-message-container{background:linear-gradient(135deg,#e3bfc3f2,#e3bfc3d9);border:4px solid #DD7A83;padding:1.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;cursor:pointer;transition:all .2s ease;position:relative}.daily-message-container:not(.opened):hover{transform:translate(-2px,-2px);box-shadow:6px 6px #dd7a8366}.daily-message-container:not(.opened):active{transform:translate(0);box-shadow:2px 2px #dd7a8366}.daily-message-container.opened{cursor:default;opacity:.8}.envelope{filter:drop-shadow(2px 2px 0px rgba(221,122,131,.3));animation:float 3s ease-in-out infinite}.daily-message-container:not(.opened) .envelope{animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.message-label{font-size:.6rem;color:#dd7a83;text-align:center;line-height:1.6}.message-modal-overlay{position:fixed;inset:0;background:#dd7a834d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease-out;padding:2rem}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.message-modal{background:linear-gradient(135deg,#e3bfc3fa,#e3bfc3f2);border:6px solid #DD7A83;padding:2.5rem;max-width:600px;width:100%;box-shadow:8px 8px #dd7a8380;animation:slideUp .4s ease-out;position:relative}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.message-header{font-size:.9rem;color:#dd7a83;text-align:center;margin-bottom:2rem;text-shadow:2px 2px 0px rgba(255,255,255,.5)}.message-content{background:#fff;border:4px solid #DD7A83;padding:2rem;margin-bottom:2rem}.message-content p{font-size:.65rem;line-height:2;color:#dd7a83;margin:0;text-align:center}.message-close-btn{width:100%;background:linear-gradient(135deg,#dd7a83,#e3bfc3);border:4px solid #DD7A83;color:#fff;font-size:.65rem;padding:1rem;cursor:pointer;transition:all .1s ease;font-family:inherit}.message-close-btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px #dd7a8366}.message-close-btn:active{transform:translate(0);box-shadow:2px 2px #dd7a8366}@media(max-width:640px){.message-modal{padding:1.5rem;max-width:90%}.message-content{padding:1.5rem}.message-content p{font-size:.6rem;line-height:1.8}}