.rhythm-demo-touch {
    display: none;
}

@media (hover: none) and (pointer: coarse) {
    .rhythm-demo-touch {
        position: fixed;
        inset: 0;
        z-index: 100000;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 24px 16px;
        background: var(--sh-ground, #090E18);
        color: var(--sh-text, #F1F5FB);
    }
}

.rhythm-demo-touch__card {
    max-width: 420px;
    padding: 28px 24px;
    border: 1px solid var(--sh-line, rgba(198, 216, 244, 0.14));
    border-radius: var(--sh-radius, 10px);
    background: var(--sh-panel, #131C2B);
    text-align: center;
}

body.rhythm-mode .rhythm-demo-touch h1 {
    margin: 0 0 12px;
    font-size: 1.35rem;
    line-height: 1.3;
    color: inherit !important;
}

.rhythm-demo-touch p {
    margin: 0 0 14px;
    font-size: 0.98rem;
    line-height: 1.55;
    color: var(--sh-dim, rgba(226, 235, 248, 0.72));
}

.rhythm-demo-touch__url {
    font-family: var(--font-sans, system-ui, sans-serif);
    font-weight: 600;
    color: var(--sh-gold, #D9B87C) !important;
}

.rhythm-demo-touch__copy {
    display: block;
    width: 100%;
    margin: 4px 0 14px;
    padding: 12px 16px;
    border: 0;
    border-radius: var(--sh-radius-sm, 6px);
    background: var(--sh-gold, #D9B87C);
    color: var(--sh-on-light, #0B1119);
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
}

.rhythm-demo-touch__keyboard {
    display: block;
    width: 100%;
    margin: 0 0 14px;
    padding: 11px 16px;
    border: 1px solid var(--sh-line, rgba(198, 216, 244, 0.14));
    border-radius: var(--sh-radius-sm, 6px);
    background: transparent;
    color: var(--sh-text, #F1F5FB);
    font-size: 0.95rem;
    cursor: pointer;
}

.rhythm-demo-touch__home {
    color: var(--sh-dim, rgba(226, 235, 248, 0.72));
    font-size: 0.92rem;
}

#rhythmDemoSignupModal .rhythm-daily-limit-modal-icon img {
    display: block;
    margin: 0 auto;
    width: 44px;
    height: 44px;
}

body.rhythm-mode .song-path__end-link {
    color: var(--sh-gold, #D9B87C) !important;
    text-transform: uppercase;
    text-decoration: none;
    border-bottom: 1px solid color-mix(in srgb, var(--sh-gold, #D9B87C) 45%, transparent);
    padding-bottom: 2px;
}

body.rhythm-mode .song-path__end-link:hover {
    filter: brightness(1.15);
}