.accounts-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: 30px; }
.account-box { background-color: #2a2a2e; padding: 25px; border-radius: 8px; border: 1px solid #3a3a3c; }
.account-box h3 { margin-top: 0; text-align: center; color: #a0a0a0; font-weight: normal; }
.account-balance { font-size: 2.2em; font-weight: bold; text-align: center; margin: 20px 0; }
.prijem { color: #2ecc71; }
.vydaj { color: #e74c3c; }
.account-box hr { border: 0; border-top: 1px solid #3a3a3c; margin: 20px 0; }
.account-form { display: flex; gap: 10px; margin-bottom: 10px; }
.account-form:last-child { margin-bottom: 0; }
.account-form input { flex-grow: 1; padding: 10px; border: 1px solid #555; background-color: #3a3a3c; color: #f5f5f5; border-radius: 4px; font-size: 1em; }
.account-form button { padding: 10px 20px; border: none; border-radius: 4px; color: #fff; font-weight: bold; cursor: pointer; transition: background-color 0.3s; }
.btn-prijem { background-color: #27ae60; }
.btn-prijem:hover { background-color: #2ecc71; }
.btn-vydaj { background-color: #c0392b; }
.btn-vydaj:hover { background-color: #e74c3c; }

@media (max-width: 600px) {
    .accounts-grid { grid-template-columns: 1fr; }
    .account-form { flex-direction: column; }
    .account-form input { width: 100%; box-sizing: border-box; }
}