body{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;background-color:#eef2f5;color:#333;margin:0;padding:20px}.container{max-width:800px;margin:0 auto;padding:20px;background-color:#fff;border-radius:8px;box-shadow:0 4px 8px #0000000d}.form{margin-bottom:30px;padding:20px;border:1px solid #e0e0e0;border-radius:8px;background-color:#fcfcfc}.form__group{margin-bottom:15px}.form__label{display:block;margin-bottom:5px;font-weight:700}.form__input{width:100%;padding:10px;border:1px solid #ccc;border-radius:4px;box-sizing:border-box}.form__button{background-color:#007bff;color:#fff;padding:10px 20px;border:none;border-radius:4px;cursor:pointer;font-size:1rem}.form__button:hover{background-color:#0056b3}.posts__heading{border-bottom:2px solid #eee;padding-bottom:10px;margin-bottom:20px}.posts__list{list-style:none;padding:0}.posts__item{background-color:#f9f9f9;border:1px solid #ddd;border-radius:8px;padding:16px;margin-bottom:16px;box-shadow:0 2px 4px #0000000d;display:flex;flex-direction:column}.posts__item-title{margin-top:0}.posts__item-body{flex-grow:1}.posts__item-actions{margin-top:16px;display:flex;gap:8px;justify-content:flex-end;align-items:center}.btn{padding:8px 16px;border:none;border-radius:4px;cursor:pointer;font-weight:700;transition:background-color .2s ease-in-out}.btn--edit{background-color:#28a745;color:#fff}.btn--edit:hover{background-color:#218838}.btn--delete{background-color:#dc3545;color:#fff}.btn--delete:hover{background-color:#c82333}.posts__item-form{display:flex;flex-direction:column;gap:12px;width:100%}.posts__item-input,.posts__item-textarea{width:100%;padding:10px;border:1px solid #ccc;border-radius:4px;font-family:inherit;font-size:1rem;box-sizing:border-box}.posts__item-textarea{min-height:100px;resize:vertical}:root{--primary-color: #61dafb;--background-color: #282c34;--card-background: #3a3f4b;--text-color: #ffffff;--text-secondary-color: #c7c7c7;--border-color: #4a505c;--btn-edit-bg: #4caf50;--btn-edit-hover-bg: #45a049;--btn-delete-bg: #f44336;--btn-delete-hover-bg: #da190b;--box-shadow: 0 4px 8px rgba(0, 0, 0, .2);--border-radius: 8px}body{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;background-color:var(--background-color);color:var(--text-color);margin:0;padding:2rem}.posts{max-width:1550px;margin:0 auto;padding:2rem}.posts__heading{text-align:center;font-size:2.5rem;margin-bottom:2rem;color:var(--primary-color);text-transform:uppercase;letter-spacing:2px}.posts__list{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2rem}.posts__item{background-color:var(--card-background);border-radius:var(--border-radius);padding:1.5rem;box-shadow:var(--box-shadow);display:flex;flex-direction:column;transition:transform .2s ease-in-out,box-shadow .2s ease-in-out}.posts__item:hover{transform:translateY(-5px);box-shadow:0 8px 16px #0000004d}.posts__item-title{font-size:1.25rem;color:var(--primary-color);margin:0 0 .75rem;text-transform:capitalize;line-height:1.4}.posts__item-body{font-size:1rem;color:var(--text-secondary-color);line-height:1.6;flex-grow:1;margin:0 0 1.5rem}.posts__item-actions{display:flex;gap:.5rem;margin-top:auto}.btn{padding:.6rem 1.2rem;border:none;border-radius:4px;color:#fff;font-size:.9rem;font-weight:700;cursor:pointer;transition:background-color .2s ease;text-transform:uppercase}.btn--edit{background-color:var(--btn-edit-bg)}.btn--edit:hover{background-color:var(--btn-edit-hover-bg)}.btn--delete{background-color:var(--btn-delete-bg)}.btn--delete:hover{background-color:var(--btn-delete-hover-bg)}.form{background-color:var(--card-background);padding:2rem;border-radius:var(--border-radius);margin-bottom:0rem;box-shadow:var(--box-shadow);max-width:600px;margin-left:auto;margin-right:auto}.form__heading{margin-top:0;text-align:center;color:var(--primary-color)}.form__group{margin-bottom:1.5rem}.form__label{display:block;margin-bottom:.5rem;font-weight:700;color:var(--text-secondary-color)}.form__input,.form__textarea{width:100%;padding:.75rem;border:1px solid var(--border-color);border-radius:4px;background-color:var(--background-color);color:var(--text-color);font-size:1rem;box-sizing:border-box;transition:border-color .2s ease}.form__input:focus,.form__textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px #61dafb4d}.form__textarea{resize:vertical;min-height:120px;font-family:inherit}.posts .btn--delete:hover{background-color:var(--btn-delete-hover-bg)}.btn--primary{width:100%;background-color:var(--primary-color);color:var(--background-color);font-weight:700}.btn--primary:hover{background-color:#4ab8d8}