body {
    font-family: LatoLatin;
    font-size: 16dp;
    background-color: #121212;
    color: #ffffff;
}

.app-bar {
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 56dp;
    background-color: #1e1e1e;
    padding: 0 8dp;
}

.app-bar-nav {
    width: 40dp;
    height: 40dp;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20dp;
}

.app-bar-nav:hover {
    background-color: #333333;
}

.icon {
    font-size: 24dp;
}

.app-bar-title {
    font-size: 20dp;
    font-weight: bold;
    margin-left: 16dp;
}

.content {
    padding: 16dp;
}

.card {
    background-color: #1e1e1e;
    border-radius: 12dp;
    padding: 16dp;
    margin-bottom: 12dp;
}

.card-title {
    font-size: 18dp;
    font-weight: bold;
    margin-bottom: 8dp;
    color: #bb86fc;
}

button {
    background-color: #bb86fc;
    color: #000000;
    border: none;
    border-radius: 8dp;
    padding: 12dp 24dp;
    font-size: 14dp;
    font-weight: bold;
    margin-top: 8dp;
}

button:hover {
    background-color: #cf9fff;
}

button:active {
    background-color: #9a67ea;
}

#results {
    font-family: monospace;
    font-size: 12dp;
    background-color: #0d0d0d;
    padding: 12dp;
    border-radius: 8dp;
    white-space: pre-wrap;
    color: #00ff00;
}