@import"https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap";body{margin:0;font-family:Roboto,sans-serif;background:#121212;color:#e0e0e0}.App{display:flex;flex-direction:column;align-items:center;padding:20px;max-width:600px;margin:0 auto}h1{font-size:2.5em;color:#e0e0e0;margin-bottom:20px}.board{background:#121212cc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.2);width:100%;min-height:50vh;padding:20px;border-radius:10px;box-shadow:0 4px 15px #0000001a;display:grid;gap:20px}.post-it{background:#121212cc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.2);padding:15px;box-shadow:0 4px 15px #0000001a;border-radius:10px;font-family:Roboto,sans-serif;max-width:100%;word-wrap:break-word;position:relative;margin-bottom:10px}.post-it .message-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.header{display:flex;flex-direction:column;justify-content:space-between;align-items:center;margin-bottom:10px;border:2px solid rgba(255,255,255,.2);width:100%;padding-bottom:20px;padding-left:20px;padding-right:20px;border-radius:10px;box-shadow:0 4px 15px #0000001a}.post-it .message-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:10px}.controls{display:flex;justify-content:space-between;width:100%;max-width:400px;margin-bottom:20px;margin-left:auto;margin-right:auto}.controls input{background:#1e1e1e;color:#e0e0e0;border:1px solid #333;flex:1;padding:10px;border-radius:5px;box-shadow:0 4px 15px #0000001a}.controls button{background:#f2613f;color:#fff;border:none;border-radius:5px;padding:10px 15px;cursor:pointer;transition:background .3s;box-shadow:0 4px 15px #0000001a;margin-right:10px}.controls button:hover{background:#1e1e1e}.message-edit{width:100%;box-sizing:border-box;overflow:hidden}.message-edit textarea{background:#1e1e1e;color:#e0e0e0;border:1px solid #333;width:100%;height:100%;border-radius:5px;padding:20px;font-family:Roboto,sans-serif;box-sizing:border-box;box-shadow:0 4px 15px #0000001a}.edit-actions{display:flex;justify-content:space-between;margin-top:10px}.edit-actions button{background:#ff5722;color:#fff;border:none;border-radius:5px;padding:10px 15px;cursor:pointer;transition:background .3s;box-shadow:0 4px 15px #0000001a}.edit-actions button:hover{background:#e64a19}.message-form{display:flex;flex-direction:column;gap:10px;width:100%;max-width:400px;margin-bottom:20px;margin-left:auto;margin-right:auto}.message-form input,.message-form textarea{padding:10px;border:1px solid #ccc;border-radius:5px;box-shadow:0 4px 15px #0000001a;font-family:Roboto,sans-serif}.message-form button{background:#f2613f;color:#fff;border:none;border-radius:5px;padding:10px;cursor:pointer;transition:background .3s;box-shadow:0 4px 15px #0000001a}.message-form button:hover{background:#1e1e1e}.no-messages{text-align:center;font-size:1.2em;color:#e0e0e0}.icon-button{background:none;border:none;cursor:pointer;padding:0;margin:0;color:#f2613f;transition:color .3s}.icon-button:hover{color:#f57c00}.icon{font-size:1.2em}.about-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#121212;padding:20px;border-radius:10px;box-shadow:0 4px 15px #0000004d;z-index:1000;border:2px solid rgba(255,255,255,.2)}.about-modal h2{color:#f2613f;margin-bottom:10px}.about-modal p{margin-bottom:20px}.about-modal button{background:#f2613f;color:#fff;border:none;border-radius:5px;padding:10px 15px;cursor:pointer;transition:background .3s}.about-modal button:hover{background:#e64a19}@media (max-width: 768px){.App{padding:10px}.board{grid-template-columns:1fr;gap:10px;margin-top:-50px}.controls{flex-direction:column;align-items:center;width:90%}.controls input{width:95%;margin-top:10px;margin-bottom:20px}.controls button{width:100%;margin-right:0;margin-bottom:10px}.about-modal{width:80%;padding:15px}.message-form{width:90%}}@media (max-width: 480px){h1{font-size:2em}.about-modal{width:80%;padding:15px}.post-it,.controls{max-width:100%}.controls button,.edit-actions button,.message-form button{padding:10px}.header,.board{border:none}.message-form{max-width:100%}.controls input{margin-bottom:0}}