.card button{background-color:#fff;border-radius:5px;border:1px solid #ccc;padding:5px 4px 3px;color:#ccc}.del:hover{transition:.2s;border:2px solid #f87171;color:#dc2626;background-color:#ff9d9d}.card p strong{color:#000}.card p{color:gray}.like{padding:6px 10px;border:2px solid #ccc;border-radius:6px;cursor:pointer;transition:all .2s ease-in-out}.like:hover{transition:.2s;border:2px solid orange;background-color:#fdeac3}.like.favorited{border:1px solid rgb(255,165,0);background-color:#fdeac3;color:#ff4500}.container{width:350px;margin:auto;font-family:"ui-sans-serif","system-ui","sans-serif","Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";border:1px solid white;border-radius:12px;box-shadow:2px 2px 45px 3px #e0e0e0}.content-wrapper{padding:1rem;max-width:900px;margin:0 auto}.header{background-color:#2563eb;color:#fff;padding:1rem 2rem;text-align:center;border-radius:15px 12px 0 0}.header h2{margin-bottom:.5rem;font-size:24px}.header p{margin:0;font-size:16px;opacity:.9}.inputGroup{display:flex;margin-bottom:10px;gap:10px}.inputGroup input{width:74%;border:1px solid #ccc;border-radius:4px;-webkit-transition:.1s;transition:.1s;outline:none}.inputGroup input[type=text]:focus{border:2px solid #2563eb}.inputGroup button{background-color:#4b83fc;color:#fff;border:#ffffff;border-radius:6px;padding:10px}.inputGroup button:hover{background-color:#2563eb;cursor:pointer}.friend-input{border-radius:5px;border:1px solid #ccc;font-size:16px;transition:border-color .2s,background-color .2s}.friend-input.input-error{border-color:#dc2626;background-color:#fee2e2}.error-message{color:#dc2626;margin:0 0 6px 4px;font-size:12px}.search-wrapper{position:relative;width:100%;max-width:400px;margin:1rem auto}.searchInput{width:84%;padding:10px 10px 10px 36px;border-radius:5px;border:1px solid #ccc;font-size:16px;transition:border-color .2s,box-shadow .2s}.searchInput:focus{border:2px solid #2563eb;outline:none}.search-icon{position:absolute;top:50%;left:10px;transform:translateY(-50%);color:#888;pointer-events:none}.card{border:1px solid #ddd;border-radius:8px;padding:5px;margin-bottom:10px;display:flex;justify-content:space-between;align-items:center}.card:hover{box-shadow:2px 4px #e7e6e6}.pagination{margin-top:1rem;display:flex;gap:.5rem;justify-content:center}.pagination button{padding:6px 10px;border:none;background-color:#e5e7eb;cursor:pointer;border-radius:4px}.pagination button.active{background-color:#2563eb;color:#fff}
