*{box-sizing:border-box;margin:0;padding:0}body{font-family:Arial,Helvetica,sans-serif;background-color:#fff8dc;color:#483d8b}h1{padding:20px;background-color:#8fbc8f;color:#2f4f4f;font-size:24px;letter-spacing:1px}.app-container{display:flex;gap:20px;max-width:900px;margin:24px auto;padding:0 16px}.calendar{flex:1;background:#fff0f5;border-radius:8px;padding:16;box-shadow:0 2px 6px #0000001a}.calendar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.calendar-header h2{font-size:18px}.calendar-header button{background:none;border:1px;border-radius:4px;padding:4px 12px;font-size:20px;cursor:pointer}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.day-header{text-align:center;font-weight:700;font-size:12px;color:#191970;padding:4px 0}.day-cell{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:44px;border-radius:4px;padding:4px;cursor:pointer}.day-cell.empty{cursor:default}.day-cell.date{background-color:#fff0f5;color:#191970}.day-cell.today{background-color:#191970;color:#fff0f5}.day-cell.selected{outline:2px solid darkseagreen}.event-marker{color:#191970;font-size:18px;line-height:1}.day-cell.today .event-marker{color:#fff0f5}.event-panel{width:280px;background:#fff8dc;border-radius:8px;padding:16px;box-shadow:0 2px 6px #0000001a;align-self:flex-start}.no-date-selected{color:#483d8b;font-style:italic}.event-panel h3{margin-bottom:12px;color:#2f4f4f}.event-list{list-style:none;margin-bottom:16px}.event-item{display:flex;justify-content:space-between;align-items:flex-start;padding:8px;border:1px solid midnightblue;border-radius:4px;margin-bottom:6px}.event-title{font-weight:700;font-size:14px}.event-description{font-size:12px;margin-top:2px;color:#2f4f4f}.add-event h4{margin-bottom:8px;font-size:14px}.add-event input{width:100%;padding:8px;margin-bottom:8px;border:1px solid midnightblue;border-radius:4px;font-size:14px}.add-event input:focus{outline:none;border-color:#8fbc8f}.add-event button{width:100%;padding:8px;background-color:#8fbc8f;color:#2f4f4f;border:none;border-radius:4px;cursor:pointer;font-size:14px}.add-event button:hover{background-color:#bee4be}.event-message{margin-top:8px;font-size:13px;color:#2f4f4f}.delete-button{background:none;border:none;color:#ea3838;cursor:pointer;font-size:14px;padding:0 4px;flex-shrink:0}.delete-button:hover{color:red}