.sage-ambient-v3-control {
    position: fixed;
    right: 14px;
    bottom: 14px;
    z-index: 2147481000;

    display: flex;
    align-items: center;
    gap: 5px;

    padding: 6px 8px;

    border: 1px solid rgba(215,182,93,.38);
    border-radius: 10px;

    background: rgba(8,8,10,.82);
    backdrop-filter: blur(7px);

    color: #e8d28e;

    font-family:
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    box-shadow:
        0 5px 20px rgba(0,0,0,.35);
}

.sage-ambient-v3-control button {
    appearance: none;
    border: 0;
    background: transparent;
    color: inherit;

    min-width: 34px;
    min-height: 34px;

    padding: 4px 7px;

    border-radius: 7px;

    cursor: pointer;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
}

.sage-ambient-v3-control button:hover,
.sage-ambient-v3-control button:focus-visible {
    background: rgba(215,182,93,.12);
    outline: 1px solid rgba(215,182,93,.4);
}

.sage-ambient-v3-title {
    max-width: 150px;

    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;

    font-size: 11px;
    opacity: .88;
}

.sage-ambient-v3-volume {
    width: 72px;
    accent-color: currentColor;
}

@media (max-width: 600px) {
    .sage-ambient-v3-control {
        right: 8px;
        bottom: 8px;

        padding: 5px 6px;
        gap: 3px;
    }

    .sage-ambient-v3-title {
        display: none;
    }

    .sage-ambient-v3-volume {
        width: 58px;
    }

    .sage-ambient-v3-control button {
        min-width: 36px;
        min-height: 36px;
    }
}
