.sac-container {
    max-width: 100%;
    margin: 20px auto;
    padding: 15px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
h1 { background: #6366f1; color: #fff; padding: 10px; border-radius: 4px; text-align: center; }
.sac-transaction {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr auto;
    gap: 5px;
    margin: 5px 0;
    padding: 5px;
    background: #f8fafc;
    border-radius: 4px;
}
.sac-transaction input {
    padding: 5px;
    border: 1px solid #ddd;
    border-radius: 4px;
}
.sac-add, .sac-calculate, .sac-reset {
    padding: 8px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    width: 100%;
    margin: 5px 0;
}
.sac-add { background: #e2e8f0; }
.sac-actions { display: flex; gap: 5px; }
.sac-calculate { background: #3b82f6; color: #fff; }
.sac-reset { background: #64748b; color: #fff; }
.sac-results table {
    width: 100%;
    border-collapse: collapse;
    margin: 10px 0;
}
.sac-results th, .sac-results td {
    padding: 5px;
    border: 1px solid #ddd;
}
#sac-chart { max-width: 100%; margin-top: 10px; }
@media (max-width: 600px) {
    .sac-transaction { grid-template-columns: 1fr; }
    .sac-actions { flex-direction: column; }
}